/**
Theme Name: Astra Child
Author: Det Buaklee
Author URI: http://wpastra.com/about/
Description: Astra is the fastest, fully customizable & beautiful theme suitable for blogs, personal portfolios and business websites. It is very lightweight (less than 50KB on frontend) and offers unparalleled speed. Built with SEO in mind, Astra comes with schema.org code integrated so search engines will love your site. Astra offers plenty of sidebar options and widget areas giving you a full control for customizations. Furthermore, we have included special features and templates so feel free to choose any of your favorite page builder plugin to create pages flexibly. Some of the other features: # WooCommerce Ready # Responsive # Compatible with major plugins # Translation Ready # Extendible with premium addons # Regularly updated # Designed, Developed, Maintained & Supported by Brainstorm Force. Looking for a perfect base theme? Look no further. Astra is fast, fully customizable and beautiful theme!
Version: 1.0.1
License: GNU General Public License v2 or later
License URI: http://www.gnu.org/licenses/gpl-2.0.html
Text Domain: astra-child
Template: astra
*/

/* ==========================================================================
   Certificate Archive & Certificate Detail — "Accreditation Standard"
   design system (Stitch). Shared design tokens.
   ========================================================================== */
.cert-archive,
.cert-detail {
	--cert-primary: #002046;
	--cert-primary-container: #1b365d;
	--cert-on-primary-container: #87a0cd;
	--cert-secondary: #545f72;
	--cert-outline: #74777f;
	--cert-outline-variant: #c4c6cf;
	--cert-on-surface: #181c1e;
	--cert-on-surface-variant: #44474e;
	--cert-surface: #f7fafc;
	--cert-surface-variant: #e0e3e5;
	--cert-surface-container: #ebeef0;
	--cert-surface-container-lowest: #ffffff;
	--cert-tertiary-fixed: #9ff5c1;
	--cert-on-tertiary-fixed: #002111;
	--cert-error: #ba1a1a;
	--cert-error-container: #ffdad6;
	--cert-on-error-container: #93000a;
	font-family: 'Public Sans', sans-serif;
	color: var(--cert-on-surface);
}

/* Material Symbols (used by the screen) */
.cert-archive .material-symbols-outlined {
	font-family: 'Material Symbols Outlined';
	font-weight: normal;
	font-style: normal;
	line-height: 1;
	letter-spacing: normal;
	text-transform: none;
	display: inline-block;
	white-space: nowrap;
	word-wrap: normal;
	direction: ltr;
	font-variation-settings: 'FILL' 0, 'wght' 400, 'GRAD' 0, 'opsz' 24;
	-webkit-font-smoothing: antialiased;
}

.cert-archive__inner {
	max-width: 1280px;
	margin: 0 auto;
	padding: 32px;
}

@media (max-width: 767px) {
	.cert-archive__inner {
		padding: 16px 16px 32px;
	}
}

/* Labels (label-caps) */
.cert-label {
	display: block;
	font-size: 12px;
	line-height: 16px;
	font-weight: 700;
	letter-spacing: 0.05em;
	text-transform: uppercase;
	color: var(--cert-secondary);
	margin-bottom: 8px;
}

/* Breadcrumbs */
.cert-breadcrumbs {
	display: flex;
	align-items: center;
	gap: 6px;
	margin-bottom: 16px;
	font-size: 14px;
	line-height: 20px;
	color: var(--cert-secondary);
}

.cert-breadcrumbs a {
	color: inherit;
	text-decoration: none;
}

.cert-breadcrumbs a:hover {
	text-decoration: underline;
}

.cert-breadcrumbs .material-symbols-outlined {
	font-size: 18px;
}

.cert-breadcrumbs__current {
	font-weight: 700;
	color: var(--cert-primary);
}

/* Page title (headline-lg) */
.cert-archive__title {
	font-size: 32px;
	line-height: 40px;
	font-weight: 700;
	letter-spacing: -0.01em;
	color: var(--cert-primary);
	margin: 0 0 32px;
}

@media (max-width: 767px) {
	.cert-archive__title {
		font-size: 24px;
		line-height: 32px;
		margin-bottom: 16px;
	}
}

