/*
Theme Name:   DrustvoSJK
Description:  Zasnovana na temi Sinatra
Author:       Milan Šipovac
Author URL:   Write here the author's blog or website url
Template:     sinatra
Version:      1.0
License:      GNU General Public License v2 or later
License URI:  http://www.gnu.org/licenses/gpl-2.0.html
Text Domain:  DrutvozasrpskijezikiknjievnostSrbije
*/

/* =========================================================
   BRAND COLOR SCHEME
   Recolors every element Sinatra ties to its accent color.
   Change these three values to recolor the whole site:
     --brand        = main accent color
     --brand-hover  = lighter shade used on hover
     --brand-rgb    = same color as R,G,B (for translucent tints)
   ========================================================= */
:root {
	--brand: #68BA7F;
	--brand-hover: #83c998;
	--brand-rgb: 104, 186, 127;
}

/* --- Accent as BACKGROUND (buttons, badges, widget-title bars, checkboxes, sliders) --- */
#si-scroll-top:hover::before,
.si-btn,
input[type=submit],
input[type=reset],
.comment-form input[type=checkbox]:checked,
#comments .bypostauthor-badge,
.single .post-tags a:hover,
.single .post-category .cat-links a:hover,
.tagcloud a:hover,
#main .mejs-controls .mejs-time-rail .mejs-time-current,
.si-btn.sinatra-read-more::after,
.post_format-post-format-quote .si-blog-entry-content .quote-post-bg::after,
.si-hover-slider .post-category a,
.si-single-title-in-page-header.single .page-header .post-category a,
.entry-media > a:hover .entry-media-icon::before,
.si-pre-footer-cta-style-1 #si-pre-footer .si-flex-row::after,
.si-pre-footer-cta-style-2 #si-pre-footer::after,
.select2-container--default .select2-results__option--highlighted[aria-selected],
.si-input-supported input[type=radio]:checked::before,
.si-input-supported input[type=checkbox]:checked,
.sinatra-sidebar-style-2 #secondary .widget-title::before,
.sinatra-sidebar-style-2 .elementor-widget-sidebar .widget-title::before,
.widget .cat-item a:hover + span,
.widget_archive li a:hover + span,
.widget .cat-item.current-cat a + span,
#sinatra-footer .widget .cat-item a:hover + span,
#sinatra-footer .widget_archive li a:hover + span,
#sinatra-footer .widget .cat-item.current-cat a + span,
.si-btn.btn-outline:hover,
#infinite-handle span,
.si-btn.btn-text-1 > span::before {
	background-color: var(--brand);
}

/* --- Accent hover BACKGROUND --- */
.si-btn:hover,
#infinite-handle span:hover,
input[type=submit]:hover,
input[type=reset]:hover,
input[type=reset]:focus,
.si-btn:focus,
input[type=submit]:focus,
.si-hover-slider .post-category a:hover,
.si-single-title-in-page-header.single .page-header .post-category a:hover {
	background-color: var(--brand-hover);
}

/* --- Translucent accent tints (highlight, inline code) --- */
mark,
span.highlight,
code,
kbd,
var,
samp,
tt {
	background-color: rgba(var(--brand-rgb), 0.09);
}

code.block {
	background-color: rgba(var(--brand-rgb), 0.075);
}

/* --- Accent as TEXT COLOR (links, menu states, meta, categories, pagination) --- */
.content-area a:not(.si-btn):not(.wp-block-button__link),
#secondary .sinatra-core-custom-list-widget .si-entry a:not(.si-btn),
#secondary a:not(.si-btn):hover,
.si-header-widgets .si-header-widget.sinatra-active .si-icon.si-search,
.sinatra-logo .site-title a:hover,
#sinatra-header-inner .sinatra-nav > ul > li > a:hover,
#sinatra-header-inner .sinatra-nav > ul > li.menu-item-has-children:hover > a,
#sinatra-header-inner .sinatra-nav > ul > li.current-menu-item > a,
#sinatra-header-inner .sinatra-nav > ul > li.current-menu-ancestor > a,
#sinatra-header-inner .sinatra-nav > ul > li.page_item_has_children:hover > a,
#sinatra-header-inner .sinatra-nav > ul > li.current_page_item > a,
#sinatra-header-inner .sinatra-nav > ul > li.current_page_ancestor > a,
#sinatra-topbar .sinatra-nav > ul > li > a:hover,
#sinatra-topbar .sinatra-nav > ul > li.menu-item-has-children:hover > a,
#sinatra-topbar .sinatra-nav > ul > li.current-menu-item > a,
#sinatra-topbar .sinatra-nav > ul > li.current-menu-ancestor > a,
.si-topbar-widget__text a:hover,
.si-topbar-widget__text a,
.sinatra-social-nav > ul > li > a .si-icon.bottom-icon,
.si-header-widgets a:not(.si-btn):hover,
#sinatra-header-inner .si-header-widgets .sinatra-active,
.sinatra-pagination .navigation .nav-links .page-numbers:hover,
.widget .cat-item.current-cat > a,
.widget ul li.current_page_item > a,
#main .search-form .search-submit:hover,
#colophon .search-form .search-submit:hover,
#cancel-comment-reply-link:hover,
.comment-form .required,
.navigation .nav-links .page-numbers:hover,
#main .entry-meta a:hover,
#main .author-box-title a:hover,
.single .post-category a,
.page-links span:hover,
.site-content .page-links span:hover,
.navigation .nav-links .page-numbers.current,
.page-links > span,
.site-content .page-links > span,
.si-btn.btn-outline,
code,
kbd,
var,
samp,
tt,
.is-mobile-menu-active .si-hamburger,
.si-hamburger:hover,
.single #main .post-nav a:hover,
#sinatra-topbar .si-topbar-widget__text .si-icon,
.si-btn.btn-text-1:hover,
.si-btn.btn-text-1:focus,
.btn-text-1:hover,
.btn-text-1:focus {
	color: var(--brand);
}

