/* 
Theme Name: Hello Elementor Child
Theme URI: https://github.com/elementor/hello-theme-child/
Description: Hello Elementor Child is a child theme of Hello Elementor, created by Elementor team
Author: Elementor Team
Author URI: https://elementor.com/
Template: hello-elementor
Version: 2.0.0
Text Domain: hello-elementor-child
License: GNU General Public License v3 or later.
License URI: https://www.gnu.org/licenses/gpl-3.0.html
Tags: flexible-header, custom-colors, custom-menu, custom-logo, editor-style, featured-images, rtl-language-support, threaded-comments, translation-ready
*/

/* Add your custom styles here */

body {
	font-family: 'Onest', sans-serif;
}
/* MENU NAV BUTTON  */
.menu-btn .elementor-button-content-wrapper {
	display: flex;
	justify-content: space-between;
}
.menu-btn .elementor-button-text {
	flex-grow: 0;
}
.menu-btn .elementor-button-icon svg {
	width: 24px;
}
.btn-secondary .elementor-button-icon {
    width: 24px;
    height: 24px;
    background-color: #2E3030;
    border-radius: 50%;
}
.btn-secondary:hover .elementor-button-icon {
    background-color: #F26323;
}
.btn-secondary .elementor-button-icon svg {
    width: 10px;
    height: 10px;
    color: #fff;
}

#btn-secondary .elementor-button-icon {
    width: 24px;
    height: 24px;
    background-color: #2E3030;
    border-radius: 50%;
}
#btn-secondary:hover .elementor-button-icon {
    background-color: #F26323;
}
#btn-secondary .elementor-button-icon svg {
    width: 10px;
    height: 10px;
    color: #fff;
}
/* COMPANY KATEGORIJE CSS */
.post-cat-pill {
    list-style-type: none;
    padding: 0; 
    margin: 0; 
    display: flex; 
    flex-wrap: wrap; 
    gap: 8px; 
}

.post-cat-pill li {
    background-color: #E8E8E8;
    border-radius: 120px; 
    padding: 8px 16px; 
}

.post-cat-pill li span {
    color: #2E3030; 
    text-decoration: none; 
    display: block; 
	font-family: "Onest", sans-serif;
	font-size: 14px;
	font-weight: 700;
	line-height: 24px;
}
/* COMPANY USLUGE CSS */
.elementor-shortcode .post-service-pill {
    list-style-type: none !important;
    padding: 0 !important; 
    margin: 0 !important; 
    display: flex !important; 
    flex-wrap: wrap !important; 
    gap: 8px; 
}

.elementor-shortcode .post-service-pill li {
    background-color: transparent;
	border: 1px solid #979797;
    border-radius: 120px; 
    padding: 8px 16px; 
}

.elementor-shortcode .post-service-pill li span {
    color: #979797; 
    text-decoration: none; 
    display: block; 
	font-family: "Onest", sans-serif;
	font-size: 14px;
	font-weight: 700;
	line-height: 24px;
}


.section {
	max-width: 1440px;
}

body .category-carousel .elementor-swiper-button:hover svg path {
	stroke: #F26323 !important;
}
/* 

KONTAKT FORM TABS */
.kontakt-tabovi [role="tab"][aria-selected="false"] svg {
    display: none;
}
/* Making checkbox and radio button invisible */
 .elementor-field-type-radio input[type="radio"],.elementor-field-type-acceptance input[type="checkbox"], input[type="radio radio"] {
	border: 0;
	clip: rect(0 0 0 0);
	height: 1px;
	margin: -1px;
	overflow: hidden;
	padding: 0;
	position: absolute;
	width: 1px;
}
/* 
ACCEPTANCE */
/* For Checkbox */
.elementor-field-type-acceptance {
	margin-top: 16px;
	padding-bottom: 32px;
}
.elementor-field-type-acceptance > div label:before {
	content: "";
	display: inline-block;
	width: 20px;
	height: 20px;
	margin-right: 16px;
	vertical-align: -5px;
	border: 1px solid #E8E8E8;
	border-radius: 8px;
	padding: 0.1em;
	background-color: transparent;
	background-clip: content-box;
	transition: all 0.2s ease;
}
.elementor-field-type-acceptance > div label {
	position: relative;
}
.elementor-field-type-acceptance > div label:after {
	border-right: 2px solid #fff;
	border-top: 2px solid #fff;
	content: "";
	height: 9px;
	left: 3px;
	position: absolute;
	top: 12px;
	color: black;
	transform: scaleX(-1) rotate(135deg);
	transform-origin: left top;
	width: 11px;
	display: none;
}
.elementor-field-type-acceptance > div input:hover + label:before {
	border-color: #E8E8E8;
}
.elementor-field-type-acceptance > div input:checked + label:before {
	border-color: #E8E8E8;
}
.elementor-field-type-acceptance > div input:checked + label:after {
	-moz-animation: check 0.8s ease 0s running;
	-webkit-animation: check 0.8s ease 0s running;
	animation: check 0.8s ease 0s running;
	display: block;
	width: 6px;
	height: 12px;
	border-color: #2E3030;

}

