/* -----------------------------------------
 Modules
----------------------------------------- */

/* General Layout
=================================== */
.container {
	@include media-breakpoint-down(sm) {
		width: 100%;
	}
}

.page-wrap {
	display: flex;
	flex-direction: column;
	min-height: 100%;
	max-width: 100%;
	margin: 0 auto;
	position: relative;
}

.layout-boxed {
	.page-wrap {
		width: 1400px;
		background-color: lighten($grey, 3%);
		position: relative;
	}

	.container {
		@include media-breakpoint-up(xl) {
			padding-left: 30px;
			padding-right: 30px;
		}
	}
}

.site-content-wrap {
	display: flex;
	flex-direction: column;
	flex: auto;
}

.main {
	padding: $section-padding-lg 0;

	@include media-breakpoint-down(md) {
		padding: $section-padding-md 0;
	}

	@include media-breakpoint-down(sm) {
		padding: $section-padding-sm 0;
	}
}

.sidebar {
	@include media-breakpoint-down(md) {
		margin-top: 80px;
	}
}

/* Sections
=================================== */
.widget-section {
	margin-bottom: $section-padding-lg;
	background-position: center;
	background-repeat: no-repeat;
	background-size: cover;
	position: relative;

	@include media-breakpoint-down(md) {
		margin-bottom: $section-padding-md;
	}

	@include media-breakpoint-down(sm) {
		margin-bottom: $section-padding-sm;
	}

	&.widget-section-no-pad-bottom {
		padding-bottom: 0;
	}

	&:last-child {
		margin-bottom: 0;
	}

	.footer-widget-sections & {
		&:first-child {
			&:not(.widget-section-padded) {
				padding-top: 0;
			}
		}
	}

	&::before {
		content: "";
		position: absolute;
		width: 100%;
		height: 100%;
		top: 0;
		left: 0;
		pointer-events: none;
	}

	+ .no-title-subtitle {
		margin-top: -$section-padding-lg;

		@include media-breakpoint-down(md) {
			margin-top: -$section-padding-md;
		}

		@include media-breakpoint-down(sm) {
			margin-top: -$section-padding-sm;
		}
	}
}

.widget-section-parallax {
	background-attachment: fixed;
}

.section-heading {
	margin-bottom: 50px;
	text-align: center;

	&::after {
		content: "";
		width: 36px;
		margin: 10px auto;
		height: 4px;
		background-color: $accent-color-alt;
		display: block;
	}
}

.section-title {
	margin: 0;
	font-weight: $font-weight-extra-bold;
	font-size: 32px;
	line-height: normal;
}

.widget-section {
	> .section-title {
		margin-bottom: 50px;
		text-align: center;
	}
}

.content-narrow {
	margin: 0 auto;
	max-width: 66.6667%;

	@include media-breakpoint-down(lg) {
		max-width: 100%;
	}
}

.section-subtitle {
	margin: 0;
	text-transform: uppercase;
	font-size: 14px;
	letter-spacing: .142857143em;
	color: $text-color-light;

	a {
		color: $text-color;
	}
}

.section-hero {
	.entry-content {
		:last-child {
			margin-bottom: 0;
		}
	}

	.btn {
		margin-top: 15px;
	}
}

.section-hero-thumb {
	margin-bottom: 45px;

	img {
		border-radius: $border-radius-base;
	}
}

/* Entry Styles
=================================== */
.entry-item {
	margin: 0 0 $content-spacing-lg;

	@include media-breakpoint-down(md) {
		margin: 0 0 $content-spacing-md;
	}

	@include media-breakpoint-down(sm) {
		margin: 0 0 $content-spacing-sm;
	}
}

.entry-item-media {
	@include media-breakpoint-up(md) {
		display: flex;

		.entry-thumb {
			flex: none;
			max-width: 200px;
			margin-right: $grid-gutter-width-base;
		}
	}

	@include media-breakpoint-up(xl) {
		.entry-thumb {
			max-width: 250px;
		}
	}
}