/* --- Accent as BORDER (widget titles' vertical bar, blockquotes, outline buttons, footer) --- */
#comments .comment-actions .reply a:hover,
.comment-form input[type=checkbox]:checked,
.comment-form input[type=checkbox]:focus,
.comment-form input[type=radio]:checked,
.comment-form input[type=radio]:focus,
.single .post-category a,
#colophon,
#secondary .widget-title,
.elementor-widget-sidebar .widget-title,
.si-hover-slider .post-category a,
.si-single-title-in-page-header.single .page-header .post-category a,
.si-entry blockquote,
.wp-block-quote.is-style-large,
.wp-block-quote.is-large,
.wp-block-quote.has-text-align-right,
.navigation .nav-links .page-numbers.current,
.page-links > span,
.site-content .page-links > span,
.si-input-supported input[type=radio]:checked,
.si-input-supported input[type=checkbox]:checked,
.si-btn.btn-outline {
	border-color: var(--brand);
}

/* --- Accent as bottom border (form field focus, header dropdown arrows) --- */
#masthead .si-header-widgets .dropdown-item::after,
.sinatra-nav > ul .sub-menu::after,
textarea:focus,
input[type="text"]:focus,
input[type="email"]:focus,
input[type=password]:focus,
input[type=tel]:focus,
input[type=url]:focus,
input[type=search]:focus,
input[type=date]:focus {
	border-bottom-color: var(--brand);
}

/* --- Accent as top border (dropdown menus, preloader) --- */
.si-header-widgets .dropdown-item,
.preloader-1 > div,
.sinatra-nav .sub-menu {
	border-top-color: var(--brand);
}

/* --- Accent for SVG icons (animated pagination arrows) --- */
.sinatra-animate-arrow:hover .arrow-handle,
.sinatra-animate-arrow:hover .arrow-bar,
.sinatra-animate-arrow:focus .arrow-handle,
.sinatra-animate-arrow:focus .arrow-bar,
.sinatra-pagination .navigation .nav-links .page-numbers.next:hover .sinatra-animate-arrow .arrow-handle,
.sinatra-pagination .navigation .nav-links .page-numbers.prev:hover .sinatra-animate-arrow .arrow-handle,
.sinatra-pagination .navigation .nav-links .page-numbers.next:hover .sinatra-animate-arrow .arrow-bar,
.sinatra-pagination .navigation .nav-links .page-numbers.prev:hover .sinatra-animate-arrow .arrow-bar {
	fill: var(--brand);
}

/* --- Accent focus ring on checkboxes --- */
.si-input-supported input[type=checkbox]:focus:hover {
	box-shadow: inset 0 0 0 2px var(--brand);
}

/* --- Text selection highlight --- */
#page ::-moz-selection {
	background-color: var(--brand);
	color: #fff;
}

#page ::selection {
	background-color: var(--brand);
	color: #fff;
}

/* =========================================================
   MOBILE HEADER FIXES
   The site's dynamic-styles.css is an old snapshot whose mobile
   header CSS no longer matches the current Sinatra markup, which
   (1) pushed the hamburger onto its own row and (2) left an old
   icon-font arrow that renders as an empty box. These override it.
   ========================================================= */
@media only screen and (max-width: 960px) {
	/* Keep the logo and the hamburger together on one row */
	#sinatra-header-inner .si-header-container {
		flex-wrap: nowrap;
		align-items: center;
	}
	#sinatra-header-inner .site-navigation.sinatra-nav {
		flex: 0 0 auto;
		width: auto;
	}
	#sinatra-header-inner .si-mobile-nav {
		margin-left: auto;
	}

	/* Remove the leftover icon-font arrow (empty box); the theme
	   already draws the correct chevron as an inline SVG */
	#sinatra-header-inner .site-navigation .menu-item-has-children > a::after,
	#sinatra-header-inner .site-navigation .menu-item-has-children > a::before {
		content: none !important;
		display: none !important;
	}
}

/* =========================================================
   Hide the header slider image on mobile
   ========================================================= */
@media only screen and (max-width: 960px) {
	#masthead .n2-section-smartslider {
		display: none !important;
	}
}

/* =========================================================
   Extra rules carried over from the old theme
   ========================================================= */
header .site-title a {
	font-size: 20px;
}

.milestone-widget .milestone-header {
	background-color: var(--brand) !important;
}
