/**
 * Organisational Event — analytics styles.
 *
 * Scoped under .oe-analytics to avoid leaking into theme/admin styles.
 * Uses the AI Singapore palette: deep navy (#0B1F3A) + coral/red (#E8352A).
 *
 * @package AISG\OrgEvent
 */

.oe-analytics {
	--oe-navy: #0b1f3a;
	--oe-navy-soft: #16305a;
	--oe-red: #e8352a;
	--oe-ink: #1d2733;
	--oe-muted: #5a6b7b;
	--oe-line: #e2e8f0;
	--oe-bg: #f6f8fb;
	--oe-white: #ffffff;

	color: var(--oe-ink);
	font-size: 14px;
	line-height: 1.5;
}

.oe-analytics__cards {
	display: grid;
	grid-template-columns: repeat(auto-fit, minmax(180px, 1fr));
	gap: 16px;
	margin: 16px 0 24px;
}

.oe-analytics__card {
	background: var(--oe-white);
	border: 1px solid var(--oe-line);
	border-top: 3px solid var(--oe-navy);
	border-radius: 8px;
	padding: 16px 18px;
}

.oe-analytics__card--accent {
	border-top-color: var(--oe-red);
}

.oe-analytics__card-label {
	color: var(--oe-muted);
	font-size: 12px;
	text-transform: uppercase;
	letter-spacing: 0.04em;
	margin: 0 0 6px;
}

.oe-analytics__card-value {
	color: var(--oe-navy);
	font-size: 26px;
	font-weight: 700;
	margin: 0;
}

.oe-analytics__table {
	width: 100%;
	border-collapse: collapse;
	background: var(--oe-white);
	border: 1px solid var(--oe-line);
	border-radius: 8px;
	overflow: hidden;
}

.oe-analytics__table th,
.oe-analytics__table td {
	padding: 10px 14px;
	text-align: left;
	border-bottom: 1px solid var(--oe-line);
}

.oe-analytics__table thead th {
	background: var(--oe-navy);
	color: var(--oe-white);
	font-weight: 600;
	font-size: 12px;
	text-transform: uppercase;
	letter-spacing: 0.03em;
}

.oe-analytics__table tbody tr:nth-child(even) {
	background: var(--oe-bg);
}

.oe-analytics__table td.oe-analytics__num {
	text-align: right;
	font-variant-numeric: tabular-nums;
}

.oe-analytics__rate {
	display: inline-block;
	min-width: 52px;
	padding: 2px 8px;
	border-radius: 999px;
	background: rgba(232, 53, 42, 0.1);
	color: var(--oe-red);
	font-weight: 600;
	text-align: center;
}

.oe-analytics__channel {
	display: inline-flex;
	align-items: center;
	gap: 6px;
}

.oe-analytics__channel::before {
	content: "";
	width: 9px;
	height: 9px;
	border-radius: 50%;
	background: var(--oe-navy-soft);
}

.oe-analytics__channel--paid_social::before { background: #e8352a; }
.oe-analytics__channel--paid_search::before { background: #b3271e; }
.oe-analytics__channel--organic_social::before { background: #2f80ed; }
.oe-analytics__channel--organic::before { background: #27ae60; }
.oe-analytics__channel--email::before { background: #9b51e0; }
.oe-analytics__channel--referral::before { background: #f2994a; }
.oe-analytics__channel--direct::before { background: #7f8c9b; }

.oe-analytics__empty {
	padding: 24px;
	text-align: center;
	color: var(--oe-muted);
	background: var(--oe-white);
	border: 1px dashed var(--oe-line);
	border-radius: 8px;
}