.entry-item-content-wrap {
	flex: auto;
}

.entry-header {
	margin-bottom: 30px;
	padding-bottom: 15px;
	border-bottom: solid 1px $border-color;

	.entry-title {
		&:only-child {
			margin-bottom: 0;
		}
	}
}

.entry-title {
	display: block;
	font-size: 32px;
	line-height: normal;
	color: $text-color;

	.row-columns-2 &,
	.row-columns-3 &,
	.row-columns-4 & {
		font-size: 26px;
	}

	@include media-breakpoint-down(sm) {
		font-size: 26px;
	}
}

.entry-meta {
	font-size: 14px;
	margin-top: -25px;
	color: $text-color-light;

	@include media-breakpoint-down(sm) {
		font-size: 11px;
	}

	i.fas {
		color: $accent-color-alt;
		margin-right: 3px;
	}

	span {
		&::after {
			content: "\2022";
			margin: 0 4px;
			opacity: .5;
		}

		&:last-child {
			&::after {
				display: none;
			}
		}
	}
}

.entry-thumb {
	margin-bottom: 30px;

	img {
		border-radius: $border-radius-base;
	}

	&.alignnone,
	&.alignleft,
	&.alignright,
	&.aligncenter {
		margin-top: 0;
	}
}

.entry-content {
	@include clearfix;

	h1, h2, h3, h4, h5, h6 {
		margin: 40px 0 20px;

		&:first-child {
			margin-top: 0;
		}
	}

	.button,
	.btn,
	button {
		text-decoration: none;
	}

	.fluid-width-video-wrapper,
	audio,
	video,
	blockquote {
		margin: 50px 0;

		&:first-child {
			margin-top: 0;
		}

		&:last-child {
			margin-bottom: 0;
		}
	}

	blockquote {
		font-size: 16px;
		line-height: 1.333333333;
		position: relative;
		padding: 30px 30px 30px 80px;
		background-color: $grey-light;
		border: 0;

		p:last-child {
			margin: 0;
		}

		&::before {
			content: "\00201C";
			font-style: normal;
			font-size: 4rem;
			line-height: 0;
			position: absolute;
			left: 30px;
			top: 57px;
			color: $accent-color-alt;
		}
	}

	.alignleft,
	.alignright {
		@include media-breakpoint-down(sm) {
			display: block;
			float: none;
			margin-left: auto;
			margin-right: auto;
		}
	}
}

.theme-table {
	margin: 40px 0;
	border: 2px solid $text-color;

	th,
	td {
		border-bottom: 1px solid rgba($black, .1);
	}

	caption,
	th,
	td {
		font-weight: normal;
		text-align: left;
		padding: 8px 15px;
		vertical-align: middle;
	}

	th {
		border-width: 0 1px 1px 0;
		font-weight: $font-weight-bold;
		text-transform: uppercase;
		font-size: 85%;
		background-color: $text-color;
		color: $text-on-accent;
		padding-top: 10px;
		padding-bottom: 10px;
	}

	td {
		border: 1px solid $border-color;
		font-size: 14px;
	}
}

.entry-content-intro {
	font-size: 18px;
	line-height: 1.5;
	margin-bottom: 40px;

	&:first-letter {
		float: left;
		padding: 0 10px 0 0;
		font-size: 3.4rem;
		line-height: 1;
		color: $accent-color;
	}
}

.entry-content-column-split {
	@include media-breakpoint-up(md) {
		columns: 2;
	}
}

.entry-more-btn {
	margin-top: 0;
}

.entry-author-box {
	display: flex;
}

.entry-author-thumbnail {
	width: 78px;
	flex: none;
	margin-right: 30px;

	@include media-breakpoint-down(md) {
		margin-right: 15px;
	}
}

.entry-author-desc {
	font-size: 14px;

	:last-child {
		margin: 0;
	}
}