/* BLOG GRID PAGIANTION */
.blog-grid .prev {
	  display: inline-block; /* make it visible again for custom styling */
    text-indent: -9999px; /* hides any text content */
    position: relative;
    background: none;
    border: none;
    cursor: pointer;
	margin-right: 48px !important;
}
.blog-grid .next {
	  display: inline-block; /* make it visible again for custom styling */
    text-indent: -9999px; /* hides any text content */
    position: relative;
    background: none;
    border: none;
    cursor: pointer;
	margin-left: 48px !important;
}
.blog-grid .page-numbers {
	padding: 8px 12px;
	background-color: transparent;
	border-radius: 8px;
}
.blog-grid .page-numbers.current {
	background-color: #FDB521
}
.blog-grid .prev::before {
    content: "";
	background-image: url('https://gradjevina.hr/wp-content/uploads/2024/05/arrow-left.svg');
	background-size: contain;
	background-repeat: no-repeat;
    font-size: 16px;
    color: red; 
    position: absolute;
    top: 50%;
	height: 24px;
	width: 24px;
	transform: translate(-50%, -50%);
	margin-right: 48px;
    left: 50%;
	z-index: 4;
}
.blog-grid .next::before {
	 content: "";
	background-image: url('https://gradjevina.hr/wp-content/uploads/2024/05/arrow-right.svg');
	background-size: contain;
	background-repeat: no-repeat;
    font-size: 16px;
    color: red; 
    position: absolute;
    top: 50%;
	height: 24px;
	width: 24px;
	transform: translate(-50%, -50%);
	margin-right: 48px;
    left: 50%;
	z-index: 4;
}
@media (max-width: 767px) {
	.blog-grid .prev {
		margin-right: 16px !important;
	}
	.blog-grid .prev:before {
		margin-right: 16px !important;
	}
	.blog-grid .next {
	margin-left: 16px !important;
}
		.blog-grid .next:before {
	margin-left: 16px !important;
}
	.blog-grid .page-numbers {
	padding: 4px 8px;
}
}
/* REGISTER FORM INPUTS */
#gradjevina-register-form input {
	border: none;
	border-bottom: 1px solid #E8E8E8;
	padding: 16px;
	font-size: 16px;
	line-height: 24px;
	color: #979797;
	font-family: "Onest",sans-serif;
}
#gradjevina-register-form input:focus-visible {
	border: none;
	border-bottom: 1px solid #E8E8E8;
	outline: none;

}
#gradjevina-register-form button[type="submit"] {
	width: 100%;
	background-color: #F26323;
	border:none;
	font-size: 16px;
	font-family: "Onest", sans-serif;
	line-height: 24px;
	color: #fff;
	text-transform: uppercase;
}
#gradjevina-register-form button[type="submit"]:hover {
	width: 100%;
	background-color: #3E5253;
}

.gradjevina-register-form__email {
	position: relative;
}
.gradjevina-register-form__email::after {
	  content: '';
	background: url('https://gradjevina.hr/wp-content/uploads/2024/05/letter-1.svg');
	background-repeat: no-repeat;
	background-size: contain;
    position: absolute;
	height: 24px;
	width: 24px;
    right: 16px; /* Adjust based on your layout */
    top: 50%; /* Center vertically */
    transform: translateY(-50%); /* Ensure it's perfectly centered */
    pointer-events: none; /* Make it non-clickable so it doesn't interfere with input */
    font-size: 1rem; /* Adjust as necessary */
    color: #A7A8A9;

}
/* REGISTER USER FORM INPUTS */
#gradjevina-register-user-form input {
	border: none;
	border-bottom: 1px solid #E8E8E8;
	padding: 16px;
	font-size: 16px;
	line-height: 24px;
	color: #979797;
	font-family: "Onest",sans-serif;
}
#gradjevina-register-user-form input:focus-visible {
	border: none;
	border-bottom: 1px solid #E8E8E8;
	outline: none;

}
#gradjevina-register-user-form button[type="submit"] {
	width: 100%;
	background-color: #F26323;
	border:none;
	font-size: 16px;
	font-family: "Onest", sans-serif;
	line-height: 24px;
	color: #fff;
	text-transform: uppercase;
}
#gradjevina-register-user-form button[type="submit"]:hover {
	width: 100%;
	background-color: #3E5253;
}

.gradjevina-register-form__email {
	position: relative;
}
.gradjevina-register-form__email::after {
	  content: '';
	background: url('https://gradjevina.hr/wp-content/uploads/2024/05/letter-1.svg');
	background-repeat: no-repeat;
	background-size: contain;
    position: absolute;
	height: 24px;
	width: 24px;
    right: 16px; /* Adjust based on your layout */
    top: 50%; /* Center vertically */
    transform: translateY(-50%); /* Ensure it's perfectly centered */
    pointer-events: none; /* Make it non-clickable so it doesn't interfere with input */
    font-size: 1rem; /* Adjust as necessary */
    color: #A7A8A9;

}
/* ACCEPTANCE REGISTER */
.gradjevina-register-form__checkbox {
	margin-top: 40px;
	margin-bottom: 24px;
}
.gradjevina-register-form__checkbox input[type="checkbox"] {
	border: 0;
	clip: rect(0 0 0 0);
	height: 1px;
	margin: -1px;
	overflow: hidden;
	padding: 0;
	position: absolute;
	width: 1px;
}
.gradjevina-register-form__checkbox label:before {
	content: "";
	display: inline-block;
	width: 20px;
	height: 20px;
	margin-right: 16px;
	vertical-align: -5px;
	border: 1px solid #E8E8E8;
	border-radius: 8px;
	padding: 0.1em;
	background-color: transparent;
	background-clip: content-box;
	transition: all 0.2s ease;
}
.gradjevina-register-form__checkbox label {
	position: relative;
}
.gradjevina-register-form__checkbox label:after {
	border-right: 2px solid #fff;
	border-top: 2px solid #fff;
	content: "";
	height: 9px;
	left: 3px;
	position: absolute;
	top: 12px;
	color: black;
	transform: scaleX(-1) rotate(135deg);
	transform-origin: left top;
	width: 11px;
	display: none;
}
.gradjevina-register-form__checkbox input[type="checkbox"]:hover + label:before {
	border-color: #E8E8E8;
}
.gradjevina-register-form__checkbox input[type="checkbox"]:checked + label:before {
	border-color: #E8E8E8;
}
.gradjevina-register-form__checkbox input[type="checkbox"]:checked + label:after {
	-moz-animation: check 0.8s ease 0s running;
	-webkit-animation: check 0.8s ease 0s running;
	animation: check 0.8s ease 0s running;
	display: block;
	width: 6px;
	height: 12px;
	border-color: #2E3030;

}
/* CUSTM WRITE REVIEW BUTTON */
.write-review-btn {
	padding: 16px 56px;
	color: #fff;
	font-size 16px;
	line-height: 24px;
	font-family:"Onest", sans-serif;
	background-color:#F26323;
	text-transform: uppercase;
	transition: background-color 0.3s ease;
	font-weight: 700;
} 
.write-review-btn:hover {
	background-color: #3E5253;
	color: #fff;
	
}
/* 
REVIEW FORM CSS */
.form-wrapper{
	display: flex;
	flex-direction: column;
	gap: 24px;
	justify-content: center;
}
.company-details {
	display: flex;
	flex-direction:column;
	row-gap: 16px;
	align-items: center;
	justify-content: center;
}
.company-image {
	width: 120px;
	height: 120px !important;
	border-radius: 16px !important;
	border: 1px solid #E8E8E8 !important;
	object-fit: contain;
}
.company-title {
	margin: 0;
	color: #2E3030;
	font-size: 18px;
	line-height: 32px;
	font-family: "Onest", sans-serif;
	font-weight: 700;
}
.ocjenite-title {
	text-align: center;
	color: #000000;
	font-size: 32px;
	line-height: 48px;
	font-weight: 700;
	font-family: "Onest", sans-serif;
}
.star-rating {
	display: flex;
	flex-direction: row;
	justify-content: center;
	align-items: center;
	gap: 8px;
}
.star-rating .star {
    width: 30px;  /* Adjust based on the size you need for the stars */
    height: 30px;  /* Adjust based on the size you need for the stars */
    display: inline-block;
    background-size: cover;
    cursor: pointer;
    transition: background 0.2s;
    background-image: url('https://gradjevina.hr/wp-content/uploads/2024/05/MdOutlineStarBorder.svg'); /* Path to your SVG for empty star */
    background-repeat: no-repeat;
}

