/* 
Theme Name:		 hello-elementor-child
Theme URI:		 http://childtheme-generator.com/
Description:	 hello-elementor-child is a child theme of Hello Elementor, created by ChildTheme-Generator.com
Author:			 Shams
Author URI:		 http://childtheme-generator.com/
Template:		 hello-elementor
Version:		 1.0.0
Text Domain:	 hello-elementor-child
*/


/*
    Add your custom styles here
*//* Header Search */
.xpro-ajax-data-fetch-wrapper {
	&.xpro-ajax-data-fetch-layout-4 {
		left: 0;
		width: 90%;

		.xpro-live-search-post-item {
			.xpro-live-search-post-img-wrap {
				width: auto;
				align-items: flex-start;
			}
		}
	}
}

.xpro-elementor-search-button-close {
	top: 20px;
	right: 20px;
}

.xpro-elementor-search-layout-4 {
	.xpro-elementor-search-inner {
		padding: 20px;
		backdrop-filter: blur(4px);
	}
}

.xpro-ajax-data-fetch-layout-3,
.xpro-ajax-data-fetch-layout-4,
.xpro-ajax-data-fetch-layout-5 {
	.xpro-live-search-post-item {
		.xpro-live-search-post-content-wrap {
			padding-left: 10px;
		}
	}
}

.xpro-live-search-post-title {
	margin-top: 0;
}

/* Post Meta */
.xpro-post-meta-list-icon {
	line-height: 0;
}

.xpro-post-grid-meta-list,
.xpro-post-list-meta-list {
	svg {
		width: 1em;
	}
}

.xpro-post-meta-list-item {
	display: inline-flex;
	align-items: center;
}

/* Post Loop */
@media screen and (max-width: 767px) {
	.xpro-filter-dropdown-mobile {
		.xpro-select-option,
		.cbp-l-filters-button {
			border: 1px solid var(--e-global-color-17e0445);
			border-radius: 10px;
		}

		.cbp-l-filters-button {
			border-radius: 10px !important;
			overflow: hidden;

			.cbp-filter-item {
				border: 1px solid var(--e-global-color-17e0445);
				border-bottom: 1px solid var(--e-global-color-17e0445) !important;
				border-radius: 10px;
				color: var(--e-global-color-primary) !important;
				background-color: var(--e-global-color-aa56e1c) !important;
			}
		}
	}
}

/* Post navigation */
.xpro-elementor-post-navigation {
	gap: 10px;

	@media screen and (max-width: 767px) {
		flex-direction: column;

		.xpro-elementor-post-navigation-link {
			width: 100%;
		}

		.xpro-elementor-post-navigation-separator {
			height: 1px;
			width: 100%;
		}
	}
}

/* Comments */
.comments-area {
	.comment-reply-title,
	.title-comments {
		color: var(--e-global-color-primary);
		font-family: var(--e-global-typography-21f4bbd-font-family), Sans-serif;
		font-size: var(--e-global-typography-21f4bbd-font-size);
		font-weight: var(--e-global-typography-21f4bbd-font-weight);
		line-height: var(--e-global-typography-21f4bbd-line-height);
		margin-block: 0;
	}

	.comment-reply-title {
		margin-block-end: 0.7rem;
		display: flex;
		align-items: center;
		justify-content: space-between;
		gap: 10px;
	}

	.submit {
		border: 0;
	}

	.comment-form {
		display: grid;
		gap: 1rem;

		label {
			font-size: var(--e-global-typography-25eb36e-font-size);
			margin-bottom: 0.5rem;
			font-weight: 500;
			width: 100%;
		}

		input[type="date"],
		input[type="email"],
		input[type="number"],
		input[type="password"],
		input[type="search"],
		input[type="tel"],
		input[type="text"],
		input[type="time"],
		input[type="url"],
		select,
		textarea {
			border: 1px solid var(--e-global-color-17e0445);
			outline: 0;

			&:focus {
				border-color: var(--e-global-color-accent);
			}
		}

		textarea {
			height: 5rem;
		}

		.comment-form-cookies-consent {
			display: flex;
			align-items: flex-start;
			gap: 0.5rem;
		}
	}
}

.comments-area,
.page-content {
	a {
		text-decoration: none;
		font-weight: 600;
		color: var(--e-global-color-primary);
		transition: all 0.2s ease-in-out;

		&:hover {
			color: var(--e-global-color-accent);
		}
	}
}