.entry-author-title {
	font-size: 18px;
	margin-bottom: 15px;
}

.entry-author-subtitle {
	font-size: 11px;
	letter-spacing: $letter-spacing-default;
	text-transform: uppercase;
	margin: -15px 0 15px;
}

.entry-section {
	border-top: 3px solid $border-color;
	padding-top: $content-spacing-lg;
	margin-top: $content-spacing-lg;

	@include media-breakpoint-down(md) {
		padding-top: $content-spacing-md;
		margin-top: $content-spacing-md;
	}

	@include media-breakpoint-down(sm) {
		padding-top: $content-spacing-sm;
		margin-top: $content-spacing-sm;
	}
}

.entry-section-title {
	@include media-breakpoint-down(sm) {
		font-size: 22px;
	}
}

/* Post & Custom Post Type Metadata
=================================== */


/* Items & Item Listings
=================================== */
.row-items {
	margin-bottom: -30px;
	position: relative;

	&.no-gutters {
		margin-bottom: 0;
	}

	[class^="col-12"] {
		&:last-child {
			.entry-item-media {
				margin-bottom: 0;
			}
		}
	}
}

// Generic items
.ci-item {
	margin-bottom: 50px;

	.no-gutters & {
		margin-bottom: 0;
	}
}

// Overlaid items
.ci-item-overlay {
	position: relative;
	height: 0;
	padding-bottom: 57.5%;
	background-position: center;
	background-size: cover;
	background-repeat: no-repeat;
	border-radius: $border-radius-base;
	overflow: hidden;

	&::before {
		content: "";
		pointer-events: none;
		position: absolute;
		background-color: rgba($accent-color, .5);
		width: 100%;
		height: 100%;
		top: 0;
		left: 0;
		transition: background-color .18s ease;
		z-index: 1;
	}

	&:hover {
		&::before {
			background-color: rgba($accent-color, .8);
		}
	}

	.ci-item-overlay-thumb {
		position: absolute;
		top: 0;
		right: 0;
		bottom: 0;
		left: 0;

		img {
			object-fit: cover;
			object-position: center;
			min-width: 100%;
			min-height: 100%;
		}
	}

	.ci-item-content {
		position: absolute;
		width: 100%;
		bottom: 0;
		left: 0;
		text-align: left;
		color: $white;
		padding: 30px;
		z-index: 2;

		@include media-breakpoint-down(md) {
			padding: 15px;
		}
	}

	.ci-item-title {
		margin: 0;
		display: block;

		a {
			color: $white;
		}

		[class^="col-xl-3"] & {
			font-size: 18px;
		}

		@include media-breakpoint-down(md) {
			font-size: 18px;
		}
	}

	.ci-item-subtitle {
		margin: 0;

		a,
		a:hover {
			color: $white;
		}
	}
}

.ci-item-thumb {
	margin-bottom: 20px;

	img {
		border-radius: $border-radius-base;
	}
}

.ci-item-title {
	font-size: 20px;
	font-weight: 700;
	margin-bottom: 15px;
}

.ci-item-subtitle {
	font-size: 14px;
	line-height: normal;
	margin: -15px 0 20px;
}

.ci-item-excerpt {
	margin-bottom: 30px;

	p {
		margin-bottom: 0;
	}
}

.ci-item-list-meta {
	margin: 0 0 20px;
	padding: 0;
	list-style: none;
}

.ci-item-list-meta-item {
	display: block;
	padding: 3px 0;

	[class^="fa"] {
		color: $accent-color-alt;
		display: inline-block;
		min-width: 20px;
	}
}

.ci-item-more-btn {
	[class^="fa"] {
		margin-left: 5px;
		position: relative;
		top: 1px;
		opacity: .8;
	}
}

// Testimonial items

.ci-item-testimonial {
	margin: 0 0 70px;
	padding: 0;
	border: 0;
	text-decoration: none;
}