.star-rating .star.active,
.star-rating .star:hover {
    background-image: url('https://gradjevina.hr/wp-content/uploads/2024/05/MdOutlineStar.svg'); /* Path to your SVG for filled star */
}
.review-content-label {
	margin-top: 24px;
	padding-bottom: 8px;
	color: #2E3030;
	font-size: 18px;
	line-height: 32px;
	font-family: "Onest", sans-serif;
	font-weight: 700;
}
#review_content {
	padding: 16px;
	border: 1px solid #E8E8E8;
	border-radius: 8px;
}
#review_content:focus-visible {
	padding: 16px;
	border: 1px solid #E8E8E8;
	border-radius: 8px;
	outline: none
}
#reviewer_name {
	padding: 16px;
	font-size: 16px; 
	line-height: 24px;
	color: #2E3030;
	border: none;
	border-bottom: 1px solid #E8E8E8;
	border-radius: 0px;
	margin-bottom: 8px;
 	position: relative;
}

#reviewer_name:placeholder {
	padding: 16px;
	font-size: 16px; 
	line-height: 24px;
	color: #E8E8E8;
	
}
#review_title {
	padding: 16px;
	font-size: 16px; 
	line-height: 24px;
	color: #2E3030;
	border: none;
	border-bottom: 1px solid #E8E8E8;
	border-radius: 0px;
	margin-bottom: 8px;
 	position: relative;
}

#review_title:placeholder {
	padding: 16px;
	font-size: 16px; 
	line-height: 24px;
	color: #E8E8E8;
	
}
#review_title:focus-visible {
	outline: none;
}
#reviewer_name:focus-visible {
	outline: none;
}
#review_date {
	padding: 16px;
	font-size: 16px; 
	line-height: 24px;
	color: #2E3030;
	border: none;
	border-radius: 0px;
	border-bottom: 1px solid #E8E8E8;
	margin-bottom: 8px;
}
#review_date:placeholder {
	padding: 16px;
	font-size: 16px; 
	line-height: 24px;
	color: #E8E8E8;
	
}
#review_date:focus-visible {
	outline: none;
}
.file-upload-label {
	display: block;
	margin-top: 16px;
	margin-bottom: 24px;
}
.upload-real-label {
	font-size: 18px;
	line-height: 32px;
	font-weight: 700;
	font-family: "Onest", sans-serif;
	color: #2e3030;
	 display: flex;
    justify-content: flex-start;
    align-items: center;
    gap: 8px;
    cursor: pointer;
}
.upload-real-label::after {
	content: '';
	background: url('https://gradjevina.hr/wp-content/uploads/2024/05/ic_info_48px-1.svg');
	background-repeat: no-repeat;
	background-size: cover;
	height: 24px;
	width: 24px;
    font-size: 1rem; /* Adjust as necessary */
    color: #A7A8A9;
}
#file_upload {
	display: none;
}
.file-upload-text {
	font-size: 16px;
	font-family: 'Onest', sans-serif;
	line-height: 24px;
	color: #979797;
	font-weight: 400;
}
.review-btn {
	border-radius: 0;
	border: none;
	text-transform: uppercase;
	transition: background-color 0.3s ease;
}

.review-btn:hover {
	background-color: #3E5253;
}

/* AVERAGE RATING */
.avg-star {
    display: inline-block;
    width: 32px;  /* Adjust based on your SVG dimensions */
    height: 32px; /* Adjust based on your SVG dimensions */
    background-size: cover;
}

.avg-star.filled {
    background-image: url('https://gradjevina.hr/wp-content/uploads/2024/05/MdOutlineStar.svg');
}

.avg-star.half-filled {
    background-image: url('https://gradjevina.hr/wp-content/uploads/2024/05/MdOutlineStarHalf.svg');
}

.avg-star {
    background-image: url('https://gradjevina.hr/wp-content/uploads/2024/05/MdOutlineStarBorder.svg');
}