/* Search & filters panel */
.cert-filters {
	background: var(--cert-surface-container-lowest);
	border: 1px solid var(--cert-outline-variant);
	border-radius: 4px;
	padding: 16px;
	margin-bottom: 32px;
	box-shadow: 0 1px 2px rgba(0, 0, 0, 0.05);
}

.cert-filters__grid {
	display: grid;
	grid-template-columns: 1fr;
	gap: 16px;
	align-items: end;
}

@media (min-width: 768px) {
	.cert-filters__grid {
		grid-template-columns: repeat(12, 1fr);
	}

	.cert-filters__field--search {
		grid-column: span 5;
	}

	.cert-filters__field--scope {
		grid-column: span 3;
	}

	.cert-filters__field--status {
		grid-column: span 2;
	}

	.cert-filters__field--submit {
		grid-column: span 2;
		display: flex;
		justify-content: flex-end;
	}

	.cert-filters__field--submit .cert-filter-btn {
		width: 100%;
	}
}

.cert-search-wrap {
	position: relative;
}

.cert-search-wrap .material-symbols-outlined {
	position: absolute;
	left: 12px;
	top: 8px;
	font-size: 20px;
	color: var(--cert-outline);
	pointer-events: none;
}

.cert-input {
	width: 100%;
	padding: 8px 16px;
	font-family: inherit;
	font-size: 16px;
	line-height: 24px;
	color: var(--cert-on-surface);
	background: var(--cert-surface-container);
	border: 1px solid var(--cert-outline-variant);
	border-radius: 4px;
	transition: border-color 0.15s, box-shadow 0.15s;
}

.cert-input:focus {
	outline: none;
	border-color: var(--cert-primary-container);
	box-shadow: 0 0 0 1px var(--cert-primary-container);
}

.cert-search-wrap .cert-input {
	padding-left: 40px;
}

.cert-select {
	-webkit-appearance: none;
	-moz-appearance: none;
	appearance: none;
	padding-right: 36px;
	background-image: url("data:image/svg+xml;charset=UTF-8,%3csvg xmlns='http://www.w3.org/2000/svg' width='24' height='24' viewBox='0 0 24 24' fill='none' stroke='%2374777f' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3e%3cpolyline points='6 9 12 15 18 9'/%3e%3c/svg%3e");
	background-repeat: no-repeat;
	background-position: right 10px center;
	background-size: 16px;
	cursor: pointer;
}

.cert-filter-btn {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	gap: 8px;
	height: 40px;
	padding: 0 24px;
	font-family: inherit;
	font-size: 14px;
	font-weight: 600;
	line-height: 20px;
	color: #ffffff;
	background: var(--cert-primary-container);
	border: none;
	border-radius: 4px;
	cursor: pointer;
	text-decoration: none;
	transition: opacity 0.15s;
}

.cert-filter-btn:hover {
	opacity: 0.9;
}

/* Certificate list */
.cert-list {
	display: flex;
	flex-direction: column;
	gap: 16px;
	margin-bottom: 32px;
}

.cert-card {
	display: flex;
	flex-direction: column;
	gap: 16px;
	background: var(--cert-surface-container-lowest);
	border: 1px solid var(--cert-outline-variant);
	border-radius: 4px;
	padding: 16px;
	cursor: pointer;
	transition: background-color 0.15s;
}

.cert-card:hover {
	background: var(--cert-surface);
}

@media (min-width: 768px) {
	.cert-card {
		flex-direction: row;
		align-items: flex-start;
		justify-content: space-between;
	}

	.cert-card__main {
		flex-grow: 1;
	}
}

.cert-card__heading {
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	gap: 12px;
	margin-bottom: 8px;
}

.cert-card__title {
	margin: 0;
	font-size: 20px;
	line-height: 28px;
	font-weight: 600;
	color: var(--cert-primary);
}

.cert-card__title a {
	color: inherit;
	text-decoration: none;
}

.cert-card:hover .cert-card__title a {
	text-decoration: underline;
	text-decoration-color: var(--cert-primary);
}

/* Status badges */
.cert-badge {
	display: inline-flex;
	align-items: center;
	gap: 4px;
	padding: 2px 8px;
	border-radius: 2px;
	font-size: 12px;
	line-height: 16px;
	font-weight: 700;
	letter-spacing: 0.05em;
}

