/* Trang Dự đoán / Lịch sử — sao theo bản gốc vangnhatha.com (gp-* + bổ sung container/bảng) */

/* Container kiểu goldbox */
.gp-wrap {
	border: 1px solid #ddd;
	border-radius: 8px;
	overflow: hidden;
	margin-bottom: 2em;
	box-shadow: 0 4px 12px rgba(0, 0, 0, 0.05);
	background: #fff;
	color: #222;
	font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif;
}
.gp-head {
	display: flex; align-items: center; gap: 8px;
	padding: 14px 18px; background: #f9f9f9; border-bottom: 1px solid #e0e0e0;
}
.gp-title { font-size: 1.2rem; font-weight: 700; color: #b07d0a; margin: 0; }

/* Hàng chọn sản phẩm */
.gp-prod-row {
	display: flex; align-items: center; gap: 10px;
	padding: 12px 16px; background: #FBF6E7; border-bottom: 1px solid #f0e9d2;
	font-size: 0.9rem;
}
.gp-prod-row label { font-weight: 600; color: #555; }
.gp-prod-row select {
	padding: 6px 10px; border: 1px solid #cbb; border-radius: 6px;
	background: #fff; font-size: 0.9rem; min-width: 220px;
}

/* Chart */
.gp-chart-wrap {
	padding: 14px 14px 6px;
	background: linear-gradient(135deg, #FDF2F8 0%, #F3E8FF 100%);
	border-bottom: 1px solid #F3E8FF; position: relative; height: 320px;
}

/* Bảng (header cam) */
.gp-tbl { width: 100%; border-collapse: collapse; }
.gp-tbl thead th {
	background: linear-gradient(90deg, #e2b53c, #c79417); color: #fff; padding: 12px 14px;
	font-weight: 700; text-transform: uppercase; font-size: 0.8rem; letter-spacing: 0.4px;
	text-align: right;
}
.gp-tbl thead th:first-child { text-align: left; }
.gp-tbl tbody td { padding: 12px 14px; border-bottom: 1px solid #f0f0f0; text-align: right; font-variant-numeric: tabular-nums; }
.gp-tbl tbody td:first-child { text-align: left; font-weight: 700; color: #333; }
.gp-tbl tbody tr:nth-child(even) { background: #FFFBF5; }
.gp-tbl .buy { color: #C0392B; font-weight: 700; }
.gp-tbl .sell { color: #c0921a; font-weight: 700; }
.gp-trend-up { color: #4CAF50; font-weight: 700; }
.gp-trend-down { color: #D32F2F; font-weight: 700; }
.gp-trend-stable { color: #FF9800; font-weight: 700; }

/* ===== Báo cáo tin tức (gp-* sao y bản gốc) ===== */
.gp-news-card { padding: 14px; background: #FFF8E1; border-top: 1px solid #FFE082; }
.gp-news-head { display: flex; align-items: center; gap: 8px; margin-bottom: 12px; }
.gp-news-head strong { font-size: 15px; color: #333; flex: 1; }
.gp-news-badge { font-size: 11px; color: #888; background: #fff; padding: 3px 8px; border-radius: 10px; }
.gp-scores { display: grid; grid-template-columns: repeat(3, 1fr); gap: 8px; margin-bottom: 12px; }
.gp-score { background: #fff; padding: 14px 8px; border-radius: 8px; text-align: center; border: 2px solid; }
.gp-score-bull { border-color: #43A047; }
.gp-score-neutral { border-color: #FFA000; }
.gp-score-bear { border-color: #E53935; }
.gp-score-val { font-size: 26px; font-weight: 700; line-height: 1; font-variant-numeric: tabular-nums; }
.gp-score-bull .gp-score-val { color: #2E7D32; }
.gp-score-neutral .gp-score-val { color: #E65100; }
.gp-score-bear .gp-score-val { color: #C62828; }
.gp-score-lbl { font-size: 11px; font-weight: 700; margin-top: 4px; }
.gp-score-bull .gp-score-lbl { color: #388E3C; }
.gp-score-neutral .gp-score-lbl { color: #F57C00; }
.gp-score-bear .gp-score-lbl { color: #D32F2F; }
.gp-score-sub { font-size: 10px; opacity: 0.6; }
.gp-section { background: #fff; padding: 12px 14px; border-radius: 8px; margin-bottom: 10px; }
.gp-section-lbl { font-size: 11px; color: #888; font-weight: 700; margin-bottom: 4px; letter-spacing: 0.3px; }
.gp-section-body { font-size: 13px; color: #333; line-height: 1.55; }
.gp-2col { display: grid; grid-template-columns: 1fr 1fr; gap: 8px; margin-bottom: 10px; }
.gp-col { padding: 12px; border-radius: 8px; }
.gp-col-up { background: #E8F5E9; }
.gp-col-down { background: #FFEBEE; }
.gp-col-head { font-size: 11px; font-weight: 700; margin-bottom: 6px; }
.gp-col-up .gp-col-head { color: #2E7D32; }
.gp-col-down .gp-col-head { color: #C62828; }
.gp-col-list { margin: 0; padding-left: 16px; font-size: 12px; line-height: 1.55; }
.gp-col-up .gp-col-list { color: #1B5E20; }
.gp-col-down .gp-col-list { color: #B71C1C; }
.gp-section-vn { background: #E3F2FD; padding: 10px 12px; font-size: 12.5px; border-radius: 8px; margin-bottom: 10px; }
.gp-vn-lbl { font-weight: 700; color: #1565C0; }
.gp-vn-text { color: #0D47A1; }
.gp-section-eval { background: #F3E5F5; padding: 10px 12px; font-size: 12.5px; border-radius: 8px; margin-bottom: 10px; }
.gp-eval-lbl { font-weight: 700; color: #6A1B9A; }
.gp-eval-text { color: #4A148C; }
.gp-impact { background: linear-gradient(135deg, #FFE0B2, #FFCCBC); padding: 12px 14px; border-radius: 8px; display: flex; align-items: center; gap: 10px; }
.gp-impact-icon { font-size: 24px; }
.gp-impact-body { flex: 1; }
.gp-impact-lbl { font-size: 10px; color: #BF360C; font-weight: 700; letter-spacing: 0.5px; }
.gp-impact-text { font-size: 13.5px; color: #5D2C00; font-weight: 600; line-height: 1.45; }
.gp-disclaimer { padding: 10px 14px; background: #FFF3E0; border-top: 1px solid #FFE082; font-size: 0.78rem; color: #795548; line-height: 1.5; }

/* Giá vàng chợ đen */
.gp-bm-updated{padding:10px 16px;font-size:13px;color:#777;font-style:italic;background:#fffdf7;border-bottom:1px solid #f0ead7}
.gp-hover tbody tr{transition:background .15s,color .15s;cursor:default}
.gp-hover tbody tr:hover{background:#2b2b2b}
.gp-hover tbody tr:hover td{color:#ffe9a8}
.gp-hover tbody tr:hover td.buy{color:#ff8a80}
.gp-hover tbody tr:hover td.sell{color:#ffd54f}
.gp-bm-btns{display:flex;gap:12px;padding:14px}
.gp-bm-btn{flex:1;display:flex;align-items:center;justify-content:center;gap:8px;padding:13px;border-radius:8px;font-weight:700;font-size:14px;text-decoration:none !important;color:#fff !important;background:linear-gradient(90deg,#e2b53c,#c79417)}
.gp-bm-btn.alt{background:#5D4037}
.gp-bm-btn:hover{filter:brightness(1.07)}

/* Bảng giá chợ đen — dùng tông GOLD chủ đạo của website (giữ bố cục: tiêu đề trái, cập nhật phải) */
.gp-blackmarket .gp-head{display:flex;align-items:center;gap:10px}
.gp-blackmarket .gp-bm-updated{margin-left:auto;padding:0;background:none;border:none;font-style:italic;color:#888;font-size:13px;white-space:nowrap}
.gp-bm-btn.bm-pred{background:var(--gold-d,#9c7510)}
.hm-dark .gp-blackmarket .gp-bm-updated{color:#b8ad8a}

/* Box thống kê lịch sử (Cao nhất / Thấp nhất / TB mua / TB bán) */
.gp-stats{display:grid;grid-template-columns:repeat(4,1fr);gap:10px;padding:14px}
.gp-stat{background:#fffdf7;border:1px solid #ecdfb5;border-radius:10px;padding:12px 10px;text-align:center}
.gp-stat-lbl{display:block;font-size:11px;color:#8a6d1a;font-weight:700;margin-bottom:6px;text-transform:uppercase;letter-spacing:.3px}
.gp-stat-val{display:block;font-size:1.02rem;font-weight:800;font-variant-numeric:tabular-nums}
.gp-stat-val.up{color:#2e7d32}
.gp-stat-val.down{color:#c0392b}
.gp-stat-val.buyc{color:#C0392B}
.gp-stat-val.sellc{color:#c0921a}
@media(max-width:600px){.gp-stats{grid-template-columns:repeat(2,1fr)}}

/* Thẻ giá theo từng ngày (giống web mẫu) */
.gp-days{padding:6px 14px 4px}
.gp-day{border-top:1px solid #f0ead7;padding:16px 0}
.gp-day:first-child{border-top:none}
.gp-day-head{font-size:15px;font-weight:800;color:#333;margin-bottom:10px;display:flex;align-items:center;gap:10px}
.gp-badge{font-size:12px;font-weight:700;padding:2px 9px;border-radius:20px}
.gp-badge.up{background:#e8f5e9;color:#2e7d32}
.gp-badge.down{background:#ffebee;color:#c0392b}
.gp-badge.flat{background:#f0f0f0;color:#777}
.gp-day-grid{display:grid;grid-template-columns:1fr 1fr;gap:14px}
.gp-day-col{padding:12px 14px;border-radius:8px;border-left:4px solid #ccc;background:#fafafa;display:flex;flex-direction:column}
.gp-day-buy{border-left-color:#C0392B;background:#fff6f5}
.gp-day-sell{border-left-color:#1976D2;background:#f4f8fd}
.gp-day-lbl{font-size:11px;font-weight:700;letter-spacing:.4px;color:#888;text-transform:uppercase}
.gp-day-val{font-size:1.35rem;font-weight:800;margin:3px 0 6px;font-variant-numeric:tabular-nums}
.gp-day-buy .gp-day-val{color:#C0392B}
.gp-day-sell .gp-day-val{color:#1976D2}
.gp-day-sub{font-size:12px;color:#777;line-height:1.6}
@media(max-width:600px){.gp-day-grid{grid-template-columns:1fr}}
/* Dark mode cho thẻ ngày */
.hm-dark .gp-day{border-top-color:#3a3326}
.hm-dark .gp-day-head{color:#f1e8cf}
.hm-dark .gp-day-col{background:#2a2419}
.hm-dark .gp-day-buy{background:#2e211d;border-left-color:#ff8a80}
.hm-dark .gp-day-sell{background:#1f2632;border-left-color:#64b5f6}
.hm-dark .gp-day-buy .gp-day-val{color:#ff8a80}
.hm-dark .gp-day-sell .gp-day-val{color:#64b5f6}
.hm-dark .gp-day-sub{color:#b8ad8a}
.hm-dark .gp-badge.up{background:#1b3a24;color:#7bd88f}
.hm-dark .gp-badge.down{background:#3a1f22;color:#ff8a80}

/* Dòng ghi chú cuối trang lịch sử */
.gp-history-note{
	margin:14px 14px 4px;padding:12px 14px;border-radius:8px;
	background:#fffaf0;border:1px solid #f0e2bd;color:#7a5d12;
	font-size:13.5px;line-height:1.6;font-weight:600;
}

/* Nút quay lại */
.gp-back-wrap { text-align: center; margin: 18px 0 6px; }
.gp-back {
	display: inline-block; padding: 10px 22px; border: 1px solid #ccc; border-radius: 6px;
	background: #f5f5f5; color: #333 !important; text-decoration: none !important; font-weight: 600;
	box-shadow: none !important; border-bottom: 1px solid #ccc !important;
}
.gp-back:hover, .gp-back:focus { background: #ebebeb; text-decoration: none !important; }

@media (max-width: 600px) {
	.gp-2col { grid-template-columns: 1fr; }
	.gp-score-val { font-size: 22px; }
	.gp-score-lbl { font-size: 10px; }
	.gp-chart-wrap { height: 230px; padding: 10px; }
	.gp-tbl thead th, .gp-tbl tbody td { padding: 9px 8px; font-size: 0.78rem; }
}