.average-rating {
	display: flex;
	flex-direction: column;
	gap: 8px;
	align-items: end;
	width: 100%;
}
.avg-rating {
	margin: 0;
	font-size: 4rem;
	line-height: 1.2;
	font-weight: 700;
	font-family: "Onest",sans-serif;
	
}
.review-number {
	margin: 0;
	font-size: 14px;
	line-height: 24px;
	font-weight: 400;
	font-family: "Onest",sans-serif;
	color: #979797;
}

/* RATINGS TABLE */
.rating-table {
	padding: 2rem;
	border: 1px solid #E8E8E8;
	border-radius: 16px;
}
.table-header {
	margin: 0;
	font-size: 24px;
	line-height: 40px;
	font-weight: 700;
	font-family: 'Onest', sans-serif;
	color: #2E3030;
}
.rating-table .review-number {
	font-size: 1rem;
	line-height: 24px;
	color: #2E3030;
	font-weight: 400;
	font-family: 'Onest', sans-serif;
}
.rating-heading {
	margin-bottom: 16px;
	display: flex;
	flex-direction: row;
	width: 100%;
	justify-content: space-between;
	align-items: center;
}
.rating-row {
	display: flex;
	width: 100%;
	align-items: center;
	margin-bottom: 8px;
}
.rating-bar {
	flex-grow: 1;
	background-color: #D9D9D9;
	height: 8px;
	border-radius: 8px;
	margin-right: 16px;
	margin-left:16px;
}
.rating-fill {
	background-color: #71C5C0;
	border-radius: 8px;
	height: 100%;
}
.table-star {
    display: inline-block;
    width: 24px;  /* Adjust based on your SVG dimensions */
    height: 24px; /* Adjust based on your SVG dimensions */
    background-size: cover;
	padding-right: 4px;
}

.table-star.filled {
    background-image: url('https://gradjevina.hr/wp-content/uploads/2024/05/MdOutlineStar.svg');
}


.table-star {
    background-image: url('https://gradjevina.hr/wp-content/uploads/2024/05/MdOutlineStarBorder.svg');
}

/* SMALL HEADING AVERAGE RATING SHORTCODE */
.small-avg-star {
    display: inline-block;
    width: 24px;  /* Adjust based on your SVG dimensions */
    height: 24px; /* Adjust based on your SVG dimensions */
    background-size: cover;
}

.small-avg-star.filled {
    background-image: url('https://gradjevina.hr/wp-content/uploads/2024/05/MdOutlineStar.svg');
}

.small-avg-star.half-filled {
    background-image: url('https://gradjevina.hr/wp-content/uploads/2024/05/MdOutlineStarHalf.svg');
}

.small-avg-star {
    background-image: url('https://gradjevina.hr/wp-content/uploads/2024/05/MdOutlineStarBorder.svg');
}

.small-average-rating {
	display: flex;
	flex-direction: row;
	align-items: center;
	width: 100%;
	gap: 0px;
}
.small-avg-rating {
	margin: 0;
	font-size: 14px;
	line-height: 24px;
	font-weight: 400;
	font-family: 'Onest', sans-serif;
	padding-right: 16px;
	padding-left: 4px;
	color: #979797;
}	

.small-review-number {
	margin: 0;
	font-size: 14px;
	line-height: 24px;
	font-weight: 400;
	font-family: 'Onest', sans-serif;
	color: #979797;
	padding-left: 16px;
	border-left: 1px solid #E8E8E8;
}
.small-average-rating-geo-wrapper {
	display:flex;
	flex-direction: row;
	gap: 4px;
	align-items: center;
}
/* reviews-company-grid pagiantion */
.reviews-company-grid .prev {
	  display: inline-block; /* make it visible again for custom styling */
    text-indent: -9999px; /* hides any text content */
    position: relative;
    background: none;
    border: none;
    cursor: pointer;
	margin-right: 48px !important;
}
.reviews-company-grid .next {
	  display: inline-block; /* make it visible again for custom styling */
    text-indent: -9999px; /* hides any text content */
    position: relative;
    background: none;
    border: none;
    cursor: pointer;
	margin-left: 48px !important;
}
.reviews-company-grid .page-numbers {
	padding: 8px 12px;
	background-color: transparent;
	border-radius: 8px;
	color: #2E3030;
	font-weight: 700;
}
.reviews-company-grid .page-numbers:hover {
	padding: 8px 12px;
	background-color: transparent;
	border-radius: 8px;
	color: #2E3030;
}
.reviews-company-grid .page-numbers.current {
	background-color: #FDB521
}
.reviews-company-grid .prev::before {
    content: "";
	background-image: url('https://gradjevina.hr/wp-content/uploads/2024/05/arrow-left.svg');
	background-size: contain;
	background-repeat: no-repeat;
    font-size: 16px;
    color: red; 
    position: absolute;
    top: 50%;
	height: 24px;
	width: 24px;
	transform: translate(-50%, -50%);
	margin-right: 48px;
    left: 50%;
	z-index: 4;
}
.reviews-company-grid .next::before {
	 content: "";
	background-image: url('https://gradjevina.hr/wp-content/uploads/2024/05/arrow-right.svg');
	background-size: contain;
	background-repeat: no-repeat;
    font-size: 16px;
    color: red; 
    position: absolute;
    top: 50%;
	height: 24px;
	width: 24px;
	transform: translate(-50%, -50%);
	margin-right: 48px;
    left: 50%;
	z-index: 4;
}
/* companies-grid pagiantion */
.companies-grid .prev {
	  display: inline-block; /* make it visible again for custom styling */
    text-indent: -9999px; /* hides any text content */
    position: relative;
    background: none;
    border: none;
    cursor: pointer;
	margin-right: 48px !important;
}
.companies-grid .next {
	  display: inline-block; /* make it visible again for custom styling */
    text-indent: -9999px; /* hides any text content */
    position: relative;
    background: none;
    border: none;
    cursor: pointer;
	margin-left: 48px !important;
}
.companies-grid .page-numbers {
	padding: 8px 12px;
	background-color: transparent;
	border-radius: 8px;
	color: #2E3030;
	font-weight: 700;
}
.companies-grid .page-numbers:hover {
	padding: 8px 12px;
	background-color: transparent;
	border-radius: 8px;
	color: #2E3030;
}
.companies-grid .page-numbers.current {
	background-color: #FDB521
}
.companies-grid .prev::before {
    content: "";
	background-image: url('https://gradjevina.hr/wp-content/uploads/2024/05/arrow-left.svg');
	background-size: contain;
	background-repeat: no-repeat;
    font-size: 16px;
    color: red; 
    position: absolute;
    top: 50%;
	height: 24px;
	width: 24px;
	transform: translate(-50%, -50%);
	margin-right: 48px;
    left: 50%;
	z-index: 4;
}
.companies-grid .next::before {
	 content: "";
	background-image: url('https://gradjevina.hr/wp-content/uploads/2024/05/arrow-right.svg');
	background-size: contain;
	background-repeat: no-repeat;
    font-size: 16px;
    color: red; 
    position: absolute;
    top: 50%;
	height: 24px;
	width: 24px;
	transform: translate(-50%, -50%);
	margin-right: 48px;
    left: 50%;
	z-index: 4;
}

