/**
 * CircleKit Global Frontend Styles
 * Design system + shared components
 *
 * @package CircleKit
 */

/* ===== Google Fonts ===== */
@import url('https://fonts.googleapis.com/css2?family=Inter:wght@400;500;600;700;800&display=swap');

/* ===== CSS Variables ===== */
:root {
	--ck-purple: #6d28d9;
	--ck-purple-light: #8b5cf6;
	--ck-purple-dark: #5b21b6;
	--ck-purple-glow: rgba(109, 40, 217, 0.12);
	--ck-purple-soft: rgba(109, 40, 217, 0.06);
	--ck-teal: #0d9488;
	--ck-teal-light: #14b8a6;
	--ck-green: #10b981;
	--ck-green-soft: rgba(16, 185, 129, 0.1);
	--ck-red: #ef4444;
	--ck-amber: #f59e0b;
	--ck-blue: #3b82f6;
	--ck-ink: #0f172a;
	--ck-ink-2: #1e293b;
	--ck-ink-3: #334155;
	--ck-muted: #64748b;
	--ck-subtle: #94a3b8;
	--ck-border: #e2e8f0;
	--ck-border-light: #f1f5f9;
	--ck-bg: #f8fafc;
	--ck-bg-card: #ffffff;
	--ck-white: #ffffff;
	--ck-font: 'Inter', -apple-system, BlinkMacSystemFont, 'Segoe UI', sans-serif;
	--ck-radius: 14px;
	--ck-radius-sm: 8px;
	--ck-radius-lg: 22px;
	--ck-radius-pill: 100px;
	--ck-shadow-sm: 0 1px 3px rgba(0, 0, 0, 0.04);
	--ck-shadow: 0 4px 16px rgba(0, 0, 0, 0.06);
	--ck-shadow-lg: 0 8px 32px rgba(0, 0, 0, 0.08);
	--ck-shadow-purple: 0 4px 24px rgba(109, 40, 217, 0.15);
	--ck-transition: all 0.2s ease;
	--ck-transition-slow: all 0.3s ease;
}

/* ===== Reset & Base ===== */
.circlekit-wrap {
	font-family: var(--ck-font);
	color: var(--ck-ink-2);
	line-height: 1.6;
	width: 100%;
	padding: 24px 0;
	-webkit-font-smoothing: antialiased;
}

.circlekit-wrap *,
.circlekit-wrap *::before,
.circlekit-wrap *::after {
	box-sizing: border-box;
}

.circlekit-wrap a {
	color: var(--ck-purple);
	text-decoration: none;
	transition: var(--ck-transition);
}

.circlekit-wrap a:hover {
	color: var(--ck-purple-dark);
}

/* ===== Buttons ===== */
.ck-btn {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	gap: 6px;
	padding: 10px 20px;
	border-radius: var(--ck-radius-sm);
	font-family: var(--ck-font);
	font-size: 14px;
	font-weight: 600;
	cursor: pointer;
	transition: var(--ck-transition);
	border: none;
	line-height: 1;
}

.ck-btn-primary {
	background: var(--ck-purple);
	color: white;
}

.ck-btn-primary:hover {
	background: var(--ck-purple-dark);
	box-shadow: var(--ck-shadow-purple);
	transform: translateY(-1px);
}

.ck-btn-outline {
	background: transparent;
	color: var(--ck-purple);
	border: 1.5px solid var(--ck-purple);
}

.ck-btn-outline:hover {
	background: var(--ck-purple-soft);
}

.ck-btn-ghost {
	background: transparent;
	color: var(--ck-muted);
}

.ck-btn-ghost:hover {
	background: var(--ck-bg);
	color: var(--ck-ink-2);
}

.ck-btn-sm {
	padding: 6px 14px;
	font-size: 13px;
}

/* ===== Cards ===== */
.ck-card {
	background: var(--ck-bg-card);
	border: 1px solid var(--ck-border);
	border-radius: var(--ck-radius);
	padding: 24px;
	transition: var(--ck-transition);
}

.ck-card:hover {
	border-color: rgba(109, 40, 217, 0.15);
	box-shadow: var(--ck-shadow);
}

/* ===== Badges ===== */
.ck-badge {
	display: inline-flex;
	align-items: center;
	gap: 4px;
	padding: 3px 10px;
	border-radius: var(--ck-radius-pill);
	font-size: 11px;
	font-weight: 600;
	line-height: 1;
}

.ck-badge-purple {
	background: var(--ck-purple-glow);
	color: var(--ck-purple);
}

.ck-badge-green {
	background: var(--ck-green-soft);
	color: #059669;
}

.ck-badge-amber {
	background: rgba(245, 158, 11, 0.1);
	color: #d97706;
}

.ck-badge-red {
	background: rgba(239, 68, 68, 0.1);
	color: #dc2626;
}

/* ===== Pills / Tags ===== */
.ck-tag {
	display: inline-flex;
	align-items: center;
	padding: 4px 12px;
	border-radius: var(--ck-radius-pill);
	font-size: 12px;
	font-weight: 500;
	background: var(--ck-bg);
	color: var(--ck-ink-3);
	border: 1px solid var(--ck-border);
}

/* ===== Avatar ===== */
.ck-avatar {
	border-radius: 50%;
	object-fit: cover;
	border: 2px solid var(--ck-white);
	box-shadow: var(--ck-shadow-sm);
	position: relative;
}

.ck-avatar-sm { width: 40px; height: 40px; }
.ck-avatar-md { width: 64px; height: 64px; }
.ck-avatar-lg { width: 96px; height: 96px; }
.ck-avatar-xl { width: 120px; height: 120px; }

/* Online dot */
.ck-online-dot {
	width: 12px;
	height: 12px;
	background: var(--ck-green);
	border: 2px solid var(--ck-white);
	border-radius: 50%;
	position: absolute;
	bottom: 2px;
	right: 2px;
}

/* ===== Progress Ring ===== */
.ck-progress-ring {
	position: relative;
	display: inline-flex;
	align-items: center;
	justify-content: center;
}

.ck-progress-ring svg {
	transform: rotate(-90deg);
}

