/*
 * Theme additions.
 *
 * Styles for markup this theme introduces that the vendor CSS knows nothing
 * about. Kept separate from main.css so the vendor file stays untouched and
 * can be replaced wholesale if the template is ever updated.
 *
 * Loaded after main.css and before rtl.css.
 */

/* ---------------------------------------------------------------------------
 * Screen-reader text
 *
 * WordPress core markup and several of this theme's partials use this class to
 * label controls that are visually represented by an icon. Without a
 * definition the text renders on screen — the vendor CSS does not provide one.
 * This is the standard WordPress implementation.
 * ------------------------------------------------------------------------- */
.screen-reader-text {
	border: 0;
	clip-path: inset(50%);
	height: 1px;
	margin: -1px;
	overflow: hidden;
	padding: 0;
	position: absolute;
	width: 1px;
	word-wrap: normal !important;
}

.screen-reader-text:focus {
	background-color: #fff;
	clip-path: none;
	color: #21212d;
	display: block;
	font-size: 0.875rem;
	height: auto;
	left: 5px;
	line-height: normal;
	padding: 15px 23px 14px;
	text-decoration: none;
	top: 5px;
	width: auto;
	z-index: 100000;
}

/* ---------------------------------------------------------------------------
 * Language switcher
 * ------------------------------------------------------------------------- */
.spamed-lang-switcher {
	align-items: center;
	display: inline-flex;
	gap: 10px;
}

.spamed-lang-switcher__item {
	align-items: center;
	display: inline-flex;
	gap: 6px;
	line-height: 1;
	opacity: 0.55;
	transition: opacity 0.25s ease;
}

.spamed-lang-switcher__item:hover,
.spamed-lang-switcher__item:focus-visible {
	opacity: 1;
}

.spamed-lang-switcher__item.active {
	opacity: 1;
	font-weight: 600;
}

.spamed-lang-switcher__item img {
	border-radius: 2px;
	display: block;
	height: 20px;
	width: 20px;
	object-fit: cover;
}

/* Hide the label on narrow screens; the flag carries the meaning. */
@media (max-width: 575.98px) {
	.spamed-lang-switcher__item span {
		display: none;
	}
}

/* ---------------------------------------------------------------------------
 * Product filter
 * ------------------------------------------------------------------------- */
.filter-reset {
	display: inline-block;
	font-size: 0.875rem;
	opacity: 0.7;
	text-decoration: underline;
}

.filter-reset:hover,
.filter-reset:focus-visible {
	opacity: 1;
}

/* ---------------------------------------------------------------------------
 * Contact form response
 *
 * ajax-form.js toggles .success / .error on this element.
 * ------------------------------------------------------------------------- */
.ajax-response {
	margin-top: 12px;
	min-height: 1.2em;
}

.ajax-response.success {
	color: #0c5752;
}

.ajax-response.error {
	color: #c0392b;
}

/* ---------------------------------------------------------------------------
 * Product detail tables
 * ------------------------------------------------------------------------- */
.it-product-details-specs {
	border-collapse: collapse;
	margin: 24px 0;
	width: 100%;
}

.it-product-details-specs th,
.it-product-details-specs td {
	border-bottom: 1px solid rgba(33, 33, 45, 0.12);
	padding: 10px 4px;
	text-align: start;
	vertical-align: top;
}

.it-product-details-specs th {
	font-weight: 600;
	white-space: nowrap;
	width: 40%;
}

.it-product-details-meta,
.it-product-details-docs {
	list-style: none;
	margin: 0 0 24px;
	padding: 0;
}

.it-product-details-meta li,
.it-product-details-docs li {
	padding: 6px 0;
}
