/*
Theme Name: Avada Child
Description: Child theme for Avada theme
Author: ThemeFusion
Author URI: https://theme-fusion.com
Template: Avada
Version: 1.0.0
Text Domain: Verificat
*/

[v-cloak] {
	display: none;
}

.ocv-pagination {
	display: flex;
	justify-content: flex-end;
	margin: 40px 0;

	ul {
		padding: 0;
		list-style: none;
		display: flex;
		gap: 5px;

		li {

			button,
			.ellipsis {
				background-color: transparent;
				outline: none;
				cursor: pointer;
				color: #000000;
				border: 0;
				width: 36px;
				height: 36px;
				border-radius: 3px;
				background-color: #f0f0f0;
				color: black;
				transition: all 0.3s;

				&.text {
					width: auto;
					display: flex;
					align-items: center;
					justify-content: center;
					padding: 0 10px;
					gap: 6px;
				}
			}

			.ellipsis {
				cursor: default;
				display: flex;
				align-items: center;
				justify-content: center;
				padding: 0 10px;
			}

			input[type="number"] {
				width: 64px;
				height: 36px;
				border-radius: 3px;
				border: 1px solid #cccccc;
				padding: 0 10px;
				font-size: 16px;
			}

			&.current,
			&:hover {

				button {
					color: #FFFFFF;
					background-color: var(--awb-color5);
				}
			}
		}
	}
}

#vc-breadcrumbs {
	font-size: 14px;

	ul {
		list-style: none;
		padding: 0;
		margin: 0;
		display: flex;
		flex-wrap: wrap;

		li {
			a {
				color: black;
				text-decoration: none;

				&:hover {
					text-decoration: none !important;
					color: var(--awb-color5);
				}
			}

			.separator {
				padding-right: 4px;
			}

			&:last-child {

				span {
					color: var(--awb-color5);
				}
			}
		}
	}
}

.marquee-inactive #vc-marquee {
	display: none;
}

.vc-marquee-text {
	flex-shrink: 1;
	overflow: hidden;
	white-space: nowrap;
	position: relative;

	&:after,
	&:before {
		content: '';
		display: block;
		width: 60px;
		height: 100%;
		position: absolute;
		top: 0;
		z-index: 10;
	}

	&:before {
		left: 0;
		background: linear-gradient(to right, var(--awb-color5), rgba(255, 255, 255, 0));
	}

	&:after {
		right: 0;
		background: linear-gradient(to left, var(--awb-color5), rgba(255, 255, 255, 0));
	}

	.vc-marquee-content {
		width: fit-content;

		a,
		span {
			padding-left: 100px;
			color: white;
		}
	}
}

.vc-legacy-post {

	.vc-post-content {

		.wp-block-post-featured-image,
		.wp-block-post-date,
		.wp-block-post-terms,
		.wpml-language-switcher-block {
			display: none;
		}

		.wp-block-heading {
			margin-top: 30px;
			margin-bottom: 10px;
		}
	}
}

.vc-related-posts-links {
	display: flex;
	flex-wrap: wrap;
	flex-direction: column;
	margin-bottom: 20px;

	a {

		&:before {
			content: "";
			display: inline-block;
			width: 10px;
			height: 10px;
			background-color: var(--awb-color5);
			border-radius: 50%;
			margin-right: 10px;
		}
	}
}

.vc-home-featured-posts-separator {
	height: 1px;
	background-color: var(--awb-color5);
	margin-bottom: 20px;
}

.vc-post-home-tags {
	display: flex;
	flex-wrap: wrap;
	gap: 10px;

	a {
		color: black;
		background-color: var(--awb-color3);
		padding: 3px 10px;
		font-size: 14px;

		&:hover {
			text-decoration: none !important;
		}
	}
}

.vc-post-evergreen-categories {
	display: flex;
	flex-wrap: wrap;
	gap: 10px;
	margin-bottom: 10px;

	a {
		color: white;
		background-color: var(--awb-color6);
		padding: 3px 10px;
		font-size: 14px;

		&:hover {
			color: white;
			text-decoration: none !important;
		}
	}
}

#vc-vertical {
	border-top: 1px solid white;

	ul {
		list-style: none;
		padding: 0;
		margin: 0;
		display: grid;
		grid-template-columns: repeat(auto-fit, minmax(190px, 1fr));

		li {

			button {
				background: none;
				border: none;
				font-size: 20px;
				cursor: pointer;
				padding-bottom: 5px;
				color: white;
				width: 100%;
				height: 100%;
				padding: 20px;
				transition: all 0.3s ease;

				&:hover,
				&.active {
					background-color: rgba(0, 0, 0, 0.2);
				}
			}
		}
	}
}

