/*
 Theme Name:     Ele Child
 Theme URI:      https://www.elementor.com
 Description:    Elementor Pro Child Theme +RTL Support
 Author:         Ali Farahani
 Author URI:     https://www.alifarahani.me
 Template:       hello-elementor
 Version:        1.0.0
*/
 
/* =Theme customization starts here
------------------------------------------------------- */
/* CTA Styles || */
.animated-cta a {
	position: relative;
	display: inline-block;
	background: transparent;
	cursor: pointer;
	overflow: hidden;
	transition: color 0.3s ease;
	z-index: 1;
}

.animated-cta a::before {
	content: '';
	position: absolute;
	top: 0;
	right: 0;
	width: 100%;
	height: 100%;
	background: var(--e-global-color-primary);
	transform: scaleX(0);
	transform-origin: right;
	transition: transform 0.4s ease;
	z-index: -1;
}
.animated-cta.overimg a::before {
	background: var(--e-global-color-8f1a713) !important;
}
.animated-cta.goldencta a::before {
	background: var(--e-global-color-6126f87) !important;
}
.animated-cta a.hovered::before {
	transform: scaleX(1);
	transform-origin: right;
}

.animated-cta a.leaving::before {
	transform: scaleX(0);
	transform-origin: left;
}
/* Jet Animated Text Styles || */
h1.jet-animated-text, h2.jet-animated-text {
	word-spacing: 4px;
	line-height: 3rem !important;
}
/* Karen Post Styles || */
.karen-posts .elementor-post__card {
	height: 512px;
}
.karen-posts .elementor-post__thumbnail__link {
	height: 100%;
	margin-bottom: 0;
}
.karen-posts .elementor-post__thumbnail {
	height: 100%;
}
.karen-posts img {
	height: 100%;
	object-fit: cover;
}
.karen-posts .elementor-post__text {
	position: absolute;
	bottom: 16px;
}
.karen-posts .elementor-post__thumbnail__link:after{
	background-image: linear-gradient(0deg, var(--e-global-color-text), transparent 100%) !important;
}
.karen-posts .elementor-post__card:hover .elementor-post__thumbnail__link:after {
	opacity: 0.8 !important;
}
.main-content p {
	margin-block-end: 1.8rem;
}
.main-content ul li, .main-content ol li {
	margin-block-end: 16px;
}
.main-content :is(h1, h2, h3, h4, h5, h6) {
	margin-block-start: 2rem;
}
.main-content ul li::marker {
	font-size: 0px;
}
#rank-math-faq.rank-math-block {
	background-color: var(--e-global-color-2036ffc);
	padding: 8px;
}
.rank-math-question {
	font-size: 1.2rem !important;
}
#car-brand-content figure.wp-block-image.size-full {
	text-align: center;
}
figcaption {
	text-align: center;
}
/* Anchor Styles || */
.golden-link a:hover {
	color: var(--e-global-color-accent) !important;
}
.golden-link a {
	color: var(--e-global-color-text);
}
.regular-link a:hover {
	color: var(--e-global-color-6126f87) !important;
}
.regular-link a {
	color: var(--e-global-color-accent);
}
/* Emoji Bugs || */
img.emoji {width: 3%; vertical-align: middle;} 
/* Content Styles || */
.content-block {
	line-height: 2rem !important;
}
/* More Content Styles || */
.more-content {
    max-height: 256px; 
    overflow: hidden;
    transition: max-height 0.5s ease;
}
.more-content.expanded {
    max-height: fit-content;
}
.show-more-button a {
    text-align: center;
    cursor: pointer;
    font-weight: bold;
}
.show-more-button.hidden {
    display: none;
}
/* Auto Card Styles || */
.auto-card:hover .elementor-widget-text-editor, .auto-card:hover .elementor-widget-icon-list .elementor-icon-list-text, .auto-card:hover h3 {
	color: var(--e-global-color-8f1a713) !important;
}
.auto-card:hover .elementor-widget-icon-list svg {
	fill: var(--e-global-color-8f1a713) !important;
}
/* Service Styles || */
.service-hero-title p {
	width: 80%;
}
/* Mega Menu Styles || */
#main-menu .e-n-menu-item {
	position: relative;
}
#main-menu  .e-n-menu-item::before {
	content: "";
	position: absolute;
	top: 0;
	right: 0;
	width: 0;
	height: 100%;
	background-color: var(--e-global-color-6126f87);
	transition: width 0.3s ease-in-out;
}