/* LOGIN FORM */
.login-form form input:focus {
	outline: none;
	box-shadow: none !important;
	border-bottom: 1px solid #E8E8E8;

}
.login-form form input:focus-visible {
	outline: none !important;
	border-bottom: 1px solid #E8E8E8;
} 
.login-form form button[type="submit"] {
	margin-top: 24px;
}
/* 
AUTHOR REVIEW COUNT */
.author-review-count {
	font-size: 1rem;
	line-height: 1.5;
	font-family: 'Onest', sans-serif;
	font-weight: 400;
	color: #979797;
}
/* hide headers on mobile  */
@media (max-width: 767px) {
    .base-header,
    .scroll-header {
        display: none !important;
    }
}
/* 
CUSTOM SORT DROPDOWN */
       .custom-dropdown {
            position: relative;
            display: inline-block;
            margin-right: 10px;
			width: 260px;		   
        }
 		
        .custom-dropdown .selected-option {
            padding: 12px 16px;
            background: #fff;
			border: 1px solid #E8E8E8;
			border-radius: 120px;
            cursor: pointer;
			font-size: 14px;
			line-height: 24px;
			color: #2E3030;
			font-weight: 400;
        }
.custom-dropdown .selected-option::after {
	 		content: ''; 
            position: absolute;
            right: 16px;
            top: 50%;
            transform: translateY(-50%);
            width: 24px;
	height: 24px;
	background: url('https://gradjevina.hr/wp-content/uploads/2024/06/arrow-sm-down.svg');
	background-size: contain;
}
        .custom-dropdown .options {
            display: none;
            position: absolute;
			margin-top: 8px;
            top: 100%;
            left: 0;
            right: 0;
            background: white;
            border: 1px solid #E8E8E8;
            z-index: 10;
        }
        .custom-dropdown .options div {
              padding: 12px 16px;
            cursor: pointer;
			font-size: 14px;
			line-height: 24px;
			color: #2E3030;
			font-weight: 400;
        }
        .custom-dropdown .options div:hover, .custom-dropdown .options div.selected {
            background: #E8E8E8;
        }
/* 
PODKATEGORIJA CUSTOM BTN */
.podkategorija-btn  .elementor-button-text {
   flex-grow: 0 !important;
}
.podkategorija-btn  .elementor-button-content-wrapper {
    justify-content: space-between;
    flex-direction: row-reverse !important;
}
.podkategorija-btn .elementor-button-link:hover svg path {
    fill: #2E3030;
}
/* FILTER BY RATING STYLE */
.form-wrapper {
	display: flex !important;
	flex-direction: row;
	flex-wrap: wrap;
	justify-content: flex-start;
	align-items: center;
	   gap: 8px !important;
}
.star-icon {
	width: 24px;
	height: 24px;
}
   .rating-option {
	       display: flex;
    justify-content: center;
    gap: 4px;
    align-items: center;
            padding-top: 8px !important;
	   padding-bottom: 8px !important;
	   padding-left: 0 !important;
	   padding-right: 0px !important;
            background-color: #fff !important;
	   		color: #979797 !important;
	   width: 100% !important;
	  
	   max-width: 90px !important;
	   text-align: center !important;
            border: 1px solid #E8E8E8;
            border-radius: 120px;
            cursor: pointer;
        }
        .rating-option.selected,
        .rating-option:hover {
            background-color: #E8E8E8 !important;
			color: #2E3030;
        }
 .rating-option:focus {
         outline: none !important;
        }
.rating-option:focus-visible {
	outline: none;
}

/* REVIEWS CAROUSEL */
.reviews-carousel .swiper-slide {
	max-width: 464px;
}
.reviews-carousel .swiper-slide .review-item {
	max-width: 464px;
}
/* SEARXH WRAPPER */
.elementor-search-form__container {
	    background-color: #fff;
    padding: 8px;
    min-height: 72px !important;
}

/* KATEGORIJE TABS */
.elementor-element-3476e98 .e-n-tabs-heading > button > span {
	gap: 8px;
}
#e-n-tab-title-550130161 .e-n-tab-title-text:before {
	content: "" !important;
    display: inline-block;
    width: 24px;
    height: 24px;
    background-image: url('/wp-content/uploads/2024/04/arhitektura.svg');
    background-size: contain;
    background-repeat: no-repeat;
}
#e-n-tab-title-550130162 .e-n-tab-title-text:before {
	content: "" !important;
    display: inline-block;
    width: 24px;
    height: 24px;
    background-image: url('/wp-content/uploads/2024/04/gradnjakuce.svg');
    background-size: contain;
    background-repeat: no-repeat;
}