#vc-vertical-content {

	.vc-tab {

		.vc-tab-contents-menu {
			list-style: none;
			padding: 0;
			margin: 0;

			li {
				border-bottom: 1px solid #cccccc;
				padding: 16px 0;

				button {
					background-color: transparent;
					border: 0;
					padding: 0;
					margin: 0;
					border-radius: 0;
					text-align: left;
					cursor: pointer;
					display: block;
					font-size: 16px;
				}

				&:last-child {
					border-bottom: none;
				}
			}
		}

		&.vc-hidden {
			display: none;
		}
	}
}

.vc-lateral-menu {

	ul {
		list-style: none;
		padding: 0;
		margin: 0;
		padding-left: 40px;

		li {
			position: relative;
			border-bottom: 1px dashed black;
			padding: 8px 0 6px;

			.icon {
				position: absolute;
				left: -40px;
				top: 8px;
				width: 24px;
				height: 24px;
				font-size: 12px;
				color: white;
				background-color: var(--awb-color5);
				border-radius: 50%;
				display: flex;
				justify-content: center;
				align-items: center;
			}

			a {
				color: var(--awb-color5);
				text-decoration: none;

				&:hover {
					text-decoration: none !important;
				}
			}

			&:last-child {
				border-bottom: none;
			}
		}
	}
}

.vc-post-main-taxonomies {
	display: flex;
	flex-wrap: wrap;
	gap: 10px;
	margin-bottom: 20px;
	list-style: none;
	padding: 0;
	margin: 0;

	li {

		a {
			color: var(--awb-color5);
			font-size: 22px;
			font-weight: bold;
			text-decoration: none;

			&:hover {
				text-decoration: none !important;
			}
		}

		&:after {
			content: "|";
			display: inline-block;
			color: var(--awb-color5);
			font-size: 22px;
			font-weight: bold;
			margin-left: 6px;
		}

		&:last-child:after {
			content: "";
		}
	}
}

.vc-post-age {

	.vc-post-age-content {
		display: inline-block;
		background-color: var(--awb-color5);
		color: white;
		padding: 4px 16px 3px;
		font-size: 14px;

		i {
			margin-right: 5px;
		}
	}
}

.vc-member-social {
	display: flex;
	align-items: center;
	gap: 10px;

	ul {
		list-style: none;
		padding: 0;
		margin: 0;
		display: flex;
		gap: 10px;

		li {

			.vc-member-social-link {
				background-color: #f3f3f3;
				border-radius: 50%;
				width: 36px;
				height: 36px;
				display: flex;
				justify-content: center;
				align-items: center;
				color: var(--awb-color5);
				text-decoration: none !important;
				font-size: 22px;
			}
		}
	}
}

#vc-posts {

	.filters-wrapper {
		margin-bottom: 40px;

		.categories {

			ul {
				list-style: none;
				padding: 0;
				margin: 0;
				display: grid;
				grid-template-columns: repeat(auto-fit, minmax(120px, 1fr));
				gap: 20px;

				li {
					border-bottom: 4px solid #d8d8d8;
					transition: all 0.3s;

					button {
						background-color: transparent;
						border: 0;
						color: var(--awb-color5);
						padding: 10px 0;
						border-radius: 0;
						cursor: pointer;
						transition: all 0.3s;
						font-size: 18px;
						text-align: left;


						&:hover {
							color: #5e5e5e;
						}
					}

					&.active {
						border-bottom-color: var(--awb-color5);

						button {
							color: #5e5e5e;
						}
					}
				}
			}
		}
	}

	.posts-wrapper {
		margin: 0;
		padding: 0;
		list-style: none;
		display: grid;
		grid-template-columns: repeat(auto-fill, minmax(285px, 1fr));
		column-gap: 30px;
		row-gap: 60px;

		li {
			display: flex;
			flex-direction: column;

			a {
				position: relative;
				text-decoration: none !important;

				.post-image {
					margin-bottom: 20px;

					img {
						width: 100%;
						aspect-ratio: 4/3;
						object-fit: cover;
					}
				}

				h3 {
					margin-bottom: 15px;
					font-size: 26px;
					color: black;
					font-weight: 600;
					transition: all 0.3s;
				}

				.description {
					color: black;
					font-size: 18px;
				}

				&:hover {

					h3 {
						color: var(--awb-color5);
					}
				}
			}
		}
	}
}

.vc-post-image {

	a {
		display: inline-block;
		position: relative;

		.wp-post-image {
			object-position: center;
			object-fit: cover;
		}

		.vc-post-image-qualification {
			position: absolute;
			top: 0;
			left: 0;
			width: 100%;
			height: 100%;
			background-repeat: repeat;
		}
	}
}