.ci-item-testimonial-content {
	background-color: $grey-light;
	border-radius: 3px;
	padding: 25px 25px 25px 60px;
	font-size: 18px;
	line-height: 1.3;
	position: relative;

	&::before {
		content: "\201C";
		color: $accent-color-alt;
		position: absolute;
		font-size: 70px;
		line-height: 1;
		left: 20px;
		top: 20px;
	}

	p {
		&:last-child {
			margin-bottom: 0;
		}
	}

	.widget & {
		font-size: 16px;
	}

	@include media-breakpoint-down(sm) {
		font-size: 18px;
		line-height: 1.5;
	}
}

.ci-item-testimonial-cite {
	display: flex;
	align-items: center;
	margin: 30px 0 0 55px;
	text-decoration: none;
	font-style: normal;
	font-weight: normal;
	line-height:  normal;

	.col-xl-3 &,
	.widget & {
		margin-left: 0;
	}

	.col-xl-4 & {
		margin-left: 30px;
	}

	@include media-breakpoint-down(sm) {
		margin-left: 0;
	}
}

.ci-item-testimonial-cite-thumb {
	width: 64px;
	flex: none;
	margin-right: 15px;
	border-radius: 50%;
}

.ci-item-testimonial-cite-name {
	display: block;
	font-size: 16px;
	margin-bottom: 3px;
}

.ci-item-testimonial-cite-subtitle {
	display: block;
	font-size: 13px;
}

// Entry items

.ci-item-entry {
	margin-bottom: 30px;
}

.ci-item-entry-thumb {
	margin-bottom: 25px;

	img {
		border-radius: $border-radius-base;
	}
}

.ci-item-entry-title {
	font-size: 18px;
	margin: 0;
	color: $text-color;
}

.ci-item-entry-meta {
	font-size: 14px;
	color: $text-color-light;

	i.fas {
		color: $accent-color-alt;
		margin-right: 3px;
	}
}

.ci-item-badge {
	text-transform: uppercase;
	color: $text-on-accent;
	background-color: $accent-color;
	position: absolute;
	top: 0;
	right: 0;
	font-size: 12px;
	letter-spacing: $letter-spacing-default;
	padding: 6px 15px;
}

/* Single custom post meta
=================================== */
.ci-entry-list-meta {
	display: flex;
	justify-content: space-between;
	margin: 0 0 30px;
	padding: 20px;
	list-style: none;
	background-color: $accent-color;
	border-radius: $border-radius-base;
	color: $text-on-accent;

	@include media-breakpoint-down(sm) {
		flex-wrap: wrap;
		padding: 10px;
	}
}

.ci-entry-list-meta-item {
	padding: 10px;
	width: 33.3333%;

	@include media-breakpoint-down(sm) {
		width: 100%;
	}
}

.ci-entry-list-meta-label {
	display: block;
	font-size: 10px;
	font-weight: $font-weight-extra-bold;
	text-transform: uppercase;
	letter-spacing: 2.9px;
}

.ci-entry-list-meta-value {
	display: block;
	font-size: 16px;
	line-height: 1.4em;
	font-weight: $font-weight-extra-bold;
}

.dataTables_wrapper {
	@include media-breakpoint-down(sm) {
		max-width: 100%;
		overflow-y: scroll;
	}
}

