/* Chỉ bọc shortcode [gdv_live_track]. Không đụng CSS theme. */
.gdv-live-public {
	display: grid;
	grid-template-columns: minmax(0, 1fr);
	box-sizing: border-box;
	width: 100%;
	max-width: 100%;
	min-width: 0;
	margin: 0;
	padding: 20px;
}

.gdv-live-public *,
.gdv-live-public *::before,
.gdv-live-public *::after {
	box-sizing: border-box;
}

.gdv-live-public .gdv-track-stats {
	display: grid;
	grid-template-columns: repeat(3, minmax(0, 1fr));
	gap: 8px;
	margin: 0 0 12px;
}

.gdv-live-public .gdv-track-stat {
	min-width: 0;
	padding: 10px 12px;
}

.gdv-live-public .gdv-track-stat strong {
	display: block;
	overflow: hidden;
	text-overflow: ellipsis;
	white-space: nowrap;
}

.gdv-live-public .gdv-muted {
	margin: 0 0 12px;
}

.gdv-live-scroll {
	width: 100%;
	max-width: 100%;
	min-width: 0;
	overflow-x: auto;
	-webkit-overflow-scrolling: touch;
}

.gdv-live-public .gdv-track-table {
	min-width: 960px;
	width: 100%;
	margin: 0;
	border-collapse: collapse;
	background: #fff;
}

.gdv-live-public .gdv-col-url,
.gdv-live-public .gdv-url,
.gdv-live-public .gdv-col-ref,
.gdv-live-public .gdv-ref,
.gdv-live-public .gdv-ua {
	max-width: 100%;
}

.gdv-live-expired {
	padding: 20px 0;
	font-size: 16px;
	line-height: 1.5;
}

.gdv-live-public .gdv-card-toggle {
	display: none;
}