#e-n-tab-title-550130163 .e-n-tab-title-text:before {
	content: "" !important;
    display: inline-block;
    width: 24px;
    height: 24px;
    background-image: url('/wp-content/uploads/2024/04/krov.svg');
    background-size: contain;
    background-repeat: no-repeat;
}
#e-n-tab-title-550130164 .e-n-tab-title-text:before {
	content: "" !important;
    display: inline-block;
    width: 24px;
    height: 24px;
    background-image: url('/wp-content/uploads/2024/04/prozori.svg');
    background-size: contain;
    background-repeat: no-repeat;
}
#e-n-tab-title-550130165 .e-n-tab-title-text:before {
	content: "" !important;
    display: inline-block;
    width: 24px;
    height: 24px;
    background-image: url('/wp-content/uploads/2024/04/instalateri.svg');
    background-size: contain;
    background-repeat: no-repeat;
}
#e-n-tab-title-550130166 .e-n-tab-title-text:before {
	content: "" !important;
    display: inline-block;
    width: 24px;
    height: 24px;
    background-image: url('/wp-content/uploads/2024/04/fasade.svg');
    background-size: contain;
    background-repeat: no-repeat;
}
#e-n-tab-title-550130167 .e-n-tab-title-text:before {
	content: "" !important;
    display: inline-block;
    width: 24px;
    height: 24px;
    background-image: url('/wp-content/uploads/2024/04/zbukanje.svg');
    background-size: contain;
    background-repeat: no-repeat;
}
#e-n-tab-title-550130168 .e-n-tab-title-text:before {
	content: "" !important;
    display: inline-block;
    width: 24px;
    height: 24px;
    background-image: url('/wp-content/uploads/2024/04/podovi.svg');
    background-size: contain;
    background-repeat: no-repeat;
}
#e-n-tab-title-550130169 .e-n-tab-title-text:before {
	content: "" !important;
    display: inline-block;
    width: 24px;
    height: 24px;
    background-image: url('/wp-content/uploads/2024/04/celicne.svg');
    background-size: contain;
    background-repeat: no-repeat;
}
#e-n-tab-title-5501301610 .e-n-tab-title-text:before {
	content: "" !important;
    display: inline-block;
    width: 24px;
    height: 24px;
    background-image: url('/wp-content/uploads/2024/04/namjestaj.svg');
    background-size: contain;
    background-repeat: no-repeat;
}
#e-n-tab-title-5501301611 .e-n-tab-title-text:before {
	content: "" !important;
    display: inline-block;
    width: 24px;
    height: 24px;
    background-image: url('/wp-content/uploads/2024/04/okolis.svg');
    background-size: contain;
    background-repeat: no-repeat;
}
#e-n-tab-title-5501301612 .e-n-tab-title-text:before {
	content: "" !important;
    display: inline-block;
    width: 24px;
    height: 24px;
    background-image: url('/wp-content/uploads/2024/04/odrzavanje.svg');
    background-size: contain;
    background-repeat: no-repeat;
}

/* BLOG TABS ICONS */
.elementor-element-51e03e2 .e-n-tabs-heading > button > span {
	gap: 8px;
}
#e-n-tab-title-858531541 .e-n-tab-title-text:before {
	content: "" !important;
    display: inline-block;
    width: 24px;
    height: 24px;
    background-image: url('/wp-content/uploads/2024/04/arhitektura.svg');
    background-size: contain;
    background-repeat: no-repeat;
}
#e-n-tab-title-858531542 .e-n-tab-title-text:before {
	content: "" !important;
    display: inline-block;
    width: 24px;
    height: 24px;
    background-image: url('/wp-content/uploads/2024/04/gradnjakuce.svg');
    background-size: contain;
    background-repeat: no-repeat;
}