table.table-styled {
	font-size: 14px;
	font-weight: 400;
	margin: 35px 0;
	width: 100%;
	max-width: 100%;

	&:first-child {
		margin-top: 0;
	}

	&.no-footer {
		border-bottom: 1px solid darken($border-color, 5%);
	}

	th, td {
		text-align: left;
		padding: 5px;
	}

	thead {
		th {
			border: 0;
			background-color: $accent-color;
			color: $text-on-accent;
			padding: 10px 18px 10px 10px;
			font-size: 10px;
			font-weight: 700;
			text-transform: uppercase;
			letter-spacing: 2.9px;

			&:first-child {
				border-top-left-radius: 4px;
			}

			&:last-child {
				border-top-right-radius: 4px;
			}
		}

		.sorting,
		.sorting_asc,
		.sorting_desc {
			position: relative;
			background-image: none;

			&::after {
				@include font-awesome(\f0dc, 'regular');
				opacity: .7;
				position: absolute;
				color: $text-on-accent;
				right: 10px;
				top: 50%;
				transform: translateY(-50%);
			}
		}

		.sorting_asc {
			&::after {
				content: "\f0de";
				opacity: 1;
			}
		}

		.sorting_desc {
			&::after {
				content: "\f0dd";
				opacity: 1;
			}
		}
	}

	tbody {
		tr {
			&:nth-child(even) {
				background-color: $grey-light;
			}
		}

		td {
			border: 0;
			padding: 10px;
		}
	}

	.td-label {
		display: none;
	}

	@include media-breakpoint-down(sm) {
		thead {
			display: none;
		}

		tbody {
			tr {
				padding: 10px 15px;
				display: block;
				margin-top: -1px;
			}

			td {
				display: block;
				padding: 0;
				font-size: 14px;

				&:first-child {
					font-size: 16px;
					font-weight: $font-weight-extra-bold;
					padding: 0 0 5px;
				}
			}

			.td-label {
				display: inline-block;
				margin-right: 3px;
				font-weight: $font-weight-extra-bold;
				opacity: .8;
			}
		}
	}
}

table.table-styled-lg {
	thead {
		th {
			padding: 12px 15px;
			font-size: 12px;
		}
	}

	tbody {
		td {
			font-size: 15px;
			padding: 15px 15px;
		}
	}
}


/* Isotope Filtering
=================================== */
.ci-item-filters {
	margin-bottom: 50px;

	@include media-breakpoint-down(md) {
		display: flex;
		flex-wrap: wrap;
	}
}

.ci-item-filter {
	@include button;
	@include button-default;
	@include button-sm;
	letter-spacing: 0;

	@include media-breakpoint-down(md) {
		margin: 1px;
		flex: 1 0 49%;
	}
}

.filter-active {
	color: $white;
	border-color: $accent-color-alt;
	background-color: $accent-color-alt;
}

/* Pagination
=================================== */
.navigation,
.woocommerce-pagination {
	margin: 60px 0 0;
	text-align: center;

	a,
	.page-numbers {
		display: inline-block;
		padding: 11px 19px;
		font-size: 13px !important;
		margin-right: 10px;
		margin-bottom: 3px;
		border: 2px solid $border-color;
		color: $accent-color;
		border-radius: 3px;
	}

	a:hover, // sass-lint:disable-line force-pseudo-nesting
	.current {
		border-color: $button-border-color;
	}

	.nav-links {
		@include clearfix;
	}

	.nav-previous {
		float: left;
	}

	.nav-next {
		float: right;
	}
}

.comment-navigation {
	margin: 30px 0;
}

.page-links {
	margin: 60px 0 15px;

	.page-number {
		display: inline-block;
		padding: 11px 19px;
		font-size: 13px !important;
		margin-right: 10px;
		margin-bottom: 3px;
	  	border-radius: 3px;
		border: 2px solid $border-color;
		color: $accent-color;
		background: none;

		&:hover {
			border-color: $button-border-color;
		}
	}

	> .page-number {
		border-color: $button-border-color;
	}

	> a,
	> span {
		&:first-child {
			margin-left: 10px;
		}
	}

  	.current {
	  .page-number {
		border-color: $accent-color;
	  }
	}
}

/* Button Items
========================================= */
.ci-item-btn {
	display: flex;
	align-items: center;
	padding: 15px;
	line-height:  normal;
	background-color: $button-bg-color;
	color: $button-text-color;
	border: 2px solid $button-border-color;
	border-radius: 3px;
	margin-bottom: 10px;

	&:hover {
		background-color: $accent-color-alt;
		border-color: $accent-color-alt;
		color: $white;
	}

	&:last-child {
		margin-bottom: 0;
	}
}