@media (max-width: 781px) {
	.gdv-live-public .gdv-track-stats {
		grid-template-columns: repeat(3, minmax(0, 1fr));
		gap: 6px;
	}

	.gdv-live-public .gdv-track-stat {
		padding: 8px 6px;
	}

	.gdv-live-public .gdv-track-stat-label {
		font-size: 11px;
	}

	.gdv-live-public .gdv-track-stat strong {
		font-size: 18px;
	}

	.gdv-live-public .gdv-track-stat-meta strong {
		font-size: 13px;
	}

	.gdv-live-scroll {
		overflow: visible;
	}

	.gdv-live-public .gdv-track-table {
		min-width: 0;
		width: 100%;
		border: 0;
		background: transparent;
	}

	.gdv-live-public .gdv-track-table thead {
		display: none;
	}

	.gdv-live-public .gdv-track-table tbody,
	.gdv-live-public .gdv-track-table tr,
	.gdv-live-public .gdv-track-table td {
		display: block;
		width: 100%;
		max-width: none;
	}

	.gdv-live-public .gdv-track-table tr {
		margin: 0 0 12px;
		padding: 0;
		background: #fff;
		border: 1px solid #dcdcde;
		border-radius: 8px;
		overflow: hidden;
	}

	.gdv-live-public .gdv-track-table td {
		display: flex;
		align-items: flex-start;
		justify-content: space-between;
		gap: 12px;
		padding: 8px 12px;
		border: 0;
		border-bottom: 1px solid #f0f0f1;
		text-align: right;
		white-space: normal;
		word-break: break-word;
		overflow-wrap: anywhere;
		vertical-align: top;
	}

	.gdv-live-public .gdv-track-table td:last-child {
		border-bottom: 0;
	}

	.gdv-live-public .gdv-track-table td::before {
		flex: 0 0 38%;
		max-width: 38%;
		color: #646970;
		font-size: 12px;
		font-weight: 600;
		text-align: left;
	}

	.gdv-live-public .gdv-stt-num {
		display: none;
	}

	.gdv-live-public .gdv-card-toggle {
		display: flex;
		align-items: center;
		gap: 8px;
		width: 100%;
		margin: 0;
		padding: 10px 12px;
		border: 0;
		background: #f6f7f7;
		color: #1d2327;
		font: inherit;
		text-align: left;
		cursor: pointer;
		-webkit-appearance: none;
		appearance: none;
	}

	.gdv-live-public .gdv-card-summary {
		display: flex;
		flex-wrap: wrap;
		align-items: baseline;
		gap: 2px 8px;
		flex: 1;
		min-width: 0;
	}

	.gdv-live-public .gdv-card-num {
		flex: 0 0 auto;
		font-weight: 700;
	}

	.gdv-live-public .gdv-card-path {
		flex: 1 1 auto;
		min-width: 0;
		font-weight: 600;
		overflow: hidden;
		text-overflow: ellipsis;
		white-space: nowrap;
	}

	.gdv-live-public .gdv-card-meta {
		flex: 1 1 100%;
		font-size: 12px;
		color: #646970;
		overflow: hidden;
		text-overflow: ellipsis;
		white-space: nowrap;
	}

	.gdv-live-public .gdv-card-chevron {
		flex: 0 0 28px;
		width: 28px;
		height: 28px;
		border-radius: 4px;
		background: #fff;
		border: 1px solid #dcdcde;
		position: relative;
	}

	.gdv-live-public .gdv-card-chevron::after {
		content: "";
		position: absolute;
		top: 8px;
		left: 10px;
		width: 7px;
		height: 7px;
		border-right: 2px solid #1d2327;
		border-bottom: 2px solid #1d2327;
		transform: rotate(45deg);
	}

	.gdv-live-public .gdv-track-table tr.is-open .gdv-card-chevron::after {
		top: 11px;
		transform: rotate(-135deg);
	}

	.gdv-live-public .gdv-track-table tr:not(.is-open) td:not(.gdv-col-stt) {
		display: none;
	}

	.gdv-live-public .gdv-track-table td.gdv-col-stt {
		padding: 0;
		border-bottom: 0;
	}

	.gdv-live-public .gdv-track-table tr.is-open td.gdv-col-stt {
		border-bottom: 1px solid #f0f0f1;
	}

	.gdv-live-public .gdv-track-table td:nth-child(1)::before { content: none; }
	.gdv-live-public .gdv-track-table td:nth-child(2)::before { content: "Chốt đơn"; }
	.gdv-live-public .gdv-track-table td:nth-child(3)::before { content: "Thời gian vào"; }
	.gdv-live-public .gdv-track-table td:nth-child(4)::before { content: "Thời gian trên site"; }
	.gdv-live-public .gdv-track-table td:nth-child(5)::before { content: "URL đang xem"; }
	.gdv-live-public .gdv-track-table td:nth-child(6)::before { content: "Referrer"; }
	.gdv-live-public .gdv-track-table td:nth-child(7)::before { content: "Quảng cáo"; }
	.gdv-live-public .gdv-track-table td:nth-child(8)::before { content: "IP"; }
	.gdv-live-public .gdv-track-table td:nth-child(9)::before { content: "User Agent"; }
	.gdv-live-public .gdv-track-table td:nth-child(10)::before { content: "Số trang"; }
	.gdv-live-public .gdv-track-table td:nth-child(11)::before { content: "Cảnh báo"; }

	.gdv-live-public .gdv-track-table td[colspan] {
		display: block;
		padding: 16px 12px;
		text-align: left;
	}

	.gdv-live-public .gdv-track-table td[colspan]::before {
		content: none;
	}

	.gdv-live-public .gdv-col-url,
	.gdv-live-public .gdv-url,
	.gdv-live-public .gdv-col-ref,
	.gdv-live-public .gdv-ref,
	.gdv-live-public .gdv-ua {
		width: auto;
		max-width: none;
		min-width: 0;
		flex: 1 1 auto;
	}

	.gdv-live-public .gdv-url {
		display: inline;
		overflow: visible;
		text-overflow: unset;
		white-space: normal;
		word-break: break-all;
	}

	.gdv-live-public .gdv-ref {
		display: flex;
		flex-wrap: wrap;
		justify-content: flex-end;
		max-width: none;
	}

	.gdv-live-public .gdv-ua {
		display: inline;
		max-width: none;
	}

	.gdv-live-public .gdv-col-warn,
	.gdv-live-public .gdv-warn-cell {
		width: auto;
		text-align: right;
		white-space: normal;
	}

	.gdv-live-public .gdv-ip {
		word-break: normal;
		max-width: none;
		width: auto;
	}

	.gdv-live-public .gdv-ip-addr {
		width: auto;
		max-width: 100%;
	}

	.gdv-live-public .gdv-ip-n {
		flex: 0 0 auto;
	}

	.gdv-live-public .gdv-col-ip,
	.gdv-live-public .gdv-ip-cell {
		width: auto;
		max-width: none;
	}
}