.cert-badge .material-symbols-outlined {
	font-size: 12px;
}

.cert-badge--active {
	background: var(--cert-tertiary-fixed);
	color: var(--cert-on-tertiary-fixed);
}

.cert-badge--expired {
	background: var(--cert-error-container);
	color: var(--cert-on-error-container);
}

.cert-card__number {
	font-size: 14px;
	line-height: 20px;
	font-weight: 500;
	color: var(--cert-secondary);
	margin-bottom: 12px;
}

.cert-card__scope {
	margin: 0;
	max-width: 72ch;
	font-size: 14px;
	line-height: 20px;
	color: var(--cert-on-surface-variant);
	display: -webkit-box;
	-webkit-line-clamp: 2;
	-webkit-box-orient: vertical;
	overflow: hidden;
}

/* Expiry / actions column */
.cert-card__meta {
	display: flex;
	flex-direction: row;
	align-items: center;
	justify-content: space-between;
	min-width: 120px;
	padding-top: 8px;
	border-top: 1px solid var(--cert-outline-variant);
}

@media (min-width: 768px) {
	.cert-card__meta {
		flex-direction: column;
		align-items: flex-end;
		justify-content: flex-start;
		padding-top: 0;
		border-top: none;
	}
}

.cert-card__expiry {
	display: flex;
	flex-direction: column;
	text-align: right;
}

.cert-card__expiry .cert-label {
	margin-bottom: 4px;
}

.cert-card__expiry-value {
	font-size: 16px;
	line-height: 24px;
	font-weight: 500;
	color: var(--cert-on-surface);
}

/* View details button (desktop) */
.cert-card__view {
	display: none;
	align-items: center;
	gap: 4px;
	padding: 6px 12px;
	margin-top: 16px;
	font-size: 14px;
	line-height: 20px;
	color: var(--cert-primary);
	text-decoration: none;
	border-radius: 4px;
	transition: background-color 0.15s;
}

.cert-card__view:hover {
	background: var(--cert-surface-variant);
}

.cert-card__view .material-symbols-outlined {
	font-size: 16px;
}

@media (min-width: 768px) {
	.cert-card__view {
		display: inline-flex;
	}
}

/* Expired cards */
.cert-card--expired .cert-card__title,
.cert-card--expired .cert-card__number,
.cert-card--expired .cert-card__scope {
	opacity: 0.8;
}

.cert-card--expired .cert-card__expiry-value {
	color: var(--cert-error);
}

.cert-card--expired .cert-card__view {
	color: var(--cert-on-surface-variant);
}

/* Pagination (styled like the screen's outline button) */
.cert-pagination {
	margin-top: 16px;
	text-align: center;
}

.cert-pagination .page-numbers {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	min-width: 40px;
	margin: 0 4px;
	padding: 10px 16px;
	font-size: 14px;
	font-weight: 600;
	color: var(--cert-primary);
	background: transparent;
	border: 1px solid var(--cert-primary-container);
	border-radius: 4px;
	text-decoration: none;
	transition: background-color 0.15s;
}

.cert-pagination .page-numbers:hover {
	background: var(--cert-surface-variant);
}

.cert-pagination .page-numbers.current {
	background: var(--cert-primary-container);
	color: #ffffff;
}

.cert-pagination .page-numbers.dots {
	border: none;
}

/* Empty state */
.cert-empty {
	padding: 48px 24px;
	text-align: center;
	background: var(--cert-surface-container-lowest);
	border: 1px solid var(--cert-outline-variant);
	border-radius: 4px;
	color: var(--cert-on-surface-variant);
}

.cert-empty p {
	margin: 0 0 16px;
	font-size: 16px;
	line-height: 24px;
}

/* ==========================================================================
   Certificate Detail — "Certificate Detail" screen
   (reuses the shared --cert-* tokens, .cert-label, .cert-breadcrumbs)
   ========================================================================== */

/* Material Symbols (same as the archive) */
.cert-detail .material-symbols-outlined {
	font-family: 'Material Symbols Outlined';
	font-weight: normal;
	font-style: normal;
	line-height: 1;
	letter-spacing: normal;
	text-transform: none;
	display: inline-block;
	white-space: nowrap;
	word-wrap: normal;
	direction: ltr;
	font-variation-settings: 'FILL' 0, 'wght' 400, 'GRAD' 0, 'opsz' 24;
	-webkit-font-smoothing: antialiased;
}