#e-n-tab-title-858531543 .e-n-tab-title-text:before {
	content: "" !important;
    display: inline-block;
    width: 24px;
    height: 24px;
    background-image: url('/wp-content/uploads/2024/04/krov.svg');
    background-size: contain;
    background-repeat: no-repeat;
}
#e-n-tab-title-858531544 .e-n-tab-title-text:before {
	content: "" !important;
    display: inline-block;
    width: 24px;
    height: 24px;
    background-image: url('/wp-content/uploads/2024/04/prozori.svg');
    background-size: contain;
    background-repeat: no-repeat;
}
#e-n-tab-title-858531545 .e-n-tab-title-text:before {
	content: "" !important;
    display: inline-block;
    width: 24px;
    height: 24px;
    background-image: url('/wp-content/uploads/2024/04/instalateri.svg');
    background-size: contain;
    background-repeat: no-repeat;
}
#e-n-tab-title-858531546 .e-n-tab-title-text:before {
	content: "" !important;
    display: inline-block;
    width: 24px;
    height: 24px;
    background-image: url('/wp-content/uploads/2024/04/fasade.svg');
    background-size: contain;
    background-repeat: no-repeat;
}
#e-n-tab-title-858531547 .e-n-tab-title-text:before {
	content: "" !important;
    display: inline-block;
    width: 24px;
    height: 24px;
    background-image: url('/wp-content/uploads/2024/04/zbukanje.svg');
    background-size: contain;
    background-repeat: no-repeat;
}
#e-n-tab-title-858531548 .e-n-tab-title-text:before {
	content: "" !important;
    display: inline-block;
    width: 24px;
    height: 24px;
    background-image: url('/wp-content/uploads/2024/04/podovi.svg');
    background-size: contain;
    background-repeat: no-repeat;
}
#e-n-tab-title-858531549 .e-n-tab-title-text:before {
	content: "" !important;
    display: inline-block;
    width: 24px;
    height: 24px;
    background-image: url('/wp-content/uploads/2024/04/celicne.svg');
    background-size: contain;
    background-repeat: no-repeat;
}
#e-n-tab-title-8585315410 .e-n-tab-title-text:before {
	content: "" !important;
    display: inline-block;
    width: 24px;
    height: 24px;
    background-image: url('/wp-content/uploads/2024/04/namjestaj.svg');
    background-size: contain;
    background-repeat: no-repeat;
}
#e-n-tab-title-8585315411 .e-n-tab-title-text:before {
	content: "" !important;
    display: inline-block;
    width: 24px;
    height: 24px;
    background-image: url('/wp-content/uploads/2024/04/okolis.svg');
    background-size: contain;
    background-repeat: no-repeat;
}
#e-n-tab-title-8585315412 .e-n-tab-title-text:before {
	content: "" !important;
    display: inline-block;
    width: 24px;
    height: 24px;
    background-image: url('/wp-content/uploads/2024/04/odrzavanje.svg');
    background-size: contain;
    background-repeat: no-repeat;
}
/* EDIT PROFILE CSS */
   .profile-header {
            display: flex;
            align-items: center;
            justify-content: space-between;
            padding-top: 32px;
	   flex-wrap: wrap;
	   padding-bottom: 32px;
            background-color: #fff;
            border-top: 1px solid #E8E8E8;
	   border-bottom: 1px solid #E8E8E8;
            width: 100%;
	   gap: 24px;
	   max-width: 1440px;
            margin: 0 auto;
        }

        .profile-info {
            display: flex;
            align-items: center;
        }

        .profile-image {
            width: 160px;
            height: 160px;
            background-color: #fff;
            border: 1px solid #E8E8E8;
            border-radius: 16px;
            display: flex;
            align-items: center;
            justify-content: center;
            margin-right: 24px;
            position: relative;
            overflow: hidden;
            cursor: pointer;
        }

        .profile-image img {
            max-width: 100%;
            height: auto;
			object-fit: cover;
        }

        .profile-image .placeholder-icon {
             width: 24px; /* Adjust size as needed */
            height: 24px;
            background-image: url('/wp-content/uploads/2024/09/compact-camera-1.svg');
            background-size: contain;
            background-repeat: no-repeat;
            background-position: center;
        }

        .profile-image input[type="file"] {
            opacity: 0;
            position: absolute;
            width: 100%;
            height: 100%;
            top: 0;
            left: 0;
            cursor: pointer;
        }

        .profile-text {
            display: flex;
            flex-direction: column;
            justify-content: center;
        }

        .profile-text h2 {
            margin: 0;
            font-size: 24px;
            font-weight: bold;
			line-height: 40px;
            color: #2E3030;
        }

        .profile-text p {
            margin: 0;
            font-size: 14px;
			line-height: 24px;
            color: #979797;
        }
		.button-error-wrapper {
			position: relative;
		}
        .save-button {
            padding: 16px 30px;
            background-color: #F26323;
            color: #fff;
            border: none;
            font-size: 16px;
			border-radius: 0;
			line-height: 24px;
            font-weight: bold;
            cursor: pointer;
            text-transform: uppercase;
        }

        .save-button:hover {
            background-color: #3E5253;
        }


        .form-container {
            display: flex;
            justify-content: space-between;
            max-width: 1440px;
            margin: 0 auto;
            background-color: #fff;
            padding-top: 48px;
			padding-bottom: 48px;
        }

        .form-group {
            position: relative;
            margin-bottom: 8px;
        }
.form-group textarea {
	border: 1px solid #E8E8E8;
	border-radius: 16px;
	outline: none;
}
        .form-group input,
        .form-group select {
            width: 100%;
            padding: 16px;
            padding-bottom: 10px;
            font-size: 16px;
			border: none;
            border-bottom: 1px solid #E8E8E8;
			border-radius: 0;
            outline: none;
            transition: padding-bottom 0.2s ease, border-color 0.2s ease;
        }

        .form-group label {
            position: absolute;
            top: 16px;
            left: 16px;
            font-size: 16px;
			line-height: 24px;
            color: #979797;
            background-color: #fff;
            padding: 0;
            transition: all 0.2s ease;
            pointer-events: none;
        }

        .form-group input:focus + label,
        .form-group input:not(:placeholder-shown) + label,
        .form-group select:focus + label,
        .form-group select:not([value=""]) + label {
            top: 0px;
            font-size: 12px;
			line-height: 16px;
            color: #979797;
            padding-bottom: 0;
        }

        .form-group input:focus,
        .form-group textarea:focus,
        .form-group select:focus {
            border-color: #E8E8E8;
        }

        .form-group input:not(:placeholder-shown),
        .form-group select:not([value=""]) {
            padding-bottom: 10px;
        }

        .left-column,
        .right-column {
            width: 48%;
        }

        .right-column {
            display: flex;
            flex-direction: column;
        }

        .right-column textarea {
            flex-grow: 1;
        }

        .kontakt-heading {
            margin-bottom: 32px;
            font-size: 20px;
			line-height: 40px;
            font-weight: bold;
            color: #000;
        }
 .opis-heading {
	 margin: 0;
            font-size: 20px;
			line-height: 40px;
            font-weight: bold;
            color: #000;
        }
.opis-text {
	font-size: 16px;
			line-height: 24px;
            font-weight: 400;
            color: #979797;
	margin-bottom: 16px;
}
  .full-width {
            width: 100%;
        }
.inline-group-two {
            display: flex;
            justify-content: space-between;
	gap: 32px;
        }
        .inline-group {
            display: flex;
            justify-content: space-between;
			gap: 32px;
        }

        .inline-group .form-group {
            width: 33%;
        }
.inline-group-two .form-group {
            width: 50%;
        }
.edit-company-form__messages {
    margin-bottom: 20px;
	margin-top: 16px;
    font-size: 16px;
    font-weight: bold;
	position: absolute;
}

.edit-company-form__messages-success {
    color: 	#22bb33;
}

.edit-company-form__messages-error {
    color: #bb2124;
}
/* 
CATEGORIES FORM */
.kategorija-list {
    list-style: none; /* Remove default list styling */
    padding: 0;
    margin: 0;
    display: flex;
    flex-wrap: wrap; /* Allow items to wrap to the next line if necessary */
    gap: 10px; /* Space between items */
}