.ci-item-btn-icon {
	flex: none;
	margin-right: 12px;
	line-height: 1;
	font-size: 32px;

	.ci-item-btn-sm & {
		font-size: inherit;
	}
}

.ci-item-btn-title {
	font-size: 16px;
	display: block;
}

.ci-item-btn-subtitle {
	display: block;
	font-size: 12px;
}

/* Social Icons
=================================== */
.list-social-icons {
	margin: 0;
	padding: 0;
	list-style: none;

	li {
		display: inline-block;
		margin: 3px 5px;
	}
}

.social-icon {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	font-size: 12px;
	text-align: center;
	color: $accent-color;
	border-radius: $border-radius-base;
	width: 18px;
	height: 18px;

	&:hover {
		color: $accent-color-alt;
	}

	.header & {
		font-size: inherit;
	}
}

/* Responsive embeds
=================================== */
.convert-responsive-embed {
	position: relative;
	padding-top: 56.25%;
	height: 0;
	overflow: hidden;
	max-width: 100%;

	iframe,
	object,
	embed {
		position: absolute;
		top: 0;
		left: 0;
		width: 100%;
		height: 100%;
	}
}

/* Back to top button
=================================== */
.btn-to-top {
	position: fixed;
	display: flex;
	bottom: 30px;
	right: 30px;
	align-items: center;
	justify-content: center;
	line-height: 1;
	width: 50px;
	height: 50px;
	background: $white;
	color: $text-color;
	box-shadow: 0 0 5px rgba($black, .075);
	border: 0;
	border-radius: 3px;
	font-size: 24px;
	cursor: pointer;
	user-select: none;
	opacity: 0;
	pointer-events: none;
	transition: opacity .18s ease;
	z-index: 10;

	.is-customize-preview & {
		opacity: 1 !important;
		pointer-events: auto !important;
		display: flex !important;
	}

	&:active,
	&:focus {
		outline: 0;
	}
}

.btn-to-top-visible {
	opacity: 1;
	pointer-events: auto;
}

/* Menu Listing
=================================== */
.menu-category {
  margin-bottom: 45px;

	&:last-child {
		margin-bottom: 0;
	}
}

.menu-category-title {
	margin-bottom: 45px;
	text-align: center;

	.entry-content & {
		margin-bottom: 45px;
	}
}

.ci-item-menu {
	display: flex;
	align-items: center;
	margin-bottom: 45px;

	@include media-breakpoint-down(md) {
		align-items: flex-start;
	}
}

.ci-item-menu-thumb {
	margin-right: 20px;
	width: 76px;
	flex: none;

	img {
		width: 100%;
		border-radius: 50%;
	}

	@include media-breakpoint-down(md) {
		width: 120px;
	}

	.elementor & {
		margin-right: 20px !important;

		img {
			border-radius: 50%;
		}
	}
}

.ci-item-menu-content {
	flex: 1;
}

.ci-item-menu-title {
	margin-bottom: 0;
	line-height: normal;
	display: flex;
	justify-content: space-between;
	font-size: 1.15rem;

	&::after {
		content: "";
		border-bottom: 2px dotted $border-color;
		width: auto;
		flex: 1 1 auto;
		position: relative;
		top: -3px;
		margin-left: 3px;
	}
}

.ci-item-menu-price {
	margin-left: auto;
	padding-left: 5px;
	order: 3;
	display: inline-block;
}

.ci-item-menu-desc {
	display: block;
	margin: 10px 0 0;
}

// Hooks display
.convert-plugin-visible-hook {
	text-align: center;
	padding: 8px;
	margin: 5px;
	border-radius: 4px;
	font-size: 13px;
	font-weight: 700;
	color: $black;
	background: #aeecf9;
}