/* PC: góc dưới trái. Điện thoại: sát mép trên, theo khung nhìn khi cuộn. */
.popup-minh-hoa{position:fixed;top:auto;right:auto;left:max(16px,env(safe-area-inset-left,0px));bottom:calc(20px + env(safe-area-inset-bottom,0px));z-index:100;display:flex;align-items:center;gap:10px;box-sizing:border-box;width:360px;max-width:calc(100vw - 32px);margin:0;padding:12px 8px 12px 12px;border:1px solid #e5e7eb;border-radius:18px;background:#fff;color:#42444a;box-shadow:0 8px 28px #18213224;font-family:Arial,"Segoe UI",sans-serif;animation:popup-minh-hoa-vao .2s ease-out}
.popup-minh-hoa[hidden]{display:none!important}
.popup-minh-hoa-avatar{display:grid;place-items:center;flex:none;width:40px;height:40px;border-radius:50%;background:#e9f8ef;color:#16834f;font-size:15px;font-weight:700;border:1px solid #d3eedf}
.popup-minh-hoa-noi-dung{min-width:0;flex:1;line-height:1.45}
.popup-minh-hoa-dau{display:flex;align-items:center;gap:7px;min-width:0;margin-bottom:3px}
.popup-minh-hoa-ten{min-width:0;font-size:13px;font-weight:700;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.popup-minh-hoa-avatar svg{width:23px;height:23px}
.popup-minh-hoa p{display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;margin:0;overflow:hidden;overflow-wrap:anywhere;font-size:12px;line-height:1.5;max-height:3em}
.popup-mua-hang-thoi-gian{display:block;margin-top:5px;color:#6b7280;font-size:10px;line-height:1.4;text-decoration:none}

.popup-minh-hoa-dong{display:grid;place-items:center;flex:none;width:44px;height:44px;padding:0;border:0;border-radius:50%;background:transparent;color:#717680;font-size:23px;line-height:1}
.popup-minh-hoa-dong:hover{background:#f1f2f5;color:#333}.popup-minh-hoa-dong:focus-visible{outline:2px solid #527be2;outline-offset:0}
@keyframes popup-minh-hoa-vao{from{opacity:0;transform:translateY(10px)}to{opacity:1;transform:translateY(0)}}
@keyframes popup-minh-hoa-tu-tren{from{opacity:0;transform:translateY(-8px)}to{opacity:1;transform:translateY(0)}}
/* Giữ ở trên cả khi xoay ngang điện thoại có bề rộng lớn hơn 760px. */
@media(max-width:760px),(hover:none) and (pointer:coarse){.popup-minh-hoa{top:calc(12px + env(safe-area-inset-top,0px));bottom:auto;left:max(12px,env(safe-area-inset-left,0px));right:max(12px,env(safe-area-inset-right,0px));width:auto;max-width:420px;margin-inline:auto;animation-name:popup-minh-hoa-tu-tren}}
@media(max-width:380px){.popup-minh-hoa{left:max(10px,env(safe-area-inset-left,0px));right:max(10px,env(safe-area-inset-right,0px));gap:8px;padding-left:8px}.popup-minh-hoa-avatar{width:34px;height:34px}.popup-minh-hoa p{font-size:11px}}
@media(prefers-reduced-motion:reduce){.popup-minh-hoa{animation:none}}