.kategorija-item {
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 12px 24px; /* Space inside each item */
    background-color: #E8E8E8; /* Background color for each item */
    border-radius: 120px; /* Rounded corners */
    border: 1px solid transparent; /* Default border */
    cursor: pointer;
    transition: all 0.3s ease; /* Smooth transition for hover and active states */
}

.kategorija-item:hover {
    border-color: transparent; /* Border color on hover */
}

.kategorija-item.selected {
    border-color: #F26323;
	background-color:#fff; 
}

.kategorija-item img.kategorija-icon {
    width: 24px;
    height: 24px;
    margin-right: 8px; /* Space between icon and text */
}

.kategorija-item span {
    font-size: 14px;
	line-height: 24px;
	font-weight: bold;
    color: #2E3030; /* Text color */
}
.save-wrapper {
	margin-top: 48px;
	margin-bottom: 80px;
}

/* SUBCATEGORIES */
/* Style the group container */
.subcategory-group {
    margin-top: 48px;
}

/* Style the group label */
.subcategory-group label {
    display: block;
    font-weight: bold;
    font-size: 20px;
	line-height: 24px;
    margin-bottom: 15px;
}
.usluge-header-wrapper {
	display: flex;
	flex-direction: row;
	gap: 8px;
	align-items: center;
	margin-bottom: 16px;
	
}
.usluge-tekst {
	 display: block;
    font-size: 20px;
	line-height: 24px;
	color: #2E3030;
	margin: 0;
}
.usluge-header-wrapper .icon-right {
	width: 24px;
	height: 24px;
}
.usluge-kategorija {
	font-weight: 400;
}
.usluge-kategorija img {
	display: none;
}

/* Style the container that holds all subcategory options */
.subcategory-options {
    display: flex;
    flex-wrap: wrap;
    column-gap: 16px; /* Adjust spacing between items */
}

/* Style each subcategory item */
.subcategory-item {
    display: flex;
    align-items: center;
    flex-basis: calc(33.333% - 20px); /* Three columns layout, adjust as needed */
	padding-top: 8px;
	padding-bottom: 8px;
}

/* Style the checkbox */
.subcategory-item input[type="checkbox"] {
    margin-right: 10px;
    width: 24px;
    height: 24px;
    cursor: pointer;
}

/* Style the label next to each checkbox */
.subcategory-item label {
    font-size: 16px;
	line-height: 24px;
    color: #979797; /* Text color */
    cursor: pointer;
	margin: 0;
}

/* Style for checked state */
.subcategory-item input[type="checkbox"]:checked + label {
    color: #2E3030; /* Darker color for selected items */
}
.subcategory-item input[type="checkbox"] {
    display: none; /* Hide default checkbox */
}

.subcategory-item label {
    position: relative;
    padding-left: 30px; /* Space for custom checkbox */
    cursor: pointer;
}

.subcategory-item label::before {
    content: '';
    position: absolute;
    left: 0;
    top: 50%;
    transform: translateY(-50%);
    width: 24px;
    height: 24px;
    border: 1px solid #E8E8E8; /* Default border color */
    background-color: #fff; /* Default background color */
    border-radius: 8px; /* Rounded corners */
    cursor: pointer;
    transition: all 0.3s ease;
}

.subcategory-item input[type="checkbox"]:checked + label::before {
    background-color: #fff; /* Background color when checked */
    border-color: #E8E8E8; /* Border color when checked */
}

.subcategory-item input[type="checkbox"]:checked + label::after {
    content: '';
	background-image: url('/wp-content/uploads/2024/05/d-check-1.svg'); /* Checkmark */
	 background-size: contain;
    background-repeat: no-repeat;
    display: block;
    font-size: 16px;
    position: absolute;
	width: 24px;
	height: 24px;
    left: 0px;
    top: 50%;
    transform: translateY(-50%);
}
/* Responsive Design - adjust layout for smaller screens */
@media (max-width: 768px) {
    .subcategory-item {
        flex-basis: calc(50% - 20px); /* Two columns layout on medium screens */
    }
	.form-container {
		flex-direction: column;
		gap: 24px;
	}
	.left-column, .right-column {
		width: 100%;
	}
}

@media (max-width: 480px) {
    .subcategory-item {
        flex-basis: 100%; /* Full width layout on small screens */
    }
}
@media (max-width: 380px) {
   .form-group input:focus + label,
        .form-group input:not(:placeholder-shown) + label,
        .form-group select:focus + label,
        .form-group select:not([value=""]) + label {
            font-size: 8px;
        }
	.form-group label {
		top: 3px;
		font-size: 12px;
		line-height: 16px;
	}
}
/* REVIEW RESPONSE FORM */
.form-append .response-form {
	margin-top: 24px;
}
.form-append .response-form input {
	padding: 16px;
	border: 1px solid #E8E8E8;
	border-radius: 8px;
	margin-bottom: 16px;
}

.form-append .response-form input:focus-visible {
	outline: none;
}
.form-append .response-submit {
	border-radius: 0px;	
}
.form-append .response-submit:hover {
	background-color: #3E5253;
	border-color:#3E5253;
}
 .cancel-btn {
    display: inline-flex;              
    align-items: center;              
    gap: 8px;                        
    background-color: transparent !important;     
    border: none;                    
    padding: 0 !important;                      
    cursor: pointer;   
	 margin-left: 32px;
  }

  /* Optional styling for the button text */
  .cancel-btn span {
    font-size: 16px;                   /* Adjust font size if needed */
    color: #979797;                    /* Inherit color from parent, or set custom */
  }

  /* Optional styling for the image */
  .cancel-btn img {
    width: 16px;                       /* Adjust icon size */
    height: auto;
  }
/* 
SEARCH PODKATEGORIJA CSS */
.podkat-search output {
	margin-left: -8px;
}
.podkat-search ul {
	list-style: none;
}