@mixin widget-title() {
	font-size: 20px;
	text-transform: capitalize;
	color: #000;
	font-weight: bold;
	margin-bottom: 40px;
}

@mixin  footer-widget-title() {
	color: var(--g5-footer-widget-title-color);
	margin-bottom: 20px;
	font-size: 16px;
	text-transform: uppercase;
	letter-spacing: 0;
}

@mixin widget-archive() {
	list-style: none;
	padding: 0;
	margin: 0;

	li {
		position: relative;
		margin: 0;
		font-size: 14px;
		color: #393939;
		line-height: 20px;
		> a {
			display: inline-block;
			line-height: 20px;
			min-height: 20px;
			color: inherit;
			@include transition(all .3s);
			&:before {
				font-family: var(--g5-font-icon);
				content: '\f0da';
				display: inline-block;
				width: 10px;
				color: var(--g5-color-accent);
			}
			&:hover {
				color: var(--g5-color-accent);
				padding-left: 10px;
			}
		}
	}

	li + li {
		border-top: 1px solid var(--g5-border-color);
		margin-top: 14px;
		padding-top: 14px;
	}

	li > ul {
		display: none;
		list-style: none;
		border-top: 1px solid var(--g5-border-color);
		margin: 14px 0 0 0;
		padding: 14px 0 0 0;
	}

	.li-caret {
		position: absolute;
		right: 0;
		top: 18px;
		cursor: pointer;
		font-size: 10px;
		color: var(--g5-text-color-light);
		letter-spacing: -0.02em;
		&.in:before {
			content: '\f068';
		}
	}

	li > ul > li:first-child,
	> li:first-child {
		.li-caret {
			top: 5px;
		}
	}

	li li a {
		padding-left: 20px;
	}
	li li li a {
		padding-left: 40px;
	}
	li li li li a {
		padding-left: 60px;
	}
}

@mixin widget-archive-footer() {
	li {
		color: var(--g5-footer-text-color);
	}

	li + li {
		border-top: 1px solid var(--g5-footer-border-color);
	}
	li > ul {
		border-top: 1px solid var(--g5-footer-border-color);
	}

	.li-caret {
		color: var(--g5-footer-text-color);
	}
}

@mixin widget-calendar() {
	.calendar_wrap caption{
		padding-top: 0;
		padding-bottom: 8px;
		color: var(--g5-text-color-bold);
		text-transform: uppercase;
		font-weight: bold;
		letter-spacing: -0.02em;
		font-size: 13px;
	}
	#wp-calendar {
		width: 100%;
		th {
			background-color: var(--g5-border-color);
		}
		tbody td, th {
			border: solid 1px var(--g5-border-color);
			text-align: center;
		}
		tfoot td {
			color: var(--g5-text-color-bold);
			text-transform: uppercase;
			font-weight: bold;
			letter-spacing: -0.02em;
			font-size: 11px;
		}
		td#next {
			text-align: right;
		}
	}
}

@mixin widget-calendar-footer() {
	.calendar_wrap caption {
		color: var(--g5-footer-text-color);
	}

	#wp-calendar {
		th {
			background-color: var(--g5-footer-border-color);
		}

		tbody td, th {
			border: solid 1px var(--g5-footer-border-color);
		}

		tfoot td {
			color: var(--g5-footer-text-color);
		}
	}
}

@mixin widget-meta() {
	list-style: none;
	padding: 0;
	margin: 0;
	li {
		position: relative;
		margin: 0;
		font-size: 14px;
		color: var(--g5-text-color-light);
		line-height: 20px;
		a {
			color: var(--g5-text-color-bold);
			&:hover {
				color: var(--g5-color-accent);
			}
		}
		&:before {
			content: '\f0da';
			font-family: var(--g5-font-icon);
			display: inline-block;
			margin-right: 10px;
			color: var(--g5-color-accent);
		}
	}

	li + li {
		border-top: solid 1px var(--g5-border-color);
		margin-top: 11px;
		padding-top: 11px;
	}
}

@mixin widget-meta-footer() {
	li {
		color: var(--g5-footer-text-color);
		a {
			color: var(--g5-footer-text-color);
			&:hover {
				color: var(--g5-color-accent);
			}
		}
	}

	li + li {
		border-top: solid 1px var(--g5-footer-border-color);
	}
}

@mixin widget-search() {
	label {
		display: none;
	}
	@include d-flex;
	position: relative;

	input {
		@include flex-fill;
		width: 100%;
		height: 50px;
		padding: 0 50px 0 20px;
		@include border-radius(3px);
		background-color: #eeeeee;
		border: none;
		&:focus {
			border-color: var(--g5-text-color-bold);
			+ button {
				background-color: var(--g5-text-color-bold);
				color: #fff;
				border-color: var(--g5-text-color-bold);
			}
		}
	}

	button {
		position: absolute;
		right: 0;
		font-size: 0;
		padding: 0;
		width: 50px;
		height: 50px;
		@include border-radius(0px 3px 3px 0);
		background-color: var(--g5-color-accent);
		color: var(--g5-color-accent-foreground);
		border-color: var(--g5-color-accent);
		&:hover {
			background-color: var(--g5-text-color-bold);
			color: #fff;
			border-color: var(--g5-text-color-bold);
		}

		&:before {
			content: '\f002';
			font-family: var(--g5-font-icon);
			font-size: 15px;
			font-weight: 400;
		}
		> span,
		> i{
			display: none;
		}
	}
}

@mixin widget-search-footer() {
	input {
		background-color: #eeeeee;
		&:focus {
			border-color: var(--g5-footer-border-color);
		}
	}
}

@mixin widget-tag() {
	font-size: 0;
	label {
		margin: 0 30px 0 0;
		font-size: 14px;
		font-weight: bold;
		letter-spacing: -0.03em;
		text-transform: uppercase;
		color: var(--g5-text-color-medium);
	}
	margin-bottom: -5px;
	a {
		border: 2px solid #f0f0f0;
		display: inline-block;
		color: #393939;
		font-size: 13px !important;
		@include border-radius(4px);
		line-height: 20px;
		padding: 5px 10px;
		margin: 0 5px 5px 0;
		@include transition03();
		&:hover {
			background-color: var(--g5-color-accent);
			color: var(--g5-color-accent-foreground);
			border-color: var(--g5-color-accent);
		}
	}
}

@mixin widget-tag-footer() {
	a {
		border-color: var(--g5-footer-border-color);
		color: var(--g5-footer-text-color);
		&:hover {
			background-color: var(--g5-color-accent);
			color: var(--g5-color-accent-foreground);
			border-color: var(--g5-color-accent);
		}
	}
}