#comments {
	.comment,
	.pingback {
		.avatar {
			width: 40px;
			height: 40px;
			object-fit: cover;
		}

		.comment-body {
			gap: 0.7rem;
			padding-block: clamp(1.25rem, 0.9028rem + 1.1111vw, 1.875rem);
			border-block-end: 1px solid var(--e-global-color-17e0445);
		}
	}

	.comment-meta {
		margin-block-end: 0;
		gap: 0.5rem;
	}

	@media (max-width: 767px) {
		.comment-meta {
			flex-direction: column-reverse;
		}
	}

	.comment-metadata {
		display: flex;
		gap: 10px;
		font-size: var(--e-global-typography-25eb36e-font-size);
	}

	.reply {
		font-size: var(--e-global-typography-25eb36e-font-size);
	}

	.comment-list {
		font-size: 100%;
	}

	.comment-respond {
		padding-top: 20px;
	}

	.comment-notes {
		font-size: var(--e-global-typography-25eb36e-font-size);
		margin-top: 0.7rem;
		color: var(--e-global-color-9a334a3);
	}
}

/* Post Content */
.elementor-widget-xpro-post-content {
	/* ── PARAGRAPH ── */
	p {
		margin-bottom: 1.5rem;
	}

	/* ── HEADINGS ── */
	h1 {
		margin-top: 3rem;
		margin-bottom: 1.25rem;
	}

	h2 {
		margin-top: 2.5rem;
		margin-bottom: 1rem;
	}

	h3 {
		margin-top: 2rem;
		margin-bottom: 0.75rem;
	}

	h4 {
		margin-top: 1.75rem;
		margin-bottom: 0.65rem;
	}

	h5 {
		margin-top: 1.5rem;
		margin-bottom: 0.5rem;
	}

	h6 {
		margin-top: 1.25rem;
		margin-bottom: 0.5rem;
	}

	/* ── FIGURE & IMAGE ── */
	figure {
		margin: 2rem 0;
	}

	figure img {
		width: 100%;
		height: auto;
		border-radius: 8px;
		display: block;
	}

	figcaption {
		margin-top: 0.5rem;
		font-size: 0.85rem;
		text-align: center;
		font-style: italic;
	}

	/* ── UNORDERED LIST ── */
	ul {
		margin-bottom: 1.5rem;
		padding-left: 1.5rem;
	}

	ul li {
		margin-bottom: 0.6rem;
	}

	/* ── NESTED LIST ── */
	ul li ul {
		margin-top: 0.5rem;
		margin-bottom: 0;
	}

	/* ── ORDERED LIST ── */
	ol {
		margin-bottom: 1.5rem;
		padding-left: 1.75rem;
	}

	ol li {
		margin-bottom: 0.6rem;
	}

	/* ── TABLE ── */
	table {
		width: 100%;
		margin: 2rem 0;
		border-collapse: collapse;
		border-radius: 8px;
		overflow: hidden;
		box-shadow: 0 1px 4px rgba(0, 0, 0, 0.08);
	}

	thead {
		background-color: var(--e-global-color-93e98b5);
		color: #ffffff;
	}

	th {
		padding: 12px 16px;
		font-weight: 600;
	}

	td {
		padding: 11px 16px;
	}

	table td,
	table th {
		border: 1px solid var(--e-global-color-17e0445);
	}

	table tbody > tr:nth-child(odd) > td,
	table tbody > tr:nth-child(odd) > th {
		background-color: #ffffff;
	}

	table tbody tr:hover > td,
	table tbody tr:hover > th {
		background-color: transparent;
	}

	/* ── BLOCKQUOTE ── */
	blockquote {
		margin: 2rem 0;
		padding: 1.25rem 1.75rem;
		border-left: 4px solid var(--e-global-color-accent);
		background-color: rgba(219, 181, 87, 0.1);
		border-radius: 0 8px 8px 0;
	}

	blockquote p {
		margin-bottom: 0.5rem;
		font-size: 1.1rem;
		font-style: italic;
		color: #333333;
	}

	cite {
		font-size: 0.875rem;
		color: #888888;
		font-style: normal;
	}

	/* ── DEFINITION LIST ── */
	dl {
		margin-bottom: 1.5rem;
	}

	dt {
		margin-top: 1.25rem;
		font-size: 1rem;
		color: var(--e-global-color-93e98b5);
	}

	dd {
		margin-top: 0.3rem;
		margin-left: 1.25rem;
		color: #555555;
		line-height: 1.7;
		font-size: 0.95rem;
	}

	/* ── HORIZONTAL RULE ── */
	hr {
		margin: 2.5rem 0;
		border: none;
		border-top: 1px solid var(--e-global-color-17e0445);
	}

	/* ── LINKS ── */
	a {
		color: var(--e-global-color-accent);
		text-decoration: none;
		border-bottom: 1px solid transparent;
		transition: border-color 0.2s ease;
	}

	a:hover {
		color: var(--e-global-color-accent);
		border-bottom-color: var(--e-global-color-accent);
	}

	/* ── STRONG & EM ── */
	strong {
		font-weight: 700;
		color: var(--e-global-color-93e98b5);
	}

	em {
		font-style: italic;
		color: #666666;
	}
}