/* Kad post gaya media sosial: avatar, menu, reaksi emoji, komen sebaris. Guna pembolehubah warna dari index.php (ada nilai ganti). */
.pcard{background:var(--card,#fff);border:1px solid var(--line,#f0dfd2);border-radius:14px;margin-bottom:14px;color:var(--ink,#1d2033)}
.ph{display:flex;align-items:center;gap:10px;padding:12px 14px 6px}
.pav{width:40px;height:40px;border-radius:50%;color:#fff;display:grid;place-items:center;font-weight:800;flex:none;text-decoration:none}
.pav.sm{width:32px;height:32px;font-size:.85rem}
.pwho{flex:1;min-width:0;display:flex;flex-direction:column;line-height:1.3}
.pnm{font-weight:700;color:var(--ink,#1d2033);overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.ptm{font-size:.78rem;color:var(--muted,#6b6f85)}.ptm a{color:inherit;font-weight:500}
.pm{position:relative}
.pm summary{list-style:none;cursor:pointer;width:32px;height:32px;border-radius:50%;display:grid;place-items:center;color:var(--muted,#6b6f85)}
.pm summary::-webkit-details-marker{display:none}.pm summary:hover{background:var(--bg,#fff5ee)}
.pmenu{position:absolute;right:0;top:34px;min-width:170px;background:#fff;border-radius:12px;box-shadow:0 10px 28px rgba(0,0,0,.18);padding:6px;z-index:20}
.pmenu form{margin:0}
.pmenu a,.pmenu button{display:block;width:100%;text-align:left;background:none;border:0;padding:8px 12px;border-radius:8px;font:inherit;font-weight:600;color:var(--ink,#1d2033);cursor:pointer;text-decoration:none}
.pmenu a:hover,.pmenu button:hover{background:var(--bg,#fff5ee)}.pmenu .dg{color:#c0392b}
.pb{padding:6px 14px 10px;line-height:1.55;overflow-wrap:anywhere;font-size:.95rem}
.pb a{word-break:break-all}
.pstat{display:flex;justify-content:space-between;align-items:center;padding:0 14px 8px;font-size:.82rem;color:var(--muted,#6b6f85)}
.pstat a{color:inherit;font-weight:600}
.pact{display:flex;border-top:1px solid var(--line,#f0dfd2);padding:2px 6px}
.pact>*{flex:1;min-width:0}
.pbtn,.rbtn{display:flex;align-items:center;justify-content:center;gap:7px;width:100%;padding:9px 6px;background:none;border:0;border-radius:8px;color:var(--muted,#6b6f85);font:inherit;font-weight:700;cursor:pointer;text-decoration:none}
.pbtn:hover,.rbtn:hover{background:var(--bg,#fff5ee);text-decoration:none}
.pbtn svg{width:18px;height:18px;fill:currentColor}
.re{font-size:1.1rem;line-height:1}
.rbtn:not(.on) .re,.pbtn .re{filter:grayscale(1);opacity:.65}
.rbtn.on{color:var(--rc,#4d54c6)}
.rwrap{position:relative;margin:0;display:block}
.rpop{display:none;position:absolute;left:0;bottom:calc(100% - 2px);background:#fff;border-radius:999px;box-shadow:0 6px 22px rgba(0,0,0,.2);padding:5px 8px;gap:2px;z-index:15;white-space:nowrap}
.rwrap:hover .rpop,.rwrap.open .rpop{display:flex}
.rpop button{background:none;border:0;cursor:pointer;font-size:1.65rem;line-height:1;padding:4px 5px;border-radius:50%;transition:transform .12s}
.rpop button:hover{transform:translateY(-6px) scale(1.25)}
.cmt{display:flex;gap:8px;padding:4px 14px}
.cb{background:var(--bg,#f4f4f6);border-radius:14px;padding:6px 12px;font-size:.88rem;min-width:0;overflow-wrap:anywhere}
.cn{font-weight:700;color:var(--ink,#1d2033);margin-right:6px}
.ct{font-size:.72rem;color:var(--muted,#6b6f85)}
.cmore{display:block;padding:2px 14px 6px;font-size:.82rem;color:var(--muted,#6b6f85)}
.ccbox{display:flex;align-items:center;gap:8px;padding:8px 14px 12px;margin:0}
.ccbox input{flex:1;min-width:0;height:36px;border:0;border-radius:999px;background:var(--bg,#f0f2f5);padding:0 14px;font:inherit;color:var(--ink,#1d2033)}
.ccbox input:focus{outline:2px solid var(--brand,#4d54c6)}
.sr{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);border:0;padding:0}
.ptoast{position:fixed;left:50%;bottom:28px;transform:translateX(-50%);background:#1d2033;color:#fff;padding:9px 18px;border-radius:999px;font-weight:600;z-index:99}
@media (prefers-reduced-motion:reduce){.rpop button{transition:none}}
/* butang Log Out (borang POST) dalam menu akaun index.php */
.drop form button.dl{display:block;width:100%;text-align:left;background:none;border:0;padding:9px 12px;border-radius:8px;font-weight:600;color:var(--ink,#1d2033);cursor:pointer}
.drop form button.dl:hover{background:var(--bg,#fff5ee)}

/* avatar bergambar: huruf di bawah, gambar menutupnya (jika gambar gagal dimuat, huruf kelihatan) */
.pav,.av{position:relative;overflow:hidden}
.pav img,.av img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover}
/* gambar dalam post */
.pmed{display:grid;gap:2px;margin:0 0 8px}
.pmed a{display:block;overflow:hidden;background:#eee}
.pmed img{display:block;width:100%}
.pmed.m1{grid-template-columns:1fr}.pmed.m1 img{height:auto;max-height:560px;object-fit:cover}
.pmed.m2,.pmed.m3,.pmed.m4{grid-template-columns:1fr 1fr}
.pmed.m2 a,.pmed.m3 a,.pmed.m4 a{aspect-ratio:1/1}
.pmed.m2 img,.pmed.m3 img,.pmed.m4 img{height:100%;object-fit:cover}
.pmed.m3 a:first-child{grid-column:1/-1;aspect-ratio:16/9}