.cert-detail {
	max-width: 1280px;
	margin: 0 auto;
	padding: 32px;
}

@media (max-width: 767px) {
	.cert-detail {
		padding: 16px 16px 32px;
	}
}

/* ---- Header card (lab name, cert #, status, download) ---- */
.cert-detail__header {
	display: flex;
	flex-direction: column;
	justify-content: space-between;
	align-items: flex-start;
	gap: 16px;
	background: var(--cert-surface-container-lowest);
	border: 1px solid var(--cert-outline-variant);
	border-radius: 4px;
	padding: 32px;
	margin-bottom: 32px;
}

@media (min-width: 992px) {
	.cert-detail__header {
		flex-direction: row;
		align-items: center;
	}
}

.cert-detail__title {
	margin: 0 0 8px;
	font-size: 32px;
	line-height: 40px;
	font-weight: 700;
	letter-spacing: -0.01em;
	color: var(--cert-primary);
}

@media (max-width: 767px) {
	.cert-detail__title {
		font-size: 24px;
		line-height: 32px;
	}
}

.cert-detail__meta {
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	gap: 16px;
	font-size: 16px;
	line-height: 24px;
	color: var(--cert-secondary);
}

.cert-detail__meta strong {
	font-weight: 600;
	color: var(--cert-on-surface);
}

/* Status pill (design: light-green pill "Active & Compliant") */
.cert-detail__status {
	display: inline-flex;
	align-items: center;
	gap: 4px;
	padding: 4px 12px;
	border: 1px solid transparent;
	border-radius: 999px;
	font-size: 12px;
	line-height: 16px;
	font-weight: 700;
	letter-spacing: 0.05em;
	text-transform: uppercase;
}

.cert-detail__status .material-symbols-outlined {
	font-size: 12px;
}

.cert-detail__status--active {
	background: #f0fdf4;
	color: #166534;
	border-color: #bbf7d0;
}

.cert-detail__status--expired {
	background: var(--cert-error-container);
	color: var(--cert-on-error-container);
	border-color: var(--cert-error);
}

/* Download button (design: green filled button) */
.cert-detail__download {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	gap: 8px;
	width: 100%;
	padding: 12px 24px;
	font-size: 16px;
	font-weight: 500;
	line-height: 24px;
	color: #ffffff;
	background: #2f855a;
	border: none;
	border-radius: 4px;
	text-decoration: none;
	transition: background-color 0.15s;
}

.cert-detail__download:hover {
	background: #22543d;
	color: #ffffff;
}

@media (min-width: 992px) {
	.cert-detail__download {
		width: auto;
	}
}

/* ---- Main / sidebar grid ---- */
.cert-detail__grid {
	display: grid;
	grid-template-columns: 1fr;
	gap: 24px;
	align-items: start;
}

@media (min-width: 992px) {
	.cert-detail__grid {
		grid-template-columns: 2fr 1fr;
	}
}

.cert-detail__col {
	display: flex;
	flex-direction: column;
	gap: 32px;
	min-width: 0;
}

/* ---- Panels (cards) ---- */
.cert-panel {
	background: var(--cert-surface-container-lowest);
	border: 1px solid var(--cert-outline-variant);
	border-radius: 4px;
	overflow: hidden;
}

.cert-panel__head {
	display: flex;
	justify-content: space-between;
	align-items: center;
	gap: 12px;
	background: var(--cert-surface);
	padding: 12px 24px;
	border-bottom: 1px solid var(--cert-outline-variant);
}

.cert-panel__head h2,
.cert-panel__head h3 {
	margin: 0;
	font-size: 20px;
	line-height: 28px;
	font-weight: 600;
	color: var(--cert-primary);
}

.cert-panel__head-note {
	font-size: 14px;
	line-height: 20px;
	color: var(--cert-on-surface-variant);
}

.cert-panel__body {
	padding: 24px;
}

/* Stacked body (laboratory information rows) */
.cert-panel__body--stack .cert-info-row + .cert-info-row {
	margin-top: 16px;
}