.ck-progress-ring .ring-track {
	fill: none;
	stroke: var(--ck-border);
	stroke-width: 4;
}

.ck-progress-ring .ring-fill {
	fill: none;
	stroke: var(--ck-purple);
	stroke-width: 4;
	stroke-linecap: round;
	transition: stroke-dashoffset 0.6s ease;
}

.ck-progress-ring .ring-text {
	position: absolute;
	font-size: 18px;
	font-weight: 800;
	color: var(--ck-ink);
}

/* ===== Empty State ===== */
.ck-empty {
	text-align: center;
	padding: 48px 24px;
	color: var(--ck-muted);
}

.ck-empty-icon {
	font-size: 48px;
	margin-bottom: 16px;
	opacity: 0.5;
}

.ck-empty h3 {
	font-size: 18px;
	font-weight: 700;
	color: var(--ck-ink-2);
	margin: 0 0 8px;
}

.ck-empty p {
	font-size: 14px;
	margin: 0;
}

/* ===== Responsive ===== */
@media (max-width: 768px) {
	.circlekit-wrap {
		padding: 16px 0;
	}

	.ck-card {
		padding: 16px;
	}
}

/* ===== Activity Feed 3-Column Layout ===== */
.ck-activity-layout {
	display: grid;
	grid-template-columns: 300px 1fr 300px;
	gap: 24px;
	margin: 0 auto;
	padding: 0;
	align-items: start;
	box-sizing: border-box;
}

/* Collapse to 2 columns when no left sidebar */
.ck-activity-layout:not(:has(.ck-activity-sidebar--left)) {
	grid-template-columns: 1fr 300px;
}

/* Collapse to 2 columns when no right sidebar */
.ck-activity-layout:not(:has(.ck-activity-sidebar--right)) {
	grid-template-columns: 300px 1fr;
}

/* Collapse to 1 column when neither sidebar */
.ck-activity-layout:not(:has(.ck-activity-sidebar--left)):not(:has(.ck-activity-sidebar--right)) {
	grid-template-columns: 1fr;
	max-width: 680px;
}

.ck-activity-main {
	min-width: 0;
}

/* Sidebars */
.ck-activity-sidebar {
	display: flex;
	flex-direction: column;
	gap: 16px;
}

/* Scrollbar styling for sidebars */
.ck-activity-sidebar::-webkit-scrollbar {
	width: 4px;
}
.ck-activity-sidebar::-webkit-scrollbar-track {
	background: transparent;
}
.ck-activity-sidebar::-webkit-scrollbar-thumb {
	background: var(--ck-border);
	border-radius: 4px;
}

/* Sidebar widget cards */
.ck-sidebar-widget {
	background: var(--ck-bg-card);
	border: 1px solid var(--ck-border);
	border-radius: var(--ck-radius);
	padding: 20px;
	transition: var(--ck-transition);
}

.ck-sidebar-widget:hover {
	border-color: rgba(109, 40, 217, 0.12);
	box-shadow: var(--ck-shadow-sm);
}

/* Sidebar widget titles */
.ck-sidebar-title {
	font-size: 14px;
	font-weight: 700;
	color: var(--ck-ink-2);
	margin: 0 0 14px;
	padding-bottom: 10px;
	border-bottom: 1px solid var(--ck-border-light);
	letter-spacing: -0.01em;
}

/* Responsive: tablet — hide left sidebar */
@media (max-width: 1024px) {
	.ck-activity-layout {
		grid-template-columns: 1fr 280px;
	}
	.ck-activity-sidebar--left {
		display: none;
	}
}

/* Responsive: mobile — single column */
@media (max-width: 768px) {
	.ck-activity-layout {
		grid-template-columns: 1fr;
		padding: 0 12px;
		gap: 16px;
	}
	.ck-activity-sidebar {
		position: static;
		max-height: none;
		overflow-y: visible;
	}
	.ck-activity-sidebar--left {
		display: none;
	}
	.ck-activity-sidebar--right {
		order: -1;
	}
}

/* ===== Elementor Dashboard: Welcome Panel ===== */
.elementor-widget-circlekit_welcome_panel,
.elementor-widget-circlekit_membership_progress {
	align-self: stretch;
}

.elementor-widget-circlekit_welcome_panel > .elementor-widget-container,
.elementor-widget-circlekit_membership_progress > .elementor-widget-container {
	height: 100%;
}

.ck-welcome-panel {
	width: min(100%, var(--ck-welcome-panel-width, 100%));
	max-width: 980px;
	height: 100%;
	background: var(--ck-bg-card);
	border: 1px solid var(--ck-border);
	border-radius: var(--ck-radius);
	box-shadow: var(--ck-shadow-sm);
	padding: 20px 28px 18px;
}

.ck-welcome-panel__main {
	display: grid;
	grid-template-columns: auto minmax(0, 1fr);
	gap: 16px;
	align-items: start;
}

.ck-welcome-panel__avatar img {
	display: block;
	width: 88px;
	height: 88px;
	border: 1px solid var(--ck-border);
	border-radius: 50%;
	object-fit: cover;
	overflow: hidden;
}

.ck-welcome-panel__body { min-width: 0; }
.ck-welcome-panel__body h2 {
	margin: 0;
	color: var(--ck-ink);
	font-size: 22px;
	font-weight: 700;
	line-height: 1.2;
}
.ck-welcome-panel__summary {
	margin: 6px 0 0;
	color: var(--ck-muted);
	font-size: 13px;
	font-weight: 400;
	line-height: 1.45;
}

.ck-welcome-panel__dashboard {
	display: grid;
	grid-template-columns: minmax(132px, 1fr) minmax(132px, 1fr) minmax(130px, 0.8fr);
	gap: 10px;
	margin-top: 16px;
	align-items: center;
}

.ck-welcome-panel__facts { display: contents; }

.ck-welcome-panel__fact,
.ck-welcome-panel__subaccount,
.ck-welcome-panel__link {
	display: flex;
	align-items: center;
	gap: 9px;
	min-width: 0;
}

.ck-welcome-panel__fact {
	padding-right: 0;
}

