/*
 * Our CSS on top of stock nova-lite 1.0.8 and wp-attachments 4.1.1. See docs/render-fidelity.md.
 * Reference (owner, 2026-11-10): the stock local render for everything except navigation and submenus,
 * the Web Archive snapshots for navigation. So this file holds only:
 * 1. navigation and submenu rules written from the snapshot of the owner's style.css (2024-01-02);
 * 2. the file list the owner asked for (icons, "Завантажити" buttons);
 * 3. UI/UX fixes of clear defects, each marked below.
 */

/* 1. Navigation and submenus, from the snapshot. */
/* The snapshot had "УВІЙТИ" at the far right (removed by the spec); the other items stood 200 px left of the edge. */
@media screen and (min-width: 769px) {
	nav#mainmenu > ul {
		padding-right: 200px;
		box-sizing: border-box; /* the theme gives the list a fixed width */
	}
}

.tagcloud a {
	margin: 2px;
}

div.menu-sidebar_menu-container li a {
	background: none repeat scroll 0 0 #212121;
	border-bottom: 1px solid #333;
	color: #fff;
	display: block;
	font-family: "Oxygen", Verdana, Geneva, sans-serif;
	font-size: 14px;
	padding: 12px;
	transition: all 0.3s ease 0s;
}

div.menu-sidebar_menu-container ul.sub-menu {
	border: medium none;
	display: none;
	margin: 0;
	z-index: 9999;
}

div.menu-sidebar_menu-container li {
	border: medium none;
	cursor: pointer;
	padding: 0;
	position: relative;
}

#sidebar ul li:last-of-type {
	border-bottom: 0 none;
}

#sidebar li, .bottom_widget .widget-box li {
	border-bottom: 1px solid #ddd;
	padding: 0 0 5px;
}

#sidebar p, #sidebar li, #sidebar address, #sidebar dd, #sidebar blockquote, #sidebar td, #sidebar th, #sidebar .textwidget {
	color: #616161;
	font-family: "Oxygen", Verdana, Geneva, sans-serif;
	font-size: 14px;
	font-weight: 300;
	line-height: 1.9em;
}

#menu-sidebar_menu a {
	border: medium none;
	color: #fff;
}

#sub-menu {
	padding: 10px;
}

#sub-menu > li > a {
	padding: 30px;
}

.subcat a:hover, #back-to-top a:hover, nav#widgetmenu li a:hover, nav#widgetmenu li:hover > a, nav#widgetmenu li.current-menu-item > a, nav#widgetmenu li.current-menu-ancestor > a, .widget-category li a:hover, .toggle_container h5.element:hover, .toggle_container h5.inactive, .toggle_container h5.inactive:hover, .toggle_container h5.element:hover:last-of-type, .toggle_container h5.inactive:last-of-type, .toggle_container h5.inactive:hover:last-of-type {
	border-color: #1abc9c;
}

.subcat a:hover, #back-to-top a:hover, body.light #back-to-top a:hover, nav#widgetmenu li a:hover, nav#widgetmenu li:hover > a, nav#widgetmenu li.current-menu-item > a, nav#widgetmenu li.current-menu-ancestor > a, .pin-article .link a:hover, .pin-article .quote:hover, .skills .views.active, .skills .views:hover, .filter li:hover, .filter li.active, #searchform input[type="submit"]:hover, .contact-form input[type="submit"]:hover, .comment-form input[type="submit"]:hover, .widget-category li a:hover, .tagcloud a:hover, .tabs li a:hover, .tabs li.ui-tabs-active a, .tabs li.ui-state-active a, .socials a:hover, .button:hover, .wp-pagenavi a:hover, .wp-pagenavi span.current, #wp-calendar #today, #wp-calendar #today a {
	background-color: #1abc9c;
}

.subcat a:hover, nav#catmenu li a:hover, nav#widgetmenu li a:hover, nav#widgetmenu li:hover > a, nav#widgetmenu li.current-menu-item > a, nav#widgetmenu li.current-menu-ancestor > a {
	background: none repeat scroll 0 0 #1abc9c;
	border-bottom: 1px solid #1abc9c;
	color: #fff !important;
}

.subcat {
	display: inline-block;
	padding: 10px;
	text-align: center;
	font-family: 'Oxygen', Verdana, Geneva, sans-serif;
	font-size: 14px !important;
	-webkit-transition: all .3s ease;
	-moz-transition: all .3s ease;
	-o-transition: all .3s ease;
	background: #333;
	color: #fff !important;
	border: none;
	margin: 0px 25px 25px 25px;
}

.breadcrumbsdiv {
	padding-top: 50px;
	padding-left: 50px;
}

/* 2. File list. wp-attachments icons: the snapshot used class names with dashes (mime-application-pdf). */
/* wp-attachments icons: the snapshot used class names with dashes (mime-application-pdf). */
.post-attachment.mime-image-jpeg, .post-attachment.mime-image-png, .post-attachment.mime-image-gif { background-image: url(/wp-content/plugins/wp-attachments/styles/0/document-image.png); }
.post-attachment.mime-application-zip { background-image: url(/wp-content/plugins/wp-attachments/styles/0/document-zipper.png); }
.post-attachment.mime-application-pdf { background-image: url(/wp-content/plugins/wp-attachments/styles/0/document-pdf.png); }
.post-attachment.mime-audio-mpeg { background-image: url(/wp-content/plugins/wp-attachments/styles/0/document-music.png); }
.post-attachment.mime-application-vnd-ms-excel, .post-attachment.mime-application-vnd-openxmlformats-officedocument-spreadsheetml-sheet { background-image: url(/wp-content/plugins/wp-attachments/styles/0/document-excel.png); }
.post-attachment.mime-application-msword, .post-attachment.mime-application-vnd-openxmlformats-officedocument-wordprocessingml-document { background-image: url(/wp-content/plugins/wp-attachments/styles/0/document-word.png); }
.post-attachment.mime-application-vnd-oasis-opendocument-spreadsheet { background-image: url(/wp-content/plugins/wp-attachments/styles/0/document-ods.png); }
.post-attachment.mime-application-vnd-oasis-opendocument-text { background-image: url(/wp-content/plugins/wp-attachments/styles/0/document-odt.png); }