/* ---- Accreditation Details meta grid ---- */
.cert-detail__meta-grid {
	display: grid;
	grid-template-columns: 1fr;
	gap: 16px;
}

@media (min-width: 768px) {
	.cert-detail__meta-grid {
		grid-template-columns: 1fr 1fr;
	}
}

.cert-detail__meta-grid .cert-label {
	margin-bottom: 4px;
}

.cert-detail__meta-value {
	display: block;
	font-size: 16px;
	line-height: 24px;
	color: var(--cert-on-surface);
}

/* ---- Scope of Accreditation table ---- */
.cert-scope-table-wrap {
	overflow-x: auto;
}

.cert-scope-table {
	width: 100%;
	border-collapse: collapse;
	font-size: 14px;
	line-height: 20px;
	text-align: left;
}

.cert-scope-table th {
	padding: 16px;
	background: var(--cert-surface);
	border-bottom: 1px solid var(--cert-outline-variant);
	font-size: 12px;
	line-height: 16px;
	font-weight: 700;
	letter-spacing: 0.05em;
	text-transform: uppercase;
	color: var(--cert-secondary);
	white-space: nowrap;
}

.cert-scope-table td {
	padding: 16px;
	border-bottom: 1px solid var(--cert-outline-variant);
	color: var(--cert-on-surface);
	vertical-align: top;
}

.cert-scope-table tbody tr:nth-child(even) {
	background: var(--cert-surface);
}

.cert-scope-table tbody tr:last-child td {
	border-bottom: none;
}

/* ---- Laboratory Information rows ---- */
.cert-info-row {
	display: flex;
	gap: 12px;
}

.cert-info-row > .material-symbols-outlined {
	flex-shrink: 0;
	font-size: 20px;
	color: var(--cert-secondary);
}

.cert-info-row__value {
	display: block;
	font-size: 14px;
	line-height: 20px;
	color: var(--cert-on-surface);
}

.cert-info-row__value--link {
	color: var(--cert-primary);
	text-decoration: none;
}

.cert-info-row__value--link:hover {
	text-decoration: underline;
}

/* ---- Related Documents list ---- */
.cert-doc-list {
	display: flex;
	flex-direction: column;
	gap: 8px;
}

.cert-doc-link {
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: 12px;
	padding: 12px;
	border: 1px solid var(--cert-outline-variant);
	border-radius: 4px;
	text-decoration: none;
	color: var(--cert-on-surface);
	transition: background-color 0.15s;
}

.cert-doc-link:hover {
	background: var(--cert-surface);
}

.cert-doc-link__icon {
	display: flex;
	align-items: center;
	gap: 12px;
	min-width: 0;
}

.cert-doc-link__icon > .material-symbols-outlined {
	flex-shrink: 0;
	font-size: 20px;
	color: var(--cert-secondary);
	transition: color 0.15s;
}

.cert-doc-link:hover .cert-doc-link__icon > .material-symbols-outlined {
	color: var(--cert-primary);
}

.cert-doc-link__title {
	display: block;
	font-size: 14px;
	font-weight: 500;
	line-height: 20px;
	color: var(--cert-on-surface);
	overflow-wrap: anywhere;
}

.cert-doc-link__meta {
	display: block;
	font-size: 12px;
	line-height: 16px;
	font-weight: 700;
	letter-spacing: 0.05em;
	text-transform: uppercase;
	color: var(--cert-secondary);
}

.cert-doc-link__dl {
	font-size: 20px;
	color: var(--cert-secondary);
	transition: color 0.15s;
}

.cert-doc-link:hover .cert-doc-link__dl {
	color: var(--cert-primary);
}

/* ---- Previous / Next certificate navigation (blog style) ---- */
.cert-post-nav {
	display: flex;
	justify-content: space-between;
	gap: 16px;
	margin-top: 32px;
	padding-top: 24px;
	border-top: 1px solid var(--cert-outline-variant);
}

.cert-post-nav__link {
	display: flex;
	align-items: flex-start;
	gap: 12px;
	max-width: calc(50% - 8px);
	text-decoration: none;
	color: var(--cert-on-surface);
}

.cert-post-nav__icon {
	display: flex;
	flex-shrink: 0;
	color: var(--cert-secondary);
	transition: color 0.15s, transform 0.15s;
}

