html:root {
	color-scheme: light;

	--color-primary: #006d73;
	--color-primary-hover: #00565b;
	--color-primary-soft: #e6f4f4;
	--color-accent: #c77b00;
	--color-text: #17212b;
	--color-text-muted: #52606d;
	--color-surface: #fff;
	--color-surface-subtle: #f5f7f8;
	--color-border: #c9d1d9;
	--color-focus: #00858a;
	--color-success: #1f7a4d;
	--color-warning: #9a6700;
	--color-error: #b42318;
	--color-info: #1769aa;
	--color-disabled-bg: #eef1f3;
	--color-disabled-text: #697683;
	--button-primary-bg: var(--color-primary);
	--button-primary-bg-hover: var(--color-primary-hover);
	--button-primary-text: #fff;
	--button-secondary-bg: var(--color-surface-subtle);
	--button-secondary-bg-hover: #e5eaee;
	--button-secondary-text: var(--color-text);
	--button-danger-bg: var(--color-error);
	--button-danger-text: #fff;

	--font-sans: "Noto Sans", Arial, Helvetica, sans-serif;
	--font-size-fine: 13px;
	--font-size-meta: 14px;
	--font-size-card-title: 15px;
	--font-size-body: 16px;
	--font-size-h3: 20px;
	--font-size-h2: 24px;
	--font-size-h1: 32px;
	--line-height-tight: 1.25;
	--line-height-heading: 1.3;
	--line-height-body: 1.5;

	--space-1: 4px;
	--space-2: 8px;
	--space-3: 12px;
	--space-4: 16px;
	--space-5: 24px;
	--space-6: 32px;
	--space-7: 48px;
	--space-8: 64px;

	--radius-sm: 4px;
	--radius-md: 6px;
	--radius-lg: 8px;
	--control-height: 44px;
	--input-height: 46px;
	--container-width: 1224px;
	--shadow-menu: 0 8px 24px rgb(23 33 43 / 12%);

	--wd-primary-color: var(--color-primary);
	--wd-alternative-color: var(--color-accent);
	--wd-text-color: var(--color-text-muted);
	--wd-title-color: var(--color-text);
	--wd-entities-title-color: var(--color-text);
	--wd-entities-title-color-hover: var(--color-primary-hover);
	--wd-link-color: var(--color-text);
	--wd-link-color-hover: var(--color-primary);
	--wd-main-bgcolor: var(--color-surface);
	--wd-widget-title-color: var(--color-text);
	--wd-navigation-color: 23, 33, 43;
	--wd-text-font: var(--font-sans);
	--wd-title-font: var(--font-sans);
	--wd-entities-title-font: var(--font-sans);
	--wd-widget-title-font: var(--font-sans);
	--wd-header-el-font: var(--font-sans);
	--wd-alternative-font: var(--font-sans);
	--wd-text-font-size: var(--font-size-body);
	--wd-text-line-height: var(--line-height-body);
	--wd-title-font-weight: 700;
	--wd-entities-title-font-weight: 600;
	--wd-widget-title-font-weight: 600;
	--wd-header-el-font-size: var(--font-size-meta);
	--wd-header-el-font-weight: 600;
	--wd-brd-radius: var(--radius-md);
	--wd-container-w: var(--container-width);
	--wd-form-height: var(--input-height);
	--wd-form-bg: var(--color-surface);
	--wd-form-color: var(--color-text);
	--wd-form-placeholder-color: var(--color-text-muted);
	--wd-form-brd-color: var(--color-border);
	--wd-form-brd-color-focus: var(--color-primary);
	--wd-form-brd-radius: var(--radius-md);
	--wd-form-brd-width: 1px;
	--btn-accented-bgcolor: var(--button-primary-bg);
	--btn-accented-bgcolor-hover: var(--button-primary-bg-hover);
	--btn-accented-color: var(--button-primary-text);
	--btn-accented-color-hover: var(--button-primary-text);
	--btn-accented-brd-radius: var(--radius-md);
	--btn-accented-font-family: var(--font-sans);
	--btn-accented-font-weight: 600;
	--btn-accented-transform: none;
	--btn-default-bgcolor: var(--button-secondary-bg);
	--btn-default-bgcolor-hover: var(--button-secondary-bg-hover);
	--btn-default-color: var(--button-secondary-text);
	--btn-default-color-hover: var(--button-secondary-text);
	--btn-default-brd-radius: var(--radius-md);
	--btn-default-font-family: var(--font-sans);
	--btn-default-font-weight: 600;
	--btn-default-transform: none;
}

