@font-face {
  font-family: 'SolaimanLipi', sans-serif;
  font-family: 'SolaimanLipi';
  src: local('SolaimanLipi');
  font-display: swap;
}
:root{
  --bg:#353c47;
  --card:#353c47;
  --soft:#1f2937;
  --muted:#94a3b8;
  --text:#e5e7eb;
  --accent:#22c55e;
  --accent-2:#38bdf8;
  --danger:#ef4444;
  --shadow: 0 10px 30px rgba(0,0,0,.35);
  --radius: 18px;
}
.grid{display:grid;grid-template-columns:1fr 320px;gap:16px}
@media (max-width:900px){.grid{grid-template-columns:1fr}}

.card{background:#1f4f80;border:1px solid #1f2937;border-radius:var(--radius);box-shadow:var(--shadow)}
.post{padding:16px}
.post-header{display:flex;gap:12px;align-items:center;margin-bottom:10px}
.avatar{width:42px;height:42px;border-radius:50%;background:#0ea5e9;display:grid;place-items:center;font-weight:700;color:#041014}
.who{display:flex;flex-direction:column}
.who .name{font-weight:700}
.who .meta{font-size:12px;color:var(--muted)}
.post .content{line-height:1.7;margin:8px 0 12px}
.post .media{overflow:hidden;border-radius:12px;border:1px solid #1f2937}
.post .media img{width:100%;display:block}

.actions{display:flex;gap:10px;margin-top:12px}
.btn{
  appearance:none;border:1px solid #243041;background:#0b1224;color:var(--text);
  padding:10px 14px;border-radius:12px;cursor:pointer;transition:transform .05s ease;display:flex;align-items:center;gap:8px
}
.btn:hover {
  background: #0f162a;
  color: #2d81d7;
}
.btn:active{transform:translateY(1px)}
.btn.like.active{border-color:var(--accent);box-shadow:0 0 0 2px rgba(34,197,94,.25) inset;color:var(--accent)}

.comments{margin-top:14px;border-top:2px dashed #243041;padding-top:12px}
.comment {
  display: flex;
  gap: 10px;
  margin-top: 10px;
  width: 100%;
}
.comment .cbody {
  background: var(--soft);
  padding: 10px 10px 5px 10px;
  border-radius: 12px;
  width: calc(100% - 42px);
  border-bottom: 0px solid #ffffff45;
}
.replypart .reply .cbody {
  background: var(--soft);
  padding: 10px 10px 5px 10px;
  border-radius: 0;
  width: 100%;
}
.replypart .reply:last-child .cbody {
  border-radius: 0px 0px 10px 10px;
}
.reply {
  display: flex;
  gap: 10px;
  width: 100%;
  border-bottom: 1px solid #0ea5e93b;
}
.reply:last-child {
  border-bottom: 0px solid #0ea5e93b;
}
.reply_header {
  display: flex;
  align-items: center;
  margin-bottom: 5px;
  gap: 5px;
}
.reply_header .avatar {
  width: 20px;
  height: 20px;
  border-radius: 50%;
  background: #0ea5e9;
  display: grid;
  place-items: center;
  font-weight: 700;
  color: #041014;
}
.reply_header .cmeta {
  font-size: 12px;
  color: var(--muted);
  margin-bottom: 0px;
}
.reply-form {
  display: flex;
  flex-direction: column;
  gap: 3px;
  margin-bottom: 3px;
}
.comment .like.active {
  color: #22c55e !important;
  font-weight: bold;
}
.cmeta{font-size:12px;color:var(--muted);margin-bottom:6px}
.comment-form{display:flex;flex-direction:column;gap:10px;margin-top:12px}
.row{display:flex;gap:10px}
.input,.textarea{width:100%;background:#0b1224;border:1px solid #243041;color:var(--text);border-radius:12px;padding:10px 12px;outline:none}
.textarea{min-height:72px;resize:vertical}

.sidebar{display:flex;flex-direction:column;gap:16px}
.widget{padding:14px}
.muted{color:var(--muted);font-size:14px}

section {
  display: unset;
}
.pagination_btn {
  padding: 5px 10px;
  border: 1px solid #000 !important;
}
.post_loadmorebtn{
  display: block;
  text-align: center;
  width: 40%;
  margin: 20px auto;
  padding: 10px 10px;
  background: #1f2937;
  border: 1px solid #353c47;
  border-radius: 5px;
}
.post_loadbomorebtn{
  display: block;
  text-align: center;
  width: 40%;
  margin: 20px auto;
  padding: 10px 10px;
  background: #1f2937;
  border: 1px solid #353c47;
  border-radius: 5px;
}
.post_loadmorebtn:hover {
  background: #253346;
  border: 1px solid #353c47;
  font-size: 15px;
}