/* One file list per post (owner decision 2026-11-09): name, size and a "Завантажити" button per file. */
ul.post-attachments li.post-attachment {
	margin: 0 0 8px;
	line-height: 22px;
	text-indent: 0;
}
ul.post-attachments a.file-download {
	display: inline-block;
	margin-left: 10px;
	padding: 0 12px;
	border-radius: 11px;
	background: #32373c;
	color: #fff !important;
	font-size: 12px;
	line-height: 22px;
	text-decoration: none;
	vertical-align: middle;
	white-space: nowrap;
}
ul.post-attachments a.file-download:hover,
ul.post-attachments a.file-download:focus-visible {
	background: #1abc9c;
}

/*
 * 3. UI/UX fixes of clear defects (owner, 2026-11-10). Colors, fonts and layout stay as in the stock theme.
 * Before/after numbers: docs/render-fidelity.md, "UI/UX".
 */

/*
 * Captions: WordPress writes a fixed inline width and the theme caps it with max-width: 558px !important, wider than
 * a phone, so captioned photos pushed the page sideways. Same 558px on wide screens, never wider than the column.
 */
.wp-caption {
	max-width: min(558px, calc(100% - 8px)) !important; /* 8px: the theme's 4px padding on each side */
}

/* Narrow screens: wide tables scroll inside the column instead of the whole page; embeds fit the column. */
@media screen and (max-width: 979px) {
	.pin-article table {
		display: block;
		max-width: 100%;
		overflow-x: auto;
	}
	.pin-article iframe,
	.pin-article embed,
	.pin-article object,
	.pin-article video {
		max-width: 100%;
	}
}

/* Long file names have no spaces: let them wrap instead of running past the column. */
ul.post-attachments li.post-attachment > a:first-child {
	overflow-wrap: anywhere;
}

/* Phones: "Недавні записи" links were 17px tall, too small to tap reliably. */
@media screen and (max-width: 480px) {
	#sidebar .article > ul > li > a {
		display: inline-block;
		padding: 5px 0;
	}
}

/* Keyboard users see where focus is (the theme removed every outline). */
a:focus-visible,
select:focus-visible,
button:focus-visible,
input:focus-visible {
	outline: 2px solid #1abc9c;
	outline-offset: 2px;
}

/*
 * 4. Owner decisions of 2026-11-10 (approved proposals and reports). These are deliberate deviations from the stock
 * render; see docs/render-fidelity.md, "Решения владельца 10 ноября".
 */

/* Contrast to WCAG AA 4.5:1 on white, same hues: #919191 -> #767676 (3.15 -> 4.54), #0088cc -> #007dbc (3.89 -> 4.51). */
.entry-info,
.entry-info a {
	color: #767676;
}
a {
	color: #007dbc;
}

/* Phones: breadcrumb links and slider dots get a 44px tap area; padding with matching negative margins keeps the layout. */
@media screen and (max-width: 767px) {
	.breadcrumb-trail .trail-items a {
		display: inline-block;
		position: relative;
		z-index: 1; /* the title below otherwise covers the lower part of the tap area */
		padding: 14px 6px;
		margin: -14px -6px;
	}
	/* Above the slider theme rule (2px margins, dots 26px apart); its CSS is printed after ours. */
	.metaslider.ms-theme-nivo-bar .nivo-controlNav a.nivo-control {
		position: relative;
		margin-left: 10px;
		margin-right: 10px;
	}
	.metaslider.ms-theme-nivo-bar .nivo-controlNav a.nivo-control::after {
		content: "";
		position: absolute;
		left: 50%;
		top: 50%;
		width: 44px;
		height: 44px;
		transform: translate(-50%, -50%);
	}
}

/*
 * Post thumbnails fill the card edge to edge, keeping their aspect ratio, when the image is at least 70% of the card
 * width; a smaller image is shown at its own size, centered. --nw (natural width) comes from the mu-plugin. The width
 * below is a step: (nw - 70% of the card) * 1000 is either far above the card width or negative, so clamp() picks
 * the card width or the natural width (never more than the card).
 */
.pin-container {
	container-type: inline-size;
}
.pin-container .wp-post-image {
	display: block;
	max-width: none;
	height: auto;
	width: clamp(min(var(--nw, 100cqw), 100cqw), calc((var(--nw, 100cqw) - 70cqw) * 1000), 100cqw);
	margin-left: auto;
	margin-right: auto;
}
/*
 * The theme's hover script copies the image size onto the overlay link and the box as inline styles and never updates
 * them, so after a resize or an orientation change a dark box stuck out under the card. The overlay always covers the box.
 */
.pin-container .overlay-image.blog-thumb {
	width: auto !important;
}
.pin-container .overlay-image .link {
	top: 0;
	right: 0;
	bottom: 0;
	left: 0;
	width: auto !important;
	height: auto !important;
}

/* Site background covers the whole screen at any size; still fixed, as in the stock and archive renders (owner). */
body.custom-background {
	background-size: cover !important;
	background-position: center center !important;
}