.cert-post-nav__icon .material-symbols-outlined {
	font-size: 24px;
}

.cert-post-nav__text {
	display: flex;
	flex-direction: column;
	gap: 2px;
	min-width: 0;
}

.cert-post-nav__text .cert-label {
	margin-bottom: 0;
}

.cert-post-nav__title {
	display: block;
	font-size: 16px;
	line-height: 24px;
	font-weight: 600;
	color: var(--cert-primary);
	white-space: nowrap;
	overflow: hidden;
	text-overflow: ellipsis;
}

.cert-post-nav__link--next {
	flex-direction: row-reverse;
	text-align: right;
}

.cert-post-nav__link:hover .cert-post-nav__title {
	text-decoration: underline;
	text-decoration-color: var(--cert-primary);
}

.cert-post-nav__link--prev:hover .cert-post-nav__icon {
	color: var(--cert-primary);
	transform: translateX(-2px);
}

.cert-post-nav__link--next:hover .cert-post-nav__icon {
	color: var(--cert-primary);
	transform: translateX(2px);
}

@media (max-width: 767px) {
	.cert-post-nav {
		flex-direction: column;
	}

	.cert-post-nav__link {
		max-width: 100%;
	}
}

/* ==========================================================================
   Document Library — "Accreditation Standard" design system (Stitch
   "Document Library" screen).
   ========================================================================== */
.doc-library {
	--doc-primary: #002046;
	--doc-primary-container: #1b365d;
	--doc-secondary: #545f72;
	--doc-outline-variant: #c4c6cf;
	--doc-on-surface: #181c1e;
	--doc-on-surface-variant: #44474e;
	--doc-surface: #f7fafc;
	--doc-surface-dim: #d7dadc;
	--doc-surface-container-lowest: #ffffff;
	--doc-secondary-container: #d5e0f7;
	--doc-on-secondary-container: #586377;
	--doc-tertiary: #2f855a;
	font-family: 'Public Sans', sans-serif;
	color: var(--doc-on-surface);
}

/* Enforce the design-system font within the screen (Astra applies the
   theme body font to inner elements). */
.doc-library,
.doc-library * {
	font-family: 'Public Sans', sans-serif;
}

.doc-library .material-symbols-outlined {
	font-family: 'Material Symbols Outlined';
	font-weight: normal;
	font-style: normal;
	line-height: 1;
	letter-spacing: normal;
	text-transform: none;
	display: inline-block;
	white-space: nowrap;
	word-wrap: normal;
	direction: ltr;
	font-variation-settings: 'FILL' 0, 'wght' 400, 'GRAD' 0, 'opsz' 24;
	-webkit-font-smoothing: antialiased;
}

.doc-library__inner {
	max-width: 1280px;
	margin: 0 auto;
	padding: 32px;
}

@media (max-width: 767px) {
	.doc-library__inner {
		padding: 24px 16px;
	}
}

.doc-library__title {
	margin: 8px 0 0;
	font-size: 32px;
	line-height: 40px;
	font-weight: 700;
	letter-spacing: -0.01em;
	color: var(--doc-primary);
}

@media (max-width: 767px) {
	.doc-library__title {
		font-size: 24px;
		line-height: 32px;
	}
}

.doc-library__intro {
	margin: 8px 0 0;
	max-width: 42rem;
	font-size: 16px;
	line-height: 24px;
	color: var(--doc-on-surface-variant);
}

/* Search & filter bar */
.doc-filters {
	display: flex;
	flex-direction: column;
	gap: 16px;
	align-items: center;
	background: var(--doc-surface-container-lowest);
	border: 1px solid var(--doc-outline-variant);
	border-radius: 4px;
	padding: 16px;
	margin: 24px 0;
}

@media (min-width: 768px) {
	.doc-filters {
		flex-direction: row;
	}
}

.doc-filters__search {
	position: relative;
	width: 100%;
}

@media (min-width: 768px) {
	.doc-filters__search {
		width: 66.66%;
	}
}

.doc-filters__search .material-symbols-outlined {
	position: absolute;
	left: 12px;
	top: 50%;
	transform: translateY(-50%);
	color: var(--doc-on-surface-variant);
	pointer-events: none;
}

