/* Giá Heo — Frontend (tone hồng-đỏ) */
.gheo-widget {
    border: 1px solid #f3d4d4;
    border-radius: 8px;
    padding: 16px;
    margin: 16px 0;
    background: #fff;
    font-family: inherit;
    color: #222;
}
.gheo-widget .gheo-head {
    display: flex; align-items: baseline; justify-content: space-between;
    flex-wrap: wrap; gap: 8px;
    border-bottom: 1px solid #fce4e4; padding-bottom: 10px; margin-bottom: 12px;
}
.gheo-widget .gheo-title {
    margin: 0; font-size: 1.1em; font-weight: 700; color: #B22222;
}
.gheo-widget .gheo-date {
    font-size: .85em; color: #777;
}
.gheo-widget table {
    width: 100%; border-collapse: collapse;
}
.gheo-widget table th, .gheo-widget table td {
    padding: 8px 10px; text-align: left; border-bottom: 1px solid #f6f0f0; font-size: .95em;
}
.gheo-widget table th {
    background: #fdf3f3; font-weight: 600; color: #444;
}
.gheo-widget table td.gheo-price {
    font-weight: 700; color: #B22222; font-variant-numeric: tabular-nums; white-space: nowrap;
}
.gheo-widget .gheo-change.gheo-up   { color: #2E7D32; font-weight: 600; }
.gheo-widget .gheo-change.gheo-down { color: #c62828; font-weight: 600; }
.gheo-widget .gheo-change.gheo-zero { color: #999; }
.gheo-widget .gheo-foot {
    margin-top: 12px; padding-top: 10px; border-top: 1px solid #fce4e4;
    font-size: .8em; color: #888;
}
.gheo-widget .gheo-foot .gheo-src { color: #B22222; font-weight: 600; }

/* Card */
.gheo-widget.gheo-card .gheo-list { list-style: none; margin: 0; padding: 0; }
.gheo-widget.gheo-card .gheo-list li {
    display: flex; align-items: center; gap: 12px;
    padding: 8px 0; border-bottom: 1px solid #fce4e4;
}
.gheo-widget.gheo-card .gheo-region { flex: 1; }
.gheo-widget.gheo-card .gheo-price {
    font-weight: 700; color: #B22222; font-variant-numeric: tabular-nums;
}

/* Inline */
.gheo-inline { display: inline; }
.gheo-inline strong { color: #B22222; }

.gheo-error {
    padding: 10px; background: #fff3e0; color: #e65100; border-radius: 4px; font-size: .9em;
}

@media (max-width: 480px) {
    .gheo-widget table th, .gheo-widget table td { padding: 6px 4px; font-size: .85em; }
}
/* Embed button + modal — Giá Heo */
.gheo-embed-btn{
  background:#fdf2f2;border:1px solid #f5c2c2;color:#B22222;
  padding:3px 9px;border-radius:12px;font-size:.78em;cursor:pointer;
  font-family:inherit;line-height:1.4;white-space:nowrap;opacity:.85;
  transition:opacity .15s,background .15s;margin-left:8px;
}
.gheo-embed-btn:hover{opacity:1;background:#fbe1e1}
.gheo-foot{display:flex;align-items:center;gap:8px;flex-wrap:wrap}

.gheo-embed-modal-bg{
  position:fixed;inset:0;background:rgba(0,0,0,.55);z-index:99998;
  display:flex;align-items:center;justify-content:center;padding:16px;
  animation:gheofade .15s ease-out;
}
@keyframes gheofade{from{opacity:0}to{opacity:1}}
.gheo-embed-modal{
  background:#fff;border-radius:10px;padding:20px;max-width:560px;width:100%;
  max-height:90vh;overflow:auto;box-shadow:0 10px 40px rgba(0,0,0,.25);
  font-family:-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,sans-serif;color:#222;
}
.gheo-embed-modal h3{margin:0 0 4px;font-size:1.1em;color:#B22222}
.gheo-embed-modal p{margin:0 0 12px;font-size:.88em;color:#666;line-height:1.5}
.gheo-embed-modal code{background:#f3f3f3;padding:1px 5px;border-radius:3px;font-size:.9em}
.gheo-embed-modal textarea{
  width:100%;height:120px;padding:10px;border:1px solid #d0d0d0;border-radius:6px;
  font-family:Menlo,Consolas,monospace;font-size:12px;background:#f9f9f9;color:#222;
  resize:vertical;line-height:1.5;box-sizing:border-box;
}
.gheo-embed-modal-actions{
  margin-top:12px;display:flex;justify-content:space-between;align-items:center;gap:8px;flex-wrap:wrap;
}
.gheo-embed-modal-btn{
  background:#B22222;color:#fff;border:0;padding:8px 16px;border-radius:6px;
  font-size:.9em;cursor:pointer;font-family:inherit;
}
.gheo-embed-modal-btn:hover{filter:brightness(.9)}
.gheo-embed-modal-btn.sec{background:#eee;color:#333}
.gheo-embed-modal-btn.sec:hover{background:#ddd}
.gheo-embed-modal-link{color:#1976d2;text-decoration:none;font-size:.82em}
.gheo-embed-modal-link:hover{text-decoration:underline}