.ck-welcome-panel__icon,
.ck-welcome-panel__subaccount img {
	flex: 0 0 36px;
	width: 36px;
	height: 36px;
	border-radius: 50%;
	object-fit: cover;
}

.ck-welcome-panel__icon {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	background: var(--ck-bg);
	color: var(--ck-muted);
}

.ck-welcome-panel svg {
	width: 16px;
	height: 16px;
}

.ck-welcome-panel__fact span span {
	color: var(--ck-muted);
	font-size: 13px;
	font-weight: 600;
}

.ck-welcome-panel__fact strong,
.ck-welcome-panel__subaccount span {
	display: block;
	overflow: hidden;
	color: var(--ck-ink-2);
	font-size: 13px;
	font-weight: 600;
	line-height: 1.32;
	text-overflow: ellipsis;
}

.ck-welcome-panel__links {
	margin-top: 16px;
	padding-top: 14px;
	border-top: 1px solid var(--ck-border-light);
}

.ck-welcome-panel__subaccounts {
	min-width: 0;
	padding-left: 0;
}

.ck-welcome-panel__sublist {
	display: grid;
	grid-template-columns: 1fr;
	gap: 8px;
}
.ck-welcome-panel__subaccount {
	padding: 0;
	background: transparent;
	border: 0;
	border-radius: 0;
}
.ck-welcome-panel__subaccount span { font-size: 13px; white-space: nowrap; }

.ck-welcome-panel--hide-detail-icons .ck-welcome-panel__fact .ck-welcome-panel__icon {
	display: none;
}

