.analytics-body {
	justify-content: space-between;
	margin: 6px 0;
	font-size: 14px;
}
.analytics-container {
	display: grid;
	height: calc(100vh - 90px);
	padding-bottom: 0 !important;
	gap: 10px !important;
}

.analytics-container-three {
	grid-template-columns: 300px 1fr 320px;
}

.analytics-container-two {
	grid-template-columns: 300px 1fr;
}

.analytics-two-col {
	display: grid;
	grid-template-columns: 1fr 1fr;
}
.analytics-three-col {
	display: grid;
	grid-template-columns: 1fr 1fr 1fr;
}
.analytics-sidebar {
	background: #e5e7eb;
	padding: 20px;
	margin-top: 22px;
	border-radius: 5px;
	overflow-y: scroll;
}

.analytics-sidebar h1 {
	font-size: 28px;
	margin: 0 0 10px;
}

.analytics-metric {
	padding-top: 10px;
    padding-bottom: 15px;
    text-align: center;
	margin-bottom: 20px;
}

.analytics-metric-value {
	font-size: 36px;
	font-weight: 900;
}

.analytics-metric-label {
	color: #6b7280;
	font-size: 14px;
}

.analytics-top-pages {
	margin-bottom: 30px;
	border-bottom: 1px solid #ccc;
}
.analytics-top-pages .analytics-metric-label {
	padding-bottom: 5px;
	text-align: center;
	display: block;
	color: #000;
	font-weight: bold;
	border-top: 2px solid #ccc;
	border-bottom: 1px solid #ccc;
	background: #ddd;
	padding-top: 5px;
}
.analytics-top-pages div {
	display: flex;
	justify-content: space-between;
	font-size: 14px;
}

.analytics-top-page {
    border-top: 1px solid #ccc;
	transition: all ease-in-out .3s;
	cursor: pointer;
	padding: 2px;
}
.analytics-top-page:hover {
	background: #ccc;
}
.analytics-pressed {
	background: #ccc;
}
.analytics-top-page .analytics-url {
    max-width: 80%;
    white-space: nowrap;
    overflow: hidden;
}
.analytics-main {
	padding: 20px;
	overflow-y: auto;
}

.analytics-grid {
	display: grid;
	grid-template-columns: repeat(auto-fill, minmax(240px, 1fr));
	gap: 16px;
}

.analytics-card {
	background: #fff;
	border-radius: 10px;
	padding: 14px;
	box-shadow: 0 4px 8px rgba(0,0,0,0.1);
	cursor: pointer;
	transition: all 0.3s ease;
}

.analytics-card:hover {
	box-shadow: 0 6px 12px rgba(0,0,0,0.2);
}

.analytics-card .analytics-url {
	overflow-wrap: anywhere;
	word-break: break-word;
	white-space: normal;
	font-weight: 600;
	font-size: 14px;
	margin-bottom: 8px;
	position: relative;
}
.analytics-meta.analytics-referrer {
	overflow-wrap: anywhere;
	word-break: break-word;
	white-space: normal;

}
.analytics-card .analytics-meta {
	font-size: 13px;
	color: #6b7280;
	margin: 4px 0;
}

.analytics-progress {
	position: relative;
	height: 4px;
	background: #e5e7eb;
	border-radius: 2px;
	overflow: hidden;
}

/* Max scroll (background layer) */
.analytics-progress-max {
	position: absolute;
	top: 0;
	left: 0;
	height: 100%;
	background: #93c5fd; /* lighter blue */
}

/* Current scroll (foreground layer) */
.analytics-progress-current {
	position: absolute;
	top: 0;
	left: 0;
	height: 100%;
	background: #3b82f6; /* primary blue */
}

.analytics-detail {
	background: #e5e7eb;
	padding: 20px;
	margin-top: 22px;
	border-radius: 5px;
	overflow-y: auto;
}
.analytics-views-detail {
	padding: 10px;
}
.analytics-alert {
    border: 2px solid #36A5A5;
}
.analytics-detail h3 {
	margin-bottom: 20px;
	text-align: center;
}
.analytics-data {
	margin-bottom: 5px;
}
.analytics-label {
	font-weight: bold;
}
table.analytics-path {
	width: 100%;
	border-collapse: collapse;
	margin-top: 20px;
}
table.analytics-path th {
	text-align: left;
}
table.analytics-path td {
	overflow-wrap: anywhere;
	word-break: break-word;
	white-space: normal;
}
table.analytics-path td.left-col,
table.analytics-path th.left-col {
	width: 75px;
	padding-left: 5px;
}
table.analytics-path tr {
	height: 26px;
	border-bottom: 1px solid #ccc;
}
table.analytics-path thead {
	border-top: 2px solid #ccc;
	border-bottom: 2px solid #ccc;
	background: #ddd;
}
.analytics-card-active {
	background: #ddd;
}
.analytics-selection {
	margin-bottom: 10px;
}
.analytics-target-url {
	position: absolute;
	right: 0;
	bottom: -25px;
}

.analytics-views-detail {
	font-size: 14px;
}

.analytics-table {
	display: flex;
	flex-direction: column;
	border: 1px solid #e5e7eb;
	border-radius: 8px;
	overflow: hidden;
	background: #fff;
}