.doc-filters__row {
	display: flex;
	gap: 8px;
	width: 100%;
}

@media (min-width: 768px) {
	.doc-filters__row {
		width: 33.33%;
	}
}

.doc-input {
	width: 100%;
	padding: 8px 12px;
	background: var(--doc-surface);
	border: 1px solid var(--doc-outline-variant);
	border-radius: 4px;
	font-family: inherit;
	font-size: 16px;
	line-height: 24px;
	color: var(--doc-on-surface);
	outline: none;
	transition: border-color 0.15s;
}

.doc-input:focus {
	border-color: var(--doc-primary);
	box-shadow: 0 0 0 1px var(--doc-primary);
}

input[type="search"].doc-filters__input {
	padding-left: 40px;
}

.doc-filters__select {
	flex: 1;
	min-width: 0;
	cursor: pointer;
}

.doc-filter-btn {
	background: var(--doc-primary-container);
	color: #fff;
	border: none;
	border-radius: 4px;
	padding: 8px 24px;
	font-family: inherit;
	font-size: 16px;
	line-height: 24px;
	font-weight: 500;
	cursor: pointer;
	white-space: nowrap;
	transition: opacity 0.15s;
}

.doc-filter-btn:hover {
	opacity: 0.9;
}

/* Category tabs */
.doc-tabs {
	display: flex;
	overflow-x: auto;
	scrollbar-width: none;
	border-bottom: 1px solid var(--doc-outline-variant);
	margin-bottom: 16px;
}

.doc-tabs::-webkit-scrollbar {
	display: none;
}

.doc-tabs__link {
	flex-shrink: 0;
	padding: 12px 24px;
	border-bottom: 2px solid transparent;
	font-size: 20px;
	line-height: 28px;
	font-weight: 600;
	color: var(--doc-on-surface-variant);
	text-decoration: none;
	transition: color 0.15s, border-color 0.15s;
}

.doc-tabs__link:hover {
	color: var(--doc-on-surface);
	border-bottom-color: var(--doc-outline-variant);
}

.doc-tabs__link.is-active {
	border-bottom-color: var(--doc-primary-container);
	color: var(--doc-primary);
}

/* Document table */
.doc-table-wrap {
	background: var(--doc-surface-container-lowest);
	border: 1px solid var(--doc-outline-variant);
	border-radius: 4px;
	overflow: hidden;
}

.doc-table {
	width: 100%;
	border-collapse: collapse;
	text-align: left;
}

.doc-table thead {
	background: var(--doc-surface);
	border-bottom: 1px solid var(--doc-outline-variant);
}

.doc-table__th {
	padding: 12px 16px;
	font-size: 12px;
	line-height: 16px;
	font-weight: 700;
	letter-spacing: 0.05em;
	text-transform: uppercase;
	color: var(--doc-on-surface-variant);
}

.doc-table__th--title {
	width: 50%;
}

.doc-table__th--action,
.doc-table__cell--action {
	text-align: right;
}

.doc-table__row {
	border-bottom: 1px solid var(--doc-outline-variant);
	background: var(--doc-surface-container-lowest);
	transition: background-color 0.15s;
}

.doc-table__row:nth-child(even) {
	background: var(--doc-surface);
}

.doc-table__row:hover {
	background: var(--doc-surface);
}

.doc-table__row:last-child {
	border-bottom: none;
}

.doc-table__cell {
	padding: 12px 16px;
	font-size: 16px;
	line-height: 24px;
	vertical-align: middle;
}

.doc-table__cell--updated,
.doc-table__cell--size {
	color: var(--doc-on-surface-variant);
}

/* Title & ID cell */
.doc-doc {
	display: flex;
	align-items: flex-start;
	gap: 12px;
}

.doc-doc__icon {
	color: var(--doc-primary);
	font-size: 24px;
	margin-top: 2px;
}

.doc-doc__title {
	margin: 0;
	font-size: 16px;
	line-height: 24px;
	font-weight: 500;
	color: var(--doc-primary-container);
}

.doc-doc__code {
	margin: 4px 0 0;
	font-size: 14px;
	line-height: 20px;
	font-weight: 500;
	color: var(--doc-on-surface-variant);
}

/* Size / type cell */
.doc-size {
	display: flex;
	flex-direction: column;
}

