/* danhba.css — MN_DANHBA_CSS_v1
   CSS dung chung cho module danh ba (card, luoi, breadcrumb, chip tag).
   Nap 1 lan o base.php -> moi trang (home/list/tag/hashtag/show) deu co. */

/* ---------- luoi card ---------- */
.mh-grid,.firm-grid,.hlv-list-wrap{display:grid;grid-template-columns:repeat(auto-fill,minmax(310px,1fr));gap:12px}
@media(max-width:700px){.mh-grid,.firm-grid,.hlv-list-wrap{grid-template-columns:1fr}}

/* ---------- card truong ---------- */
.mc{display:flex;background:#fff;border:1px solid #e6efe9;border-radius:14px;overflow:hidden;transition:.16s;min-height:118px}
.mc:hover{border-color:#4caf7d;box-shadow:0 4px 16px rgba(47,125,84,.12)}
.mc-pic{position:relative;width:132px;min-width:132px;max-width:132px;flex:0 0 132px;display:block;overflow:hidden;background:#eef5f0;text-decoration:none}
.mc-pic img{width:132px;height:100%;min-height:118px;object-fit:cover;display:block}
.mc-ini{position:absolute;inset:0;display:flex;align-items:center;justify-content:center;color:#fff;font-weight:800;font-size:44px;text-shadow:0 2px 8px rgba(0,0,0,.25)}
.mc-fl{position:absolute;top:7px;left:7px;font-size:9.5px;font-weight:800;text-transform:uppercase;letter-spacing:.03em;background:#f59e0b;color:#fff;padding:3px 8px;border-radius:999px}
.mc-lg{display:none}
.mc-b{flex:1;min-width:0;padding:12px 14px;display:flex;flex-direction:column;justify-content:center}
.mc-b h3{display:block;font-size:15px;font-weight:700;line-height:1.4;margin:0 0 4px}
.mc-b h3 a{display:inline;color:#12351f;text-decoration:none}
.mc-b h3 a:hover{color:#2f7d54}
.mc-b h3 .nm{display:inline}
.mc-tk{display:inline-block;vertical-align:-2px;margin-left:3px}
.mc-ad{font-size:12px;color:#7b9086;margin-bottom:7px;line-height:1.45;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}
.mc-m{display:flex;flex-wrap:wrap;gap:5px}
.mc-m span{font-size:10.5px;font-weight:600;padding:3px 8px;border-radius:999px}
.mc-m .c{background:#eef5f0;color:#3c5c4a}
.mc-m .f{background:#e8f5ec;color:#276847}
.mc-m .r{background:#fff7e6;color:#a16207}
.mc-m .hot{background:#fff3e0;color:#c2410c;font-weight:700}

/* ---------- breadcrumb ---------- */
.v3-bc{max-width:1080px;margin:0 auto;padding:12px 18px 0;font-size:12.5px;color:#7b9086;display:flex;gap:6px;flex-wrap:wrap;align-items:center}
.v3-bc a{color:#2f7d54;text-decoration:none}
.v3-bc a:hover{text-decoration:underline}
.v3-bc b{color:#12351f;font-weight:600}

/* ---------- chip tag ---------- */
.v3-tags{display:flex;flex-wrap:wrap;gap:7px}
.v3-tags a{display:inline-flex;align-items:center;gap:5px;padding:7px 13px;background:#f5faf7;border:1px solid #cfe6d8;border-radius:999px;color:#276847;text-decoration:none;font-size:12.5px;font-weight:600}
.v3-tags a:hover{background:#2f7d54;color:#fff;border-color:#2f7d54}
.v3-tags a i{font-style:normal;font-size:10.5px;opacity:.55}

/* ---------- tieu de khoi ---------- */
.mh-sec{margin-bottom:24px}
.mh-h{display:flex;align-items:baseline;justify-content:space-between;gap:12px;margin-bottom:13px}
.mh-h h2{font-size:16.5px;font-weight:800;color:#1f5c3d;margin:0;padding-left:11px;border-left:4px solid #4caf7d}
.mh-h a{font-size:13px;color:#2f7d54;text-decoration:none;font-weight:600;white-space:nowrap}

/* ---------- trang hashtag ---------- */
.ht-wrap{max-width:1080px;margin:0 auto;padding:14px 18px 40px}
.ht-head{margin-bottom:16px}
.ht-head h1{font-size:22px;font-weight:800;color:#12351f;margin:0 0 5px;line-height:1.3}
.ht-head p{font-size:13.5px;color:#5b7266;margin:0}
.ht-head p b{color:#1f5c3d}
.ht-empty{font-size:14px;color:#7b9086}
.ht-pg{display:flex;gap:6px;justify-content:center;margin:22px 0;flex-wrap:wrap}
.ht-pg a{padding:7px 13px;border-radius:9px;background:#f5faf7;color:#276847;text-decoration:none;font-weight:700;font-size:13.5px;border:1px solid #e6efe9}
.ht-pg a.on{background:#2f7d54;color:#fff;border-color:#2f7d54}
.ht-rel{margin-bottom:24px;margin-top:26px}
.ht-rel h2{font-size:16.5px;font-weight:800;color:#1f5c3d;margin:0 0 11px;padding-left:10px;border-left:4px solid #4caf7d}
.ht-rel h2 span{font-size:12px;color:#8aa295;font-weight:600}

/* ---------- input khong lam iOS zoom ---------- */
input,select,textarea,button{font-size:16px}

/* MN_FOOTER4_v1 — footer 4 cot (goc chi dinh nghia 3) */
@media (min-width: 768px) {
  .footer-grid { grid-template-columns: 2fr 1fr 1fr 1fr; }
}
@media (min-width: 480px) and (max-width: 767px) {
  .footer-grid { grid-template-columns: 1fr 1fr; }
}