.analytics-row {
	display: grid;
	grid-template-columns: 1fr 40px;
	gap: 2px;
	padding: 6px 10px;
	align-items: center;
	border-bottom: 1px solid #f3f4f6;
}

.analytics-row:last-child {
	border-bottom: none;
}

.analytics-header {
	background: #f9fafb;
	font-weight: 600;
	color: #374151;
}

.analytics-views-url {
	overflow: hidden;
}

.analytics-views-url a {
	display: block;
	color: #1f2937;
	text-decoration: none;
	white-space: nowrap;
	overflow: hidden;
	text-overflow: ellipsis;
}

.analytics-views-url a:hover {
	text-decoration: underline;
}

.analytics-count {
	text-align: right;
	font-weight: 500;
	color: #111827;
}
.show-views {
	cursor: pointer;
	transition: all ease-in-out .3s;
	border-radius: 8px;
}
.show-views:hover {
	box-shadow: 0 6px 12px rgba(0,0,0,0.2);
	background: #ccc;
}

.analytics-chart {
	height: 200px;
	margin-left: -10px;
	margin-right: -10px;

}
.analytics-today {
	color: #36A2EB;
}
.analytics-yesterday {
	color: #FF6384;
}
.sessionGauge {
	width: 100%;
	max-width: 100%;
	height: 300px;
	max-height: 300px;
}
.atlas-traffic-chart-wrap {
	width: 100%;
	max-width: 100%;
	height: 200px;
	max-height: 200px;
	margin-top: 40px;
	position: relative;
	min-width: 0;
}
.atlas-traffic-chart-wrap canvas {
	width: 100% !important;
	height: 100% !important;
}
.bb-three-column-layout {
	display: flex;
	gap: 20px;
}
.bb-column-left,
.bb-column-right {
	flex: 1 0 20%;
}
.bb-column-center {
	flex: 0 0 50%;
}
.atlas-segment-bars {
	padding: 20px;
	margin-top: 40px;
	display: flex;
	flex-direction: column;
	gap: 5px;
	background: #eee;
}

.atlas-segment-row {
	display: flex;
	align-items: center;
	gap: 5px;
}

.atlas-segment-label {
	width: 80px;
	font-size: 12px;
	color: #000;
}

.atlas-segment-bar-wrap {
	flex: 1;
	height: 17px;
	background: #ddd;
	overflow: hidden;
	position: relative;
}

.atlas-segment-bar {
	height: 100%;
}

.atlas-segment-percent {
	text-align: right;
	padding-right: 5px;
	font-size: 12px;
	font-weight: bold;
	color: #000;
	position: absolute;
	right: 0;
	top: 0;
}
.atlas-segment-heading {
    font-size: 16px;
    font-weight: bold;
    text-align: center;
    margin-bottom: 15px;
}
.analytics-session-gauge {
	height: 250px !important;
}
.bb-list tr.sno-analytics-row,
.bb-table tr.sno-analytics-row {
	background: #eee;
	border-color: #fff;
}
.bb-list.analytics-three-col {
	gap: 20px;
}
.bb-list {
	margin-top: 30px;
}
.bb-time {
	padding-right: 10px;
	text-align: right;
}
.bb-time-header {
	text-align: right;
	padding-right: 17px;
}
.bb-trend {
	width: 40px;
	text-align: center;
	font-size: 17px;
}
.trend-up {
	color: #2ECC71
}
.trend-down {
	color: #E74C3C
}
.bb-center {
	text-align: center;
}
.bb-domain {
	text-align: left;
	padding-left: 15px;
}
table.bb-table {
    width: 100%;
    border-collapse: collapse;
	margin-bottom: 20px;
}
table.bb-table tr {
    font-size: 14px;
    line-height: 18px;
    height: 35px;
    border-bottom: 1px solid #fff;
    color: #000;
    cursor: pointer;
}
.atlas-segment-donut-wrap {
	position: relative;
	height: 250px;
	width: 100%;
}
table.bb-table thead th {
	cursor: default;
}
table.bb-table.college-table thead th {
	background: rgba(54, 162, 235, 0.4);
	border-top: 1px solid rgba(54, 162, 235, 1);
	border-bottom: 1px solid rgba(54, 162, 235, 1);
}
table.bb-table.highschool-table thead th {
	background: rgba(255, 99, 132, 0.4);
	border-top: 1px solid rgba(255, 99, 132, 1);
	border-bottom: 1px solid rgba(255, 99, 132, 1);
}
table.bb-table.community-table thead th {
	background: rgba(75, 192, 192, 0.4);
	border-top: 1px solid rgba(75, 192, 192, 1);
	border-bottom: 1px solid rgba(75, 192, 192, 1);
}
table.bb-table.fierce-table thead th {
	background: rgba(255, 159, 64, 0.4);
	border-top: 1px solid rgba(255, 159, 64, 1);
	border-bottom: 1px solid rgba(255, 159, 64, 1);
}
table.bb-table.middleschool-table thead th {
	background: rgba(153, 102, 255, 0.4);
	border-top: 1px solid rgba(153, 102, 255, 1);
	border-bottom: 1px solid rgba(153, 102, 255, 1);
}