.doc-size__value {
	font-size: 14px;
	line-height: 20px;
	color: var(--doc-on-surface-variant);
}

.doc-badge {
	display: inline-flex;
	align-items: center;
	width: max-content;
	margin-top: 4px;
	padding: 2px 8px;
	border-radius: 4px;
	font-size: 10px;
	line-height: 14px;
	font-weight: 700;
	letter-spacing: 0.05em;
	text-transform: uppercase;
	background: var(--doc-surface-dim);
	color: var(--doc-on-surface-variant);
}

.doc-badge--docx {
	background: var(--doc-secondary-container);
	color: var(--doc-on-secondary-container);
}

.doc-badge--xlsx {
	background: var(--doc-secondary-container);
	color: var(--doc-on-secondary-container);
}

/* Download action */
.doc-download {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	width: 32px;
	height: 32px;
	border-radius: 4px;
	color: var(--doc-tertiary);
	transition: background-color 0.15s;
}

.doc-download:hover {
	background: rgba(47, 133, 90, 0.1);
}

.doc-download .material-symbols-outlined {
	font-size: 20px;
}

/* Table footer / pagination */
.doc-table__footer {
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	justify-content: space-between;
	gap: 12px;
	background: var(--doc-surface);
	border-top: 1px solid var(--doc-outline-variant);
	padding: 12px 16px;
}

.doc-table__count {
	font-size: 14px;
	line-height: 20px;
	color: var(--doc-on-surface-variant);
}

.doc-pagination .nav-links {
	display: flex;
	flex-wrap: wrap;
	gap: 4px;
}

.doc-pagination .page-numbers {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	min-width: 32px;
	padding: 4px 12px;
	border-radius: 4px;
	font-size: 14px;
	line-height: 20px;
	color: var(--doc-on-surface);
	text-decoration: none;
	transition: background-color 0.15s;
}

.doc-pagination .page-numbers:hover {
	background: var(--doc-surface-variant, #e0e3e5);
}

.doc-pagination .page-numbers.current {
	background: var(--doc-primary-container);
	color: var(--doc-on-primary-container, #87a0cd);
}

.doc-pagination .page-numbers.prev,
.doc-pagination .page-numbers.next {
	position: relative;
	padding: 4px 8px;
	color: var(--doc-on-surface-variant);
	text-indent: -9999px;
	overflow: hidden;
}

.doc-pagination .page-numbers.prev::before,
.doc-pagination .page-numbers.next::before {
	position: absolute;
	inset: 0;
	margin: 0 auto;
	text-indent: 0;
	font-family: 'Material Symbols Outlined';
	font-size: 20px;
}

.doc-pagination .page-numbers.prev::before {
	content: 'chevron_left';
}

.doc-pagination .page-numbers.next::before {
	content: 'chevron_right';
}

.doc-pagination .page-numbers.disabled {
	opacity: 0.5;
	pointer-events: none;
}

/* Responsive: hide "Last Updated" on small screens (design: hidden < md) */
@media (max-width: 767px) {
	.doc-table__th--updated,
	.doc-table__cell--updated {
		display: none;
	}
}

@media (max-width: 479px) {
	.doc-table__th--size,
	.doc-table__cell--size {
		display: none;
	}
}

/* ==========================================================================
   Contact Us — "Contact Us - NLAA" screen (Laboratory Accreditation
   Archive project) — Accreditation Standard design system.
   Reuses the .cert-detail wrapper (design tokens, Public Sans, Material
   Symbols) plus the existing .cert-panel / .cert-info-row components from
   the Certificate Detail screen above. Only the header text and the map
   placeholder need page-specific rules.
   ========================================================================== */
.contact-page__map {
	position: relative;
	min-height: 200px;
	margin-top: 8px;
	overflow: hidden;
	border: 1px solid var(--cert-outline-variant);
	border-radius: 4px;
	background: var(--cert-surface-variant) center/cover no-repeat;
}

.contact-page__map-label {
	position: absolute;
	right: 12px;
	bottom: 12px;
	padding: 4px 10px;
	border: 1px solid var(--cert-outline-variant);
	border-radius: 4px;
	background: rgba(255, 255, 255, 0.9);
	font-size: 12px;
	color: var(--cert-on-surface);
}