/*
Theme Name: Hello Elementor Child
Template: hello-elementor
Version: 1.0.0
Text Domain: hello-elementor-child
*/


/* widget blog */
.blog .page-container, .single-post .page-container, .archive .page-container{
    display: flex; 
    gap: 30px; 
}

.blog .page-content, .single-post .page-content, .archive .page-content{
    flex: 3; 
}

.widget-area.sidebar {
    flex: 1; /* You can adjust this ratio */
}

.widget-area .widget {
    margin-bottom: 30px;
    padding: 15px;
}

.blog .page-content .post, .archive .page-content .post{
    margin-bottom: 20px;
    padding-bottom: 20px;
}

.blog #content, .single-post #content, .archive #content{
    max-width: 80%;
}

.sidebar .wp-block-latest-posts li {
    display: flex;
    flex-direction: row;
    align-items: center;
}

.sidebar ul {
    list-style: none;
    padding: 0;
}
.sidebar .sidebar-heading {
    font-family: "Clash Display";
    font-weight: 600;
    font-size: 3.2rem;
    line-height: 1;
}

.sidebar h2 {
    font-family: "Clash Display";
    font-weight: 600;
    line-height: 36px;
}
.sidebar img {
    border-radius: 5px;
}
/* all tags */
#block-15 ul.wp-block-categories-list.wp-block-categories {
    display: flex;
    gap: 15px;
}
#block-15 ul.wp-block-categories-list.wp-block-categories li>a {
    background: #f2f2f2;
    color: #002567;
    padding: 2px 5px;
    border-radius: 3px;
	font-size: 0.8rem;
}

#block-15 ul.wp-block-categories-list.wp-block-categories li>a:hover{
	background:#f0d801;
}

.blog .post-content, .archive .post-content{
    height: max-content;
    background: radial-gradient(ellipse 100% 55% at 50% 135%, #003686 0%, #003686 25%, #003686 55%, #000 100%);
    padding: 20px;
    border-radius: 0 0 20px 20px;
    margin-top: -10px;
	transition: 300ms;
}

.blog .post-content a:hover, .blog .page-content .post:hover .post-content a{
	color:#002567;
}



.blog .post-content .post-date, .single-post .post-date, .archive .post-content .post-date{
	font-weight:500;
}
.blog .post .wp-post-image, .archive .post .wp-post-image{
    border-radius: 20px 20px 0 0;
}

.blog .post:hover .entry-title>a, .archive .post:hover .entry-title>a{
	color:#002567;
}

.blog .post:hover .post-content, .archive .post:hover .post-content{
	background: radial-gradient(  ellipse 100% 55% at 50% 135%,  #F0FF52 0%,  #F0FF52 25%,  #F0FF52 55%,  #F0D801 100%);
	color: #002567;
}
.single-post .post .page-content img{
	border-radius:20px;
}
.breadcrumb {
    margin: 20px;
}
.tag-links a {
    background: #f2f2f2;
    color: #000;
    padding: 3px 7px;
    border-radius: 3px;
	font-size:0.8rem;
}
.tag-links a:hover{
	background:#f0d801;
}
.post-tags {
    margin-bottom: 70px;
}
.post p, .post li {
    font-size: 1.12rem;
    line-height: 1.7rem;
}
.sidebar a{
	font-size: 0.8rem;
    line-height: 1.3rem;
	text-decoration:underline;
}
.post span{
	font-size: 0.8rem;
    line-height: 1.3rem;
}

.sidebar a:hover {
    color: #F0D801;
}
.post h2{
	font-size:2.4rem;
	line-height: 3rem;
	
}
a.wp-block-latest-posts__post-title {
    font-size: 0.8rem;
    line-height: 1.3;
}

.wp-block-latest-posts__featured-image img{
	width:100%;
}
.cat-item {
    margin-bottom: 5px;
}
.cat-item a{
	font-size:0.8rem;
}
.sidebar .wp-block-latest-posts li>div {
    flex: 2;
}
.sidebar .wp-block-latest-posts li>a {
    flex: 5;
}
.post-content a{
	text-decoration:none;
}
.tag-links a {
    background: #f2f2f2;
    color: #000;
    padding: 3px 7px;
    border-radius: 3px;
	font-size:0.8rem;
	margin-left:5px;
}

/* hiding tags and categories in sidebar */
.sidebar #block-15, .sidebar #block-14, .blog-header-box{
	display:none;
}


@media (max-width: 1024px) {
	.sidebar #block-10{
		display:none;
	}
	.blog-header-box{
		display:block;
	}
	.blog-header-box h1{
		font-family: "Clash Display";
		font-weight: 600;
		font-size: 3.2rem;
		line-height: 1;
	}
    .blog .page-container, .single-post .page-container, .archive .page-container {
        flex-direction: column-reverse;
    }
	.blog .post-content, .archive .post-content {
		height: max-content;
	}
	.breadcrumb{
		text-align: center;
	}
	.blog #content, .single-post #content, .archive #content {
		max-width: 90%;
	}
	.widget-area .widget{
		padding: 5px;
	}
	a.wp-block-latest-posts__post-title, .blog-header-box p {
		font-size: 1rem;
	}
	.sidebar .wp-block-latest-posts li>div {
		flex: 1;
	}
}