@media (min-width: 782px) {
	.gdv-live-public .gdv-track-stats {
		display: flex;
		flex-wrap: wrap;
		gap: 12px;
		margin: 0 0 16px;
	}

	.gdv-live-public .gdv-track-stat {
		flex: 0 0 auto;
		min-width: 160px;
		padding: 12px 16px;
		background: #fff;
		border: 1px solid #dcdcde;
		border-radius: 8px;
	}

	.gdv-live-public .gdv-muted {
		margin: 0 0 10px;
	}

	.gdv-live-scroll {
		border: 1px solid #dcdcde;
		border-radius: 8px;
		background: #fff;
		overflow-x: auto;
	}

	.gdv-live-public table.widefat.gdv-track-table,
	.gdv-live-public table.gdv-track-table {
		display: table !important;
		width: max-content !important;
		min-width: 100%;
		max-width: none;
		margin: 0;
		border: 0;
		border-collapse: collapse !important;
		table-layout: auto !important;
		background: #fff;
	}

	.gdv-live-public .gdv-track-table thead {
		display: table-header-group !important;
	}

	.gdv-live-public .gdv-track-table tbody {
		display: table-row-group !important;
	}

	.gdv-live-public .gdv-track-table tr {
		display: table-row !important;
		margin: 0;
		background: transparent;
		border: 0;
		border-radius: 0;
	}

	.gdv-live-public .gdv-track-table.striped tbody tr:nth-child(odd) {
		background: #f6f7f7;
	}

	.gdv-live-public .gdv-track-table thead th,
	.gdv-live-public .gdv-track-table tbody td {
		display: table-cell !important;
		width: auto;
		max-width: none;
		padding: 10px 14px !important;
		border: 0;
		border-bottom: 1px solid #e8e8e8 !important;
		vertical-align: middle !important;
		text-align: left !important;
		white-space: nowrap !important;
		word-break: normal !important;
		overflow-wrap: normal !important;
		line-height: 1.4;
		font-size: 13px;
		color: #1d2327;
	}

	.gdv-live-public .gdv-track-table thead th {
		background: #f0f0f1;
		font-size: 12px;
		font-weight: 600;
		color: #1d2327;
		border-bottom: 1px solid #dcdcde !important;
	}

	.gdv-live-public .gdv-track-table thead th::before,
	.gdv-live-public .gdv-track-table tbody td::before {
		content: none !important;
		display: none !important;
	}

	.gdv-live-public .gdv-col-stt {
		width: 52px;
		text-align: center !important;
	}

	.gdv-live-public .gdv-col-url,
	.gdv-live-public .gdv-url,
	.gdv-live-public .gdv-col-ref,
	.gdv-live-public .gdv-ref,
	.gdv-live-public .gdv-ua {
		width: auto !important;
		max-width: 240px;
	}

	.gdv-live-public .gdv-url {
		display: inline-block;
		max-width: 240px;
		overflow: hidden;
		text-overflow: ellipsis;
		white-space: nowrap !important;
	}

	.gdv-live-public .gdv-ref {
		display: flex;
		align-items: center;
		gap: 6px;
		max-width: 220px;
	}

	.gdv-live-public .gdv-ua {
		display: inline;
		max-width: none;
		white-space: nowrap;
	}

	.gdv-live-public .gdv-ip,
	.gdv-live-public code.gdv-ip {
		color: #1d2327 !important;
		background: #f0f0f1 !important;
		padding: 2px 6px;
		border-radius: 4px;
		font-size: 12px;
		font-family: ui-monospace, Consolas, monospace;
	}

	.gdv-live-public .gdv-col-warn,
	.gdv-live-public .gdv-warn-cell {
		width: auto;
		text-align: left !important;
		white-space: nowrap;
	}

	.gdv-live-public .gdv-badge {
		white-space: nowrap;
	}
}