html:root[lang^="hy"] {
	--font-sans: "Noto Sans Armenian", "Noto Sans", Arial, Helvetica, sans-serif;
}

html body {
	background-color: var(--color-surface);
	color: var(--color-text-muted);
	font-family: var(--font-sans);
	font-size: var(--font-size-body);
	line-height: var(--line-height-body);
	letter-spacing: 0;
}

.main-page-wrapper :where(h1, h2, h3, h4, h5, h6) {
	color: var(--color-text);
	font-family: var(--font-sans);
	letter-spacing: 0;
}

.main-page-wrapper h1 {
	font-size: var(--font-size-h1);
	font-weight: 700;
	line-height: var(--line-height-tight);
}

.main-page-wrapper h2:not(.wd-entities-title) {
	font-size: var(--font-size-h2);
	font-weight: 700;
	line-height: var(--line-height-heading);
}

.main-page-wrapper h3:not(.wd-entities-title, .widget-title) {
	font-size: var(--font-size-h3);
	font-weight: 600;
	line-height: 1.4;
}

html body .wd-loop-builder-off .wd-product .wd-entities-title {
	font-size: var(--font-size-card-title);
	line-height: 1.45;
}

html body .main-page-wrapper a.button,
body .main-page-wrapper button:not(.mfp-close, .wd-close-side),
body .main-page-wrapper input[type="button"],
body .main-page-wrapper input[type="submit"] {
	background-color: var(--color-primary);
	border-radius: var(--radius-md);
	font-family: var(--font-sans);
	letter-spacing: 0;
	min-height: var(--control-height);
}

html body .wd-loop-builder-off .wd-product .wd-bottom-actions .wd-add-btn > a.button {
	background-color: var(--color-primary);
	border-radius: var(--radius-md);
	min-height: var(--control-height);
}

html body .main-page-wrapper a.button:hover,
body .main-page-wrapper button:not(.mfp-close, .wd-close-side):hover,
body .main-page-wrapper input[type="button"]:hover,
body .main-page-wrapper input[type="submit"]:hover {
	background-color: var(--color-primary-hover);
}

body input[type="date"],
body input[type="email"],
body input[type="number"],
body input[type="password"],
body input[type="search"],
body input[type="tel"],
body input[type="text"],
body input[type="url"],
body select,
body textarea {
	border-color: var(--color-border);
	border-radius: var(--radius-md);
	font-family: var(--font-sans);
	font-size: var(--font-size-body);
	letter-spacing: 0;
}

body :where(
	a,
	button,
	input,
	select,
	textarea,
	[tabindex]:not([tabindex="-1"])
):focus-visible {
	outline: 2px solid var(--color-focus) !important;
	outline-offset: 2px;
}

body .main-page-wrapper button:disabled,
body .main-page-wrapper .button:disabled,
body .main-page-wrapper input[type="button"]:disabled,
body .main-page-wrapper input[type="submit"]:disabled {
	background-color: var(--color-disabled-bg);
	border-color: var(--color-border);
	color: var(--color-disabled-text);
	cursor: not-allowed;
	opacity: 1;
}

::selection {
	background-color: var(--color-primary-soft);
	color: var(--color-text);
}

@media (max-width: 767px) {
	html:root {
		--font-size-h1: 26px;
		--font-size-h2: 22px;
		--font-size-h3: 18px;
	}
}