/* ===== BASIC ===== */

body{
margin:0;
font-family:Be Vietnam Pro,sans-serif;
background:#f4f6f8;
color:#222;
}

/* ===== HEADER ===== */

header{
background:#fff;
padding:15px;
box-shadow:0 2px 10px rgba(0,0,0,0.1);
}

.header-inner{
max-width:1200px;
margin:auto;
text-align:center;
}

/* CENTER LOGO */

.logo img{
height:45px;
display:block;
margin:auto;
}


/* ===== LAYOUT ===== */

.container{
max-width:1200px;
margin:25px auto;
padding:0 15px;
display:flex;
gap:25px;
}


/* ===== MAIN CONTENT ===== */

.main-content{
flex:3;
background:#fff;
padding:25px;
border-radius:10px;
}

.main-content h1{
text-align:center;
margin-bottom:10px;
}

.main-content h2{
margin-top:30px;
color:hotpink;
}

.main-content p{
font-size:16px;
line-height:1.8;
margin-bottom:25px;
}


/* ===== SHAYARI BOX ===== */

.shayari-box{
border:2px dashed hotpink;
background:#f2fffd;
padding:20px;
border-radius:10px;
text-align:center;
margin-bottom:25px;
}

.shayari-text{
font-size:18px;
line-height:1.7;
}


/* ===== SHARE BUTTONS ===== */

.share{
margin-top:15px;
}

.share span{
font-weight:bold;
margin-right:10px;
color: #666;
}

.share button{
border:none;
padding:8px 14px;
margin:4px;
border-radius:5px;
color:#fff;
cursor:pointer;
font-size:14px;
}

.fb{background:#1877f2;}
.wp{background:#25d366;}
.x{background:#000;}
.copy{background:#00b894;}


/* ===== SIDEBAR ===== */

.sidebar{
flex:1;
}

.sidebar-box{
background:#fff;
padding:20px;
border-radius:10px;
}

.sidebar-box h3{
text-align:center;
margin-bottom:15px;
}


/* ===== RECENT POSTS ===== */

.post{
display:flex;
gap:10px;
margin-bottom:15px;
}

.post img{
width:70px;
height:50px;
border-radius:5px;
object-fit:cover;
}

.post a{
text-decoration:none;
font-size:14px;
color:#222;
}

.post span{
font-size:12px;
color:#777;
}


/* ===== FOOTER ===== */

footer{
background:#111;
color:#bbb;
padding:20px;
margin-top:40px;
}

.footer-inner{
max-width:1200px;
margin:auto;
text-align:center;
font-size:14px;
}


/* ===== RESPONSIVE ===== */

@media(max-width:900px){

.container{
flex-direction:column;
}

.sidebar{
display:none;
}

}


/* ===== MOBILE ===== */

@media(max-width:768px){

body{
background:#fff;
}

.container{
margin:0;
padding:12px;
}

.main-content{
padding:10px;
border-radius:0;
}

.main-content h1{
font-size:20px;
margin:15px 0;
}

.main-content p{
font-size:15px;
line-height:1.7;
}

.main-content h2{
font-size:18px;
text-align:center;
}

.main-content h3{
font-size:15px;
text-align:center;
}

/* SHAYARI */

.shayari-box{
padding:15px 10px;
margin-bottom:20px;
border-radius:8px;
}

.shayari-text{
font-size:16px;
line-height:1.6;
}


/* SHARE BUTTONS */

.share{
display:flex;
flex-wrap:wrap;
justify-content:center;
gap:8px;
margin-top:12px;
}

.share span{
width:100%;
text-align:center;
font-size:13px;
}

.share button{
flex:1;
min-width:65px;
padding:8px 0;
font-size:13px;
border-radius:6px;
}

footer{
font-size:13px;
padding:15px 10px;
}

}