#main-menu .e-n-menu-item:hover::before {
	width: 100%;
}
#main-menu .e-n-menu-item:hover .e-n-menu-title-container > span {
	color: var(--e-global-color-8f1a713);
}
#main-menu .e-n-menu-item:hover path {
	fill: var(--e-global-color-8f1a713);
}
/* Mobile Menu Styles || */
#mobile-menu a.has-submenu.highlighted path {
	fill: var(--e-global-color-accent);
}
#mobile-menu a.elementor-item-anchor.highlighted {
	color: var(--e-global-color-accent);
}
/* Blog Post Pagination Styles || */
.elementor-widget-posts .elementor-pagination .page-numbers {
	background-color: var(--e-global-color-secondary);
	padding: 8px 16px;
}
/* Fix Comment Styles || */
#comments .title-comments, #reply-title {font-size: var(--e-global-typography-524aabd-font-size); color: var( --e-global-color-primary );}
#cancel-comment-reply-link {border: 2px solid var(--e-global-color-primary); margin-right: 16px; padding: 8px; color: var(--e-global-color-primary);}
#cancel-comment-reply-link:hover {background-color: var(--e-global-color-primary); color: var(--e-global-color-8f1a713);}
#comments #submit {border-color: var(--e-global-color-primary); background-color: var(--e-global-color-8f1a713); color: var(--e-global-color-primary);}
#comments #submit:hover {background-color: var(--e-global-color-primary); color: var(--e-global-color-8f1a713);}
.comments-area p, .comments-area label {color: var(--e-global-color-primary);}
.comments-area label .required {color: red;}
.comments-area input, .comments-area textarea {border: solid 2px var(--e-global-color-primary);}
.comments-area input:focus, .comments-area textarea:focus {border-color: var(--e-global-color-6126f87);}
/* Tablet Device Styles ||| */
@media (min-width: 768px) and (max-width: 1024px) {
	/* ImageBox Image Position Top Bug Fixing */
	.imgbox-top-img .elementor-image-box-wrapper {
		flex-direction: column !important;
	}
	.routing ul.elementor-icon-list-items {
		row-gap: 16px;
	}
}
/* Tablet & Mobile Font Size || */
@media (max-width: 1024px) {
	h1 {font-size: 1.8rem !important; line-height: 2.5rem !important;}
	h2 {font-size: 1.6rem !important; line-height: 2.5rem !important;}
	h3 {font-size: 1.4rem !important; line-height: 2.5rem !important;}
	h4 {font-size: 1.2rem !important; line-height: 2.5rem !important;}
	h5 {font-size: 1rem !important; line-height: 2.5rem !important;}
	h6 {font-size: 0.875rem !important; line-height: 2.5rem !important;}
	p {font-size: 0.875rem !important;}
}
/* Mobile Device Styles ||| */
@media (max-width: 767px) {
	/* Veteran Banner Styles || */
	.veteran-banner.elementor-widget-jet-banner {
		height: 420px;
	}
	.veteran-banner .elementor-widget-container, .veteran-banner .jet-elements, .veteran-banner figure.jet-banner {
		height: 100% !important;
	}
	.veteran-banner img {
		height: 100% !important;
		object-fit: cover !important;
	}
	.jet-banner__text {
		font-style: normal !important;
	}
	/* Light Text Mobile Services || */
	.light-color-mob {
		color: var(--e-global-color-8f1a713) !important;
	}
}

/* Main Container Style */
.my-read-box {
    background-color: var(--e-global-color-2036ffc);     /* Light gray background */
    border-right: 4px solid var(--e-global-color-primary); /* Red accent line on the right (RTL support) */
    padding: 16px 24px;
    margin: 30px 0;                /* Vertical spacing */
    border-radius: 4px 0 0 4px;    /* Rounded corners on the left side */
    box-shadow: 0 2px 5px rgba(0,0,0,0.05); /* Soft shadow */
    font-family: inherit;          /* Inherit font from the theme */
    display: flex;
    flex-direction: column;        /* Column layout for mobile first */
    gap: 5px;
}

/* Label Style (e.g., Read Also) */
.my-read-label {
    font-size: 12px;
    font-weight: bold;
    color: var(--e-global-color-primary);
    margin-bottom: 5px;
}

/* Link Style */
.my-read-link {
    font-size: 16px;
    font-weight: 700;
    color: #333;
    text-decoration: none;
    transition: color 0.3s ease;
}

.my-read-link:hover {
    color: #ff0000; /* Hover color matching the border */
}

/* Responsive Styles for Desktop */
@media (min-width: 768px) {
    .my-read-box {
        flex-direction: row; /* Row layout for larger screens */
        align-items: center;
        gap: 10px;
    }
    
    .my-read-label {
        margin-bottom: 0;
        white-space: nowrap; /* Prevent label from wrapping */
    }
    
    .my-read-label::after {
        content: "|";        /* Separator between label and link */
        margin-right: 10px;
        color: var(--e-global-color-text);
    }
}