.ck-welcome-panel__links {
	display: flex;
	align-items: center;
	flex-wrap: wrap;
	gap: 14px 34px;
}
.ck-welcome-panel__link,
.ck-welcome-panel__more {
	color: var(--ck-blue);
	font-size: 13px;
	font-weight: 700;
}
.ck-welcome-panel__link:hover,
.ck-welcome-panel__more:hover { color: #2563eb; }

@media (max-width: 900px) {
	.elementor-widget-circlekit_welcome_panel,
	.elementor-widget-circlekit_membership_progress {
		width: 100%;
		max-width: 100%;
	}
	.ck-welcome-panel {
		--ck-welcome-panel-width: 100%;
		width: 100%;
		max-width: none;
	}
	.ck-welcome-panel__main { grid-template-columns: auto 1fr; gap: 16px; }
	.ck-welcome-panel__avatar img { width: 88px; height: 88px; }
	.ck-welcome-panel__dashboard { grid-template-columns: repeat(2, minmax(150px, 1fr)); }
	.ck-welcome-panel__subaccounts { grid-column: 1 / -1; padding-left: 0; }
	.ck-welcome-panel__sublist { grid-template-columns: repeat(auto-fit, minmax(140px, 1fr)); }
	.ck-welcome-panel__fact:nth-child(2) { border-right: 0; padding-right: 0; }
}

@media (max-width: 640px) {
	.ck-welcome-panel { padding: 20px; }
	.ck-welcome-panel__main,
	.ck-welcome-panel__dashboard,
	.ck-welcome-panel__sublist { grid-template-columns: 1fr; }
	.ck-welcome-panel__body h2 { font-size: 22px; }
	.ck-welcome-panel__fact { border-right: 0; padding-right: 0; }
	.ck-welcome-panel__subaccounts { padding-left: 0; }
	.ck-welcome-panel__links { align-items: flex-start; gap: 14px 24px; }
}

/* ===== Elementor Dashboard: Membership Progress ===== */
.ck-progress-card {
	display: grid;
	grid-template-columns: minmax(0, 1fr) auto;
	align-items: center;
	gap: 22px;
	width: min(100%, var(--ck-progress-card-width, 100%));
	max-width: 780px;
	height: 100%;
	min-height: 230px;
	background: var(--ck-bg-card);
	border: 1px solid var(--ck-border);
	border-radius: var(--ck-radius);
	box-shadow: var(--ck-shadow-sm);
	padding: 20px 28px;
}

.ck-progress-card__content,
.ck-progress-card__aside {
	min-width: 0;
}

.ck-progress-card__aside {
	display: flex;
	flex-direction: column;
	align-items: center;
	justify-content: center;
	gap: 16px;
}

.ck-progress-card__title {
	margin: 0;
	color: var(--ck-ink);
	font-size: 22px;
	font-weight: 700;
	line-height: 1.2;
}

.ck-progress-card__summary {
	margin-top: 10px;
	color: var(--ck-muted);
	font-size: 13px;
	font-weight: 400;
	line-height: 1.35;
}

.ck-progress-card__segment-wrap {
	margin-top: 18px;
}

.ck-progress-card__toggle {
	position: absolute;
	opacity: 0;
	pointer-events: none;
}

.ck-progress-card__segments {
	display: grid;
	gap: 8px;
	margin: 0;
	padding: 0;
	list-style: none;
}

.ck-progress-card__segments--more {
	margin-top: 8px;
	display: none;
}

.ck-progress-card__toggle:checked ~ .ck-progress-card__segments--more {
	display: grid;
}

.ck-progress-card__toggle:checked ~ .ck-progress-card__segments .ck-progress-card__more-toggle--more {
	display: none;
}

.ck-progress-card__segment {
	display: grid;
	grid-template-columns: minmax(0, 1fr) auto auto auto;
	align-items: center;
	gap: 10px;
	min-width: 0;
	padding: 0;
	font-size: 13px;
	font-weight: 700;
	line-height: 1.3;
}

.ck-progress-card__segment-label {
	min-width: 0;
	color: var(--ck-ink-2);
	overflow: hidden;
	text-overflow: ellipsis;
	white-space: nowrap;
}

.ck-progress-card__segment-spacer {
	display: block;
	min-width: 70px;
}

.ck-progress-card__more-toggle {
	display: inline-flex;
	align-items: center;
	min-width: 70px;
	color: var(--ck-blue);
	font-size: 13px;
	font-weight: 700;
	line-height: 1;
	white-space: nowrap;
	cursor: pointer;
}

.ck-progress-card__segment-score {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	min-width: 44px;
	padding: 4px 10px;
	border-radius: var(--ck-radius-pill);
	background: var(--ck-green-soft);
	color: #16a34a;
	font-size: 13px;
	font-weight: 700;
	line-height: 1;
	white-space: nowrap;
}

.ck-progress-card__segment-check {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	width: 28px;
	height: 28px;
	border-radius: 50%;
	border: 2px solid #d1d5db;
	color: transparent;
	font-size: 16px;
	font-weight: 900;
	line-height: 1;
}

.ck-progress-card__segment.is-complete .ck-progress-card__segment-check {
	border-color: #22c55e;
	color: #22c55e;
}

.ck-progress-card__ring {
	position: relative;
	width: 122px;
	height: 122px;
}

.ck-progress-card__ring svg {
	display: block;
	width: 100%;
	height: 100%;
	transform: rotate(-90deg);
}

.ck-progress-card__ring-track,
.ck-progress-card__ring-fill {
	fill: none;
	stroke-width: 10;
}

.ck-progress-card__ring-track {
	stroke: var(--ck-border-light);
}

.ck-progress-card__ring-fill {
	stroke: var(--ck-green);
	stroke-linecap: round;
	stroke-dasharray: var(--ck-progress-percent, 0) 100;
}

.ck-progress-card__ring-copy {
	position: absolute;
	inset: 0;
	display: flex;
	flex-direction: column;
	align-items: center;
	justify-content: center;
	gap: 2px;
	text-align: center;
}

.ck-progress-card__percent {
	color: var(--ck-ink);
	font-size: 24px;
	font-weight: 800;
	line-height: 1;
}

.ck-progress-card__ring-label {
	color: var(--ck-muted);
	font-size: 13px;
	font-weight: 700;
	line-height: 1.1;
}

.ck-progress-card__button {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	min-height: 42px;
	padding: 10px 24px;
	border: 1px solid #c7d7fe;
	border-radius: 12px;
	background: transparent;
	color: var(--ck-blue);
	font-size: 13px;
	font-weight: 700;
	line-height: 1;
	text-align: center;
	white-space: nowrap;
}

.ck-progress-card__button:hover {
	border-color: var(--ck-blue);
	background: rgba(59, 130, 246, 0.06);
	color: #2563eb;
}

@media (max-width: 900px) {
	.ck-progress-card {
		--ck-progress-card-width: 100%;
		width: 100%;
		max-width: none;
	}
}

@media (max-width: 640px) {
	.ck-progress-card {
		display: flex;
		flex-direction: column;
		align-items: stretch;
		padding: 22px;
	}
	.ck-progress-card__content,
	.ck-progress-card__aside {
		display: contents;
	}
	.ck-progress-card__title { order: 1; }
	.ck-progress-card__summary { order: 2; }
	.ck-progress-card__ring {
		order: 3;
		align-self: center;
		margin-top: 18px;
	}
	.ck-progress-card__segment-wrap { order: 4; }
	.ck-progress-card__button {
		order: 5;
		margin-top: 16px;
	}
	.ck-progress-card__button {
		width: 100%;
		white-space: normal;
	}
	.ck-progress-card__segment {
		grid-template-columns: minmax(0, 1fr) auto auto;
	}
	.ck-progress-card__segment-check {
		display: none;
	}
}

/* ===== Elementor Dashboard: Quick Links ===== */
.ck-quick-links {
	width: min(100%, var(--ck-quick-width, 100%));
	background: var(--ck-bg-card);
	border: 1px solid var(--ck-border);
	border-radius: var(--ck-radius);
	box-shadow: var(--ck-shadow-sm);
	padding: 26px 30px;
}

.ck-quick-links__header {
	display: flex;
	align-items: flex-start;
	gap: 14px;
	margin-bottom: 20px;
}

.ck-quick-links__mark {
	display: inline-flex;
	flex: 0 0 36px;
	align-items: center;
	justify-content: center;
	width: 36px;
	height: 36px;
	border-radius: 50%;
	background: rgba(59, 130, 246, 0.1);
	color: var(--ck-blue);
}

.ck-quick-links__mark svg {
	width: 16px;
	height: 16px;
	fill: none;
	stroke: currentColor;
	stroke-width: 2;
	stroke-linecap: round;
	stroke-linejoin: round;
}

.ck-quick-links__title {
	margin: 0;
	color: var(--ck-ink);
	font-size: 26px;
	font-weight: 800;
	line-height: 1.2;
}

.ck-quick-links__summary {
	margin: 10px 0 0;
	color: var(--ck-muted);
	font-size: 15px;
	font-weight: 500;
	line-height: 1.45;
}

.ck-quick-links__grid {
	display: grid;
	grid-template-columns: 1fr 1fr 1fr 0.86fr;
	grid-template-rows: auto auto;
	gap: 18px;
}

.ck-quick-card {
	position: relative;
	display: flex;
	flex-direction: column;
	min-width: 0;
	min-height: 178px;
	overflow: hidden;
	background: var(--ck-bg-card);
	border: 1px solid var(--ck-border);
	border-radius: var(--ck-radius);
	box-shadow: var(--ck-shadow-sm);
	padding: 22px;
}

.ck-quick-card--tall {
	grid-row: span 2;
}

.ck-quick-card--wide {
	grid-column: span 2;
	min-height: 136px;
}

.ck-quick-card--small {
	min-height: 178px;
}

.ck-quick-card__icon {
	display: inline-flex;
	flex: 0 0 auto;
	align-items: center;
	justify-content: center;
	width: 64px;
	height: 64px;
	border-radius: 16px;
	margin-bottom: 20px;
	background: rgba(59, 130, 246, 0.1);
	color: var(--ck-blue);
}

.ck-quick-card--wide .ck-quick-card__icon {
	position: absolute;
	top: 22px;
	left: 22px;
	width: 56px;
	height: 56px;
	margin: 0;
}

.ck-quick-card__icon svg {
	width: 28px;
	height: 28px;
	fill: none;
	stroke: currentColor;
	stroke-width: 2;
	stroke-linecap: round;
	stroke-linejoin: round;
}

.ck-quick-card__body {
	position: relative;
	z-index: 1;
	display: flex;
	flex: 1;
	flex-direction: column;
	min-width: 0;
}

.ck-quick-card--wide .ck-quick-card__body {
	padding-left: 76px;
}

.ck-quick-card__head {
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	gap: 10px 14px;
}

.ck-quick-card__title {
	margin: 0;
	color: var(--ck-ink);
	font-size: 19px;
	font-weight: 800;
	line-height: 1.25;
}

.ck-quick-card__badge {
	display: inline-flex;
	align-items: center;
	min-height: 24px;
	padding: 4px 10px;
	border-radius: var(--ck-radius-pill);
	background: rgba(59, 130, 246, 0.1);
	color: var(--ck-blue);
	font-size: 12px;
	font-weight: 800;
	line-height: 1;
	white-space: nowrap;
}

.ck-quick-card__desc {
	margin: 14px 0 0;
	color: var(--ck-muted);
	font-size: 15px;
	font-weight: 500;
	line-height: 1.55;
}

.ck-quick-card--wide .ck-quick-card__desc {
	max-width: 420px;
	margin-top: 10px;
}

.ck-quick-card__link {
	display: inline-flex;
	align-items: center;
	gap: 8px;
	margin-top: 18px;
	color: var(--ck-blue);
	font-size: 15px;
	font-weight: 800;
	line-height: 1;
}

.ck-quick-card--tall .ck-quick-card__link {
	margin-top: auto;
}

.ck-quick-card__art {
	position: absolute;
	right: 12px;
	bottom: 12px;
	width: 112px;
	height: 84px;
	color: rgba(59, 130, 246, 0.08);
	pointer-events: none;
}

.ck-quick-card--wide .ck-quick-card__art {
	right: 20px;
	bottom: 14px;
	width: 132px;
	height: 66px;
	opacity: 0.8;
}

.ck-quick-card__art svg {
	display: block;
	width: 100%;
	height: 100%;
	fill: none;
	stroke: currentColor;
	stroke-width: 6;
	stroke-linecap: round;
	stroke-linejoin: round;
}

.ck-quick-card--green .ck-quick-card__icon,
.ck-quick-card--green .ck-quick-card__badge {
	background: var(--ck-green-soft);
	color: #16a34a;
}

.ck-quick-card--green .ck-quick-card__art {
	color: rgba(16, 185, 129, 0.09);
}

.ck-quick-card--purple .ck-quick-card__icon,
.ck-quick-card--purple .ck-quick-card__badge {
	background: var(--ck-purple-soft);
	color: var(--ck-purple);
}

.ck-quick-card--purple .ck-quick-card__art {
	color: rgba(109, 40, 217, 0.1);
}

.ck-quick-card--orange .ck-quick-card__icon,
.ck-quick-card--orange .ck-quick-card__badge {
	background: rgba(249, 115, 22, 0.1);
	color: #ea580c;
}

.ck-quick-card--orange .ck-quick-card__art {
	color: rgba(249, 115, 22, 0.1);
}

@media (max-width: 1100px) {
	.ck-quick-links__grid {
		grid-template-columns: repeat(2, minmax(0, 1fr));
	}
	.ck-quick-card--tall,
	.ck-quick-card--wide {
		grid-column: auto;
		grid-row: auto;
	}
}

@media (max-width: 640px) {
	.ck-quick-links {
		padding: 22px;
	}
	.ck-quick-links__header {
		margin-bottom: 20px;
	}
	.ck-quick-links__title {
		font-size: 24px;
	}
	.ck-quick-links__grid {
		grid-template-columns: 1fr;
		gap: 16px;
	}
	.ck-quick-card,
	.ck-quick-card--wide,
	.ck-quick-card--small {
		min-height: 0;
		padding: 22px;
	}
	.ck-quick-card--wide .ck-quick-card__icon {
		position: static;
		width: 64px;
		height: 64px;
		margin-bottom: 22px;
	}
	.ck-quick-card--wide .ck-quick-card__body {
		padding-left: 0;
	}
}

/* ===== Elementor Dashboard: Forum Discussions ===== */
.ck-forum-discussions {
	width: min(100%, var(--ck-forum-discussions-width, 100%));
	max-width: 640px;
	background: var(--ck-bg-card);
	border: 1px solid var(--ck-border);
	border-radius: var(--ck-radius);
	box-shadow: var(--ck-shadow-sm);
	padding: 20px 24px;
}

.ck-forum-discussions__header {
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: 18px;
	margin-bottom: 12px;
}

.ck-forum-discussions__title {
	margin: 0;
	color: var(--ck-ink);
	font-size: 24px;
	font-weight: 700;
	line-height: 1.2;
}

.ck-forum-discussions__all {
	display: inline-flex;
	align-items: center;
	gap: 4px;
	color: var(--ck-muted);
	font-size: 14px;
	font-weight: 700;
	letter-spacing: .02em;
	text-transform: uppercase;
	white-space: nowrap;
}

.ck-forum-discussions__input {
	position: absolute;
	opacity: 0;
	pointer-events: none;
}

.ck-forum-discussions__tabs {
	display: grid;
	grid-template-columns: repeat(2, minmax(0, 1fr));
	gap: 6px;
	margin-bottom: 12px;
	padding: 4px;
	background: #f5f7fb;
	border-radius: 999px;
}

.ck-forum-discussions__tab {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	min-height: 34px;
	padding: 7px 14px;
	border-radius: 999px;
	color: #64748b;
	font-size: 13px;
	font-weight: 700;
	line-height: 1.1;
	cursor: pointer;
}

.ck-forum-discussions__input--all:checked ~ .ck-forum-discussions__tabs .ck-forum-discussions__tab:nth-child(1),
.ck-forum-discussions__input--my:checked ~ .ck-forum-discussions__tabs .ck-forum-discussions__tab:nth-child(2) {
	background: #eaf2ff;
	color: #3b82f6;
}

.ck-forum-discussions__panel {
	display: none;
}

.ck-forum-discussions__input--all:checked ~ .ck-forum-discussions__panel--all,
.ck-forum-discussions__input--my:checked ~ .ck-forum-discussions__panel--my {
	display: block;
}

.ck-forum-discussions__list {
	display: grid;
	gap: 0;
}

.ck-forum-discussions__item {
	display: grid;
	grid-template-columns: 36px minmax(0, 1fr);
	gap: 12px;
	padding: 13px 0;
}

.ck-forum-discussions__item + .ck-forum-discussions__item {
	border-top: 1px solid var(--ck-border);
}

.ck-forum-discussions__avatar {
	width: 36px;
	height: 36px;
	border-radius: 50%;
	object-fit: cover;
}

.ck-forum-discussions__body {
	display: grid;
	grid-template-columns: 18px minmax(0, 1fr);
	align-items: start;
	min-width: 0;
}

.ck-forum-discussions__topic,
.ck-forum-discussions__meta,
.ck-forum-discussions__stats {
	grid-column: 2;
}

.ck-forum-discussions__topic {
	color: var(--ck-ink-2);
	font-size: 16px;
	font-weight: 600;
	line-height: 1.25;
}

.ck-forum-discussions__meta {
	margin-top: 2px;
	color: var(--ck-muted);
	font-size: 13px;
	line-height: 1.3;
}

.ck-forum-discussions__meta strong {
	color: var(--ck-ink-2);
	font-weight: 600;
}

.ck-forum-discussions__stats {
	margin-top: 7px;
	color: #a3a8b2;
	font-size: 13px;
	font-weight: 600;
	line-height: 1.3;
}

.ck-forum-discussions__reply {
	grid-column: 1;
	margin-top: 10px;
	color: #c4c8d0;
}

.ck-forum-discussions__reply svg {
	width: 16px;
	height: 16px;
	fill: none;
	stroke: currentColor;
	stroke-width: 2;
	stroke-linecap: round;
	stroke-linejoin: round;
}

.ck-forum-discussions__excerpt {
	grid-column: 2;
	margin: 8px 0 0;
	color: #686d75;
	font-size: 13px;
	font-weight: 500;
	line-height: 1.35;
}

.ck-forum-discussions__empty {
	margin: 12px 0 0;
	color: var(--ck-muted);
	font-size: 15px;
}

@media (max-width: 640px) {
	.ck-forum-discussions {
		max-width: none;
		padding: 20px;
	}
	.ck-forum-discussions__header {
		align-items: flex-start;
	}
	.ck-forum-discussions__title {
		font-size: 22px;
	}
	.ck-forum-discussions__tabs {
		margin-bottom: 10px;
	}
	.ck-forum-discussions__tab {
		min-height: 32px;
		font-size: 12px;
	}
	.ck-forum-discussions__item {
		grid-template-columns: 34px minmax(0, 1fr);
		gap: 11px;
		padding: 12px 0;
	}
	.ck-forum-discussions__avatar {
		width: 34px;
		height: 34px;
	}
	.ck-forum-discussions__topic {
		font-size: 15px;
	}
	.ck-forum-discussions__meta,
	.ck-forum-discussions__stats,
	.ck-forum-discussions__excerpt {
		font-size: 13px;
	}
}

/* ===== Elementor Dashboard: Members ===== */
.ck-members-widget {
	width: min(100%, var(--ck-members-widget-width, 100%));
	max-width: 620px;
	background: var(--ck-bg-card);
	border: 1px solid var(--ck-border);
	border-radius: var(--ck-radius);
	box-shadow: var(--ck-shadow-sm);
	padding: 24px 28px;
}

.ck-members-widget__header {
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: 18px;
	margin-bottom: 18px;
}

.ck-members-widget__title {
	margin: 0;
	color: var(--ck-ink);
	font-size: 28px;
	font-weight: 500;
	line-height: 1.2;
}

.ck-members-widget__all {
	display: inline-flex;
	align-items: center;
	gap: 4px;
	color: #8e8e93;
	font-size: 14px;
	font-weight: 600;
	letter-spacing: .04em;
	text-transform: uppercase;
	white-space: nowrap;
}

.ck-members-widget__input {
	position: absolute;
	opacity: 0;
	pointer-events: none;
}

.ck-members-widget__tabs {
	display: flex;
	align-items: center;
	gap: 28px;
	margin-bottom: 22px;
}

.ck-members-widget__tab {
	position: relative;
	padding-bottom: 8px;
	color: #9ca0a8;
	font-size: 13px;
	font-weight: 700;
	letter-spacing: .04em;
	text-transform: uppercase;
	cursor: pointer;
}

.ck-members-widget__tab::after {
	content: "";
	position: absolute;
	left: 0;
	right: 0;
	bottom: 0;
	height: 1px;
	background: transparent;
}

.ck-members-widget__input--active:checked ~ .ck-members-widget__tabs .ck-members-widget__tab:nth-child(1),
.ck-members-widget__input--popular:checked ~ .ck-members-widget__tabs .ck-members-widget__tab:nth-child(2),
.ck-members-widget__input--new:checked ~ .ck-members-widget__tabs .ck-members-widget__tab:nth-child(3) {
	color: var(--ck-ink);
}

.ck-members-widget__input--active:checked ~ .ck-members-widget__tabs .ck-members-widget__tab:nth-child(1)::after,
.ck-members-widget__input--popular:checked ~ .ck-members-widget__tabs .ck-members-widget__tab:nth-child(2)::after,
.ck-members-widget__input--new:checked ~ .ck-members-widget__tabs .ck-members-widget__tab:nth-child(3)::after {
	background: #d9dee8;
}

.ck-members-widget__panel {
	display: none;
}

.ck-members-widget__input--active:checked ~ .ck-members-widget__panel--active,
.ck-members-widget__input--popular:checked ~ .ck-members-widget__panel--popular,
.ck-members-widget__input--new:checked ~ .ck-members-widget__panel--new {
	display: block;
}

.ck-members-widget__list {
	display: grid;
	gap: 18px;
}

.ck-members-widget__member {
	display: flex;
	align-items: center;
	gap: 16px;
	min-width: 0;
	color: var(--ck-ink-2);
	text-decoration: none;
}

.ck-members-widget__avatar {
	position: relative;
	display: inline-grid;
	place-items: center;
	width: 48px;
	height: 48px;
	flex: 0 0 48px;
	overflow: visible;
	border-radius: 50%;
	background: #6d28d9;
	color: #fff;
}

.ck-members-widget__avatar img {
	display: block;
	width: 100%;
	height: 100%;
	border-radius: inherit;
	object-fit: cover;
}

.ck-members-widget__initial {
	color: #fff;
	font-size: 21px;
	font-weight: 500;
	line-height: 1;
}

.ck-members-widget__online {
	position: absolute;
	right: 0;
	top: 0;
	width: 12px;
	height: 12px;
	border: 2px solid #fff;
	border-radius: 999px;
	background: #22c55e;
}

.ck-members-widget__name {
	min-width: 0;
	overflow-wrap: anywhere;
	color: var(--ck-ink-2);
	font-size: 18px;
	font-weight: 500;
	line-height: 1.3;
}

.ck-members-widget__empty {
	margin: 0;
	color: var(--ck-muted);
	font-size: 15px;
}

.ck-members-widget__color-1 { background: #111827; }
.ck-members-widget__color-2 { background: #1d4ed8; }
.ck-members-widget__color-3 { background: #dc2626; }
.ck-members-widget__color-4 { background: #9333ea; }
.ck-members-widget__color-5 { background: #047857; }
.ck-members-widget__color-6 { background: #4c1d95; }
.ck-members-widget__color-7 { background: #0f766e; }

@media (max-width: 640px) {
	.ck-members-widget {
		max-width: none;
		padding: 22px;
	}
	.ck-members-widget__header {
		align-items: flex-start;
	}
	.ck-members-widget__title {
		font-size: 25px;
	}
	.ck-members-widget__tabs {
		gap: 20px;
		overflow-x: auto;
	}
	.ck-members-widget__member {
		gap: 14px;
	}
	.ck-members-widget__avatar {
		width: 42px;
		height: 42px;
		flex-basis: 42px;
	}
	.ck-members-widget__name {
		font-size: 16px;
	}
}

/* ===== Elementor Dashboard: Groups ===== */
.ck-groups-widget {
	width: min(100%, var(--ck-groups-widget-width, 100%));
	max-width: 620px;
	background: var(--ck-bg-card);
	border: 1px solid var(--ck-border);
	border-radius: var(--ck-radius);
	box-shadow: var(--ck-shadow-sm);
	padding: 24px 28px;
}

.ck-groups-widget__header {
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: 18px;
	margin-bottom: 16px;
}

.ck-groups-widget__title {
	margin: 0;
	color: var(--ck-ink);
	font-size: 28px;
	font-weight: 600;
	line-height: 1.18;
}

.ck-groups-widget__all {
	display: inline-flex;
	align-items: center;
	gap: 4px;
	color: #6d28d9;
	font-size: 14px;
	font-weight: 700;
	letter-spacing: .03em;
	text-transform: uppercase;
	white-space: nowrap;
}

.ck-groups-widget__input {
	position: absolute;
	opacity: 0;
	pointer-events: none;
}

.ck-groups-widget__tabs {
	display: grid;
	grid-template-columns: repeat(2, minmax(0, 1fr));
	gap: 8px;
	margin-bottom: 16px;
	padding: 4px;
	border-radius: 999px;
	background: #f5f7fb;
}

.ck-groups-widget__tab {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	min-height: 36px;
	padding: 8px 14px;
	border-radius: 999px;
	color: #64748b;
	font-size: 14px;
	font-weight: 700;
	line-height: 1;
	cursor: pointer;
}

.ck-groups-widget__input--all:checked ~ .ck-groups-widget__tabs .ck-groups-widget__tab:nth-child(1),
.ck-groups-widget__input--my:checked ~ .ck-groups-widget__tabs .ck-groups-widget__tab:nth-child(2) {
	background: #eaf2ff;
	color: #3b82f6;
}

.ck-groups-widget__panel {
	display: none;
}

.ck-groups-widget__input--all:checked ~ .ck-groups-widget__panel--all,
.ck-groups-widget__input--my:checked ~ .ck-groups-widget__panel--my {
	display: block;
}

.ck-groups-widget__list {
	display: grid;
	gap: 12px;
}

.ck-groups-widget__group {
	display: flex;
	align-items: flex-start;
	gap: 14px;
	min-width: 0;
	padding: 14px;
	border: 1px solid #eef2f7;
	border-radius: 12px;
	background: #fff;
}

.ck-groups-widget__avatar {
	display: inline-grid;
	place-items: center;
	width: 48px;
	height: 48px;
	flex: 0 0 48px;
	overflow: hidden;
	border-radius: 12px;
	background: linear-gradient(135deg, #eef2ff, #f5f3ff);
	color: #6d28d9;
	font-size: 16px;
	font-weight: 800;
	text-decoration: none;
}

.ck-groups-widget__avatar img {
	display: block;
	width: 100%;
	height: 100%;
	object-fit: cover;
}

.ck-groups-widget__body {
	display: grid;
	gap: 4px;
	min-width: 0;
}

.ck-groups-widget__name {
	color: var(--ck-ink);
	font-size: 17px;
	font-weight: 700;
	line-height: 1.25;
	text-decoration: none;
	overflow-wrap: anywhere;
}

.ck-groups-widget__meta {
	color: #94a3b8;
	font-size: 13px;
	font-weight: 700;
	line-height: 1.25;
}

.ck-groups-widget__description {
	margin: 2px 0 0;
	color: #64748b;
	font-size: 14px;
	font-weight: 500;
	line-height: 1.45;
}

.ck-groups-widget__empty {
	margin: 0;
	color: var(--ck-muted);
	font-size: 15px;
}

@media (max-width: 640px) {
	.ck-groups-widget {
		max-width: none;
		padding: 22px;
	}
	.ck-groups-widget__header {
		align-items: flex-start;
	}
	.ck-groups-widget__title {
		font-size: 25px;
	}
	.ck-groups-widget__tabs {
		gap: 6px;
	}
	.ck-groups-widget__tab {
		min-height: 34px;
		font-size: 13px;
	}
	.ck-groups-widget__group {
		gap: 12px;
		padding: 12px;
	}
	.ck-groups-widget__avatar {
		width: 42px;
		height: 42px;
		flex-basis: 42px;
		border-radius: 10px;
		font-size: 14px;
	}
	.ck-groups-widget__name {
		font-size: 16px;
	}
	.ck-groups-widget__description {
		font-size: 13px;
	}
}

/* ===== Elementor Dashboard: Latest Activities ===== */
.ck-latest-activities {
	width: min(100%, var(--ck-latest-activities-width, 100%));
	max-width: 640px;
	background: var(--ck-bg-card);
	border: 1px solid var(--ck-border);
	border-radius: var(--ck-radius);
	box-shadow: var(--ck-shadow-sm);
	padding: 24px 28px;
}

.ck-latest-activities__header {
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: 18px;
	margin-bottom: 16px;
}

.ck-latest-activities__title {
	margin: 0;
	color: var(--ck-ink);
	font-size: 26px;
	font-weight: 700;
	line-height: 1.2;
	text-transform: none;
}

.ck-latest-activities__all {
	display: inline-flex;
	align-items: center;
	gap: 4px;
	color: #b00000;
	font-size: 13px;
	font-weight: 700;
	letter-spacing: .03em;
	text-transform: uppercase;
	white-space: nowrap;
}

.ck-latest-activities__input {
	position: absolute;
	opacity: 0;
	pointer-events: none;
}

.ck-latest-activities__tabs {
	display: grid;
	grid-template-columns: repeat(2, minmax(0, 1fr));
	gap: 6px;
	margin-bottom: 16px;
	padding: 4px;
	background: #f5f7fb;
	border-radius: 999px;
}

.ck-latest-activities__tab {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	min-height: 34px;
	padding: 7px 14px;
	border-radius: 999px;
	color: #64748b;
	font-size: 13px;
	font-weight: 700;
	line-height: 1.1;
	cursor: pointer;
}

.ck-latest-activities__input--all:checked ~ .ck-latest-activities__tabs .ck-latest-activities__tab:nth-child(1),
.ck-latest-activities__input--my:checked ~ .ck-latest-activities__tabs .ck-latest-activities__tab:nth-child(2) {
	background: #eaf2ff;
	color: #3b82f6;
}

.ck-latest-activities__panel {
	display: none;
}

.ck-latest-activities__input--all:checked ~ .ck-latest-activities__panel--all,
.ck-latest-activities__input--my:checked ~ .ck-latest-activities__panel--my {
	display: block;
}

.ck-latest-activities__list {
	display: grid;
	gap: 15px;
}

.ck-latest-activities__item {
	background: #fff;
	border: 1px solid var(--ck-border);
	border-radius: 14px;
	padding: 18px 22px;
}

.ck-latest-activities__top {
	display: grid;
	grid-template-columns: 44px minmax(0, 1fr) auto;
	align-items: start;
	gap: 14px;
}

.ck-latest-activities__avatar {
	width: 44px;
	height: 44px;
	border-radius: 50%;
	object-fit: cover;
}

.ck-latest-activities__identity {
	min-width: 0;
	color: var(--ck-ink);
	font-size: 16px;
	line-height: 1.35;
}

.ck-latest-activities__name {
	color: var(--ck-ink);
	font-weight: 600;
}

.ck-latest-activities__verb {
	color: var(--ck-ink);
	font-weight: 400;
}

.ck-latest-activities__meta {
	margin-top: 3px;
	color: #9ca3af;
	font-size: 13px;
	font-weight: 500;
}

.ck-latest-activities__more {
	color: #9ca3af;
	font-size: 18px;
	font-weight: 700;
	line-height: 1;
}

.ck-latest-activities__content {
	margin: 18px 0 0;
	color: #475569;
	font-size: 16px;
	font-weight: 500;
	line-height: 1.45;
}

.ck-latest-activities__read-more {
	display: inline-flex;
	margin-top: 14px;
	color: #b00000;
	font-size: 15px;
	font-weight: 600;
}

.ck-latest-activities__media {
	margin-top: 14px;
	overflow: hidden;
	border-radius: 10px;
}

.ck-latest-activities__media img {
	display: block;
	width: 100%;
	max-height: 180px;
	object-fit: cover;
}

.ck-latest-activities__actions {
	display: flex;
	align-items: center;
	justify-content: space-around;
	gap: 14px;
	margin-top: 18px;
	padding-top: 12px;
	border-top: 1px solid var(--ck-border);
	color: var(--ck-ink);
}

.ck-latest-activities__action {
	display: inline-flex;
	align-items: center;
	gap: 8px;
	color: var(--ck-ink);
	font-size: 14px;
	font-weight: 500;
}

.ck-latest-activities__action svg {
	width: 20px;
	height: 20px;
	fill: none;
	stroke: #9ca3af;
	stroke-width: 1.8;
	stroke-linecap: round;
	stroke-linejoin: round;
}

.ck-latest-activities__empty {
	margin: 0;
	color: var(--ck-muted);
	font-size: 15px;
}

@media (max-width: 640px) {
	.ck-latest-activities {
		max-width: none;
		padding: 20px;
	}
	.ck-latest-activities__header {
		align-items: flex-start;
	}
	.ck-latest-activities__title {
		font-size: 22px;
	}
	.ck-latest-activities__tab {
		min-height: 32px;
		font-size: 12px;
	}
	.ck-latest-activities__item {
		padding: 16px;
	}
	.ck-latest-activities__top {
		grid-template-columns: 38px minmax(0, 1fr) auto;
		gap: 12px;
	}
	.ck-latest-activities__avatar {
		width: 38px;
		height: 38px;
	}
	.ck-latest-activities__identity,
	.ck-latest-activities__content {
		font-size: 14px;
	}
	.ck-latest-activities__actions {
		justify-content: space-between;
	}
}
