/* =========================================================
   COMMUNITY DISCUSSIONS
========================================================= */

.community-discussions {
    margin: 80px 0;
}

/* Section Header */
.section-header {
    display: flex;
    justify-content: space-between;
    align-items: flex-end;
    margin-bottom: 40px;
    gap: 20px;
}

.section-title h2 {
    margin: 10px 0;
    font-size: 38px;
    line-height: 1.2;
    color: #111827;
}

.section-tag {
    display: inline-block;
    background: #EEF2FF;
    color: #24346E;
    padding: 6px 16px;
    border-radius: 30px;
    font-size: 13px;
    font-weight: 600;
}

.section-title p {
    margin: 0;
    color: #6B7280;
    line-height: 1.7;
}

/* View All */
.view-all-btn {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    padding: 12px 22px;
    border: 1px solid #24346E;
    border-radius: 8px;
    text-decoration: none;
    color: #24346E;
    font-weight: 600;
    white-space: nowrap;
    transition: all 0.3s ease;
}

.view-all-btn:hover {
    background: #24346E;
    color: #fff;
}

/* =========================================================
   DISCUSSION GRID
========================================================= */

.discussion-grid {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 30px;
    align-items: start;
}


/* One discussion */
.discussion-grid:has(.discussion-card:only-child) {
    grid-template-columns: minmax(0, 1fr);
}

.discussion-grid:has(.discussion-card:only-child) .discussion-card {
    width: 100%;
}
/* =========================================================
   DISCUSSION CARD
========================================================= */

.discussion-card {
    display: flex;
    flex-direction: column;
    height: auto;
    min-width: 0;
    background: #fff;
    border: 1px solid #E5E7EB;
    border-radius: 16px;
    overflow: hidden;
    transition: transform 0.3s ease, box-shadow 0.3s ease;
}

.discussion-card:hover {
    transform: translateY(-6px);
    box-shadow: 0 20px 40px rgba(0, 0, 0, 0.08);
}

/* =========================================================
   DISCUSSION IMAGE
========================================================= */

.discussion-image {
    width: 100%;
    height: 220px;
    overflow: hidden;
    background: #F3F4F6;
}

.discussion-image a {
    display: block;
    width: 100%;
    height: 100%;
}

.discussion-image img {
    display: block;
    width: 100%;
    height: 100%;
    object-fit: cover;
}

/* =========================================================
   DISCUSSION CONTENT
========================================================= */

.discussion-content {
    display: flex;
    flex-direction: column;
    padding: 24px;
    min-width: 0;
}

/* Author */
.discussion-author {
    display: flex;
    align-items: center;
    gap: 12px;
    margin-bottom: 18px;
}

.discussion-author img {
    width: 48px;
    height: 48px;
    flex: 0 0 48px;
    border-radius: 50%;
    object-fit: cover;
}

.discussion-author strong {
    display: block;
    margin-bottom: 3px;
    color: #111827;
    font-size: 15px;
    line-height: 1.4;
}

.discussion-author span {
    display: block;
    color: #6B7280;
    font-size: 13px;
    line-height: 1.4;
}

/* Title */
.discussion-content h3 {
    margin: 0 0 12px;
    font-size: 22px;
    line-height: 1.4;
}

.discussion-content h3 a {
    color: #111827;
    text-decoration: none;
    transition: color 0.3s ease;
}

.discussion-content h3 a:hover {
    color: #24346E;
}

/* Excerpt */
.discussion-content > p {
    margin: 0;
    color: #6B7280;
    line-height: 1.7;
}

/* =========================================================
   DISCUSSION FOOTER
========================================================= */

.discussion-footer {
    display: flex;
    justify-content: space-between;
    align-items: center;
    gap: 15px;
    margin-top: 22px;
    padding-top: 18px;
    border-top: 1px solid #E5E7EB;
}

/* Stats */
.discussion-stats {
    display: flex;
    align-items: center;
    flex-wrap: wrap;
    gap: 14px;
}

.discussion-stats span {
    display: inline-flex;
    align-items: center;
    gap: 5px;
    color: #6B7280;
    font-size: 13px;
    line-height: 1.4;
}

/* Read Discussion */
.discussion-link {
    display: inline-flex;
    align-items: center;
    gap: 5px;
    color: #24346E;
    text-decoration: none;
    font-weight: 600;
    font-size: 14px;
    white-space: nowrap;
    transition: color 0.3s ease;
}

.discussion-link:hover {
    color: #EC222A;
}

/* =========================================================
   EMPTY STATE
========================================================= */

.community-empty-state {
    width: 100%;
    box-sizing: border-box;
    text-align: center;
    padding: 80px 30px;
    background: #fff;
    border-radius: 16px;
    border: 1px solid #E5E7EB;
}

.community-empty-state .empty-icon {
    margin-bottom: 20px;
    font-size: 48px;
    line-height: 1;
}

.community-empty-state h3 {
    margin: 0 0 15px;
    color: #111827;
    font-size: 24px;
}

.community-empty-state p {
    margin: 0 0 30px;
    color: #6B7280;
}

/* =========================================================
   TABLET
========================================================= */

@media (max-width: 991px) {

     .discussion-grid {
        grid-template-columns: repeat(2, minmax(0, 1fr));
        gap: 24px;
    }

    .discussion-grid:has(.discussion-card:only-child) {
        grid-template-columns: minmax(0, 1fr);
    }

    .section-title h2 {
        font-size: 34px;
    }

    .discussion-content {
        padding: 20px;
    }

}

/* =========================================================
   MOBILE
========================================================= */

@media (max-width: 767px) {

    .community-discussions {
        margin: 60px 0;
    }

     .discussion-grid {
        grid-template-columns: 1fr;
        gap: 20px;
    }

    .section-header {
        flex-direction: column;
        align-items: flex-start;
        margin-bottom: 30px;
    }

    .section-title h2 {
        font-size: 30px;
    }

    .discussion-image {
        height: 220px;
    }

    .discussion-content {
        padding: 20px;
    }

    .discussion-footer {
        align-items: flex-start;
        flex-direction: column;
    }

}

/* =========================================================
   SMALL MOBILE
========================================================= */

@media (max-width: 480px) {

    .section-title h2 {
        font-size: 26px;
    }

    .discussion-image {
        height: 200px;
    }

    .discussion-content h3 {
        font-size: 20px;
    }

    .community-empty-state {
        padding: 60px 20px;
    }

}


/* =========================================
   COMMUNITY MODERATORS
========================================= */

.community-section-header {
	display: flex;
	justify-content: space-between;
	align-items: flex-end;
	gap: 20px;
	margin-bottom: 35px;
}

.community-section-header h2 {
	margin: 10px 0 0;
	font-size: 38px;
	line-height: 1.2;
	color: #111827;
}

.community-section-header .section-tag {
	display: inline-block;
	background: #EEF2FF;
	color: #24346E;
	padding: 6px 16px;
	border-radius: 30px;
	font-size: 13px;
	font-weight: 600;
}

.community-count {
	color: #24346E;
	font-size: 15px;
	font-weight: 600;
	white-space: nowrap;
}

.community-moderators-grid {
	display: grid;
	grid-template-columns: repeat(3, minmax(0, 1fr));
	gap: 24px;
}

.community-moderator-card {
	display: flex;
	align-items: center;
	gap: 18px;
	padding: 24px;
	background: #fff;
	border: 1px solid #E5E7EB;
	border-radius: 16px;
	transition: all .3s ease;
}

.community-moderator-card:hover {
	transform: translateY(-4px);
	box-shadow: 0 15px 35px rgba(0, 0, 0, .08);
}

.moderator-avatar {
	flex: 0 0 80px;
}

.moderator-avatar img {
	width: 80px;
	height: 80px;
	border-radius: 50%;
	object-fit: cover;
	display: block;
}

.moderator-info {
	min-width: 0;
}

.moderator-info h3 {
	margin: 0 0 6px;
	font-size: 19px;
	line-height: 1.3;
	color: #111827;
}

.moderator-role {
	display: block;
	color: #24346E;
	font-size: 14px;
	font-weight: 600;
	margin-bottom: 6px;
}

.moderator-info small {
	display: block;
	color: #6B7280;
	font-size: 13px;
}

.community-empty-state {
	text-align: center;
	padding: 70px 30px;
	background: #fff;
	border: 1px solid #E5E7EB;
	border-radius: 16px;
}

.community-empty-state .empty-icon {
	font-size: 42px;
	margin-bottom: 15px;
}

.community-empty-state h3 {
	margin: 0 0 10px;
	color: #111827;
}

.community-empty-state p {
	margin: 0;
	color: #6B7280;
}

@media (max-width: 991px) {

	.community-moderators-grid {
		grid-template-columns: repeat(2, minmax(0, 1fr));
	}

}

@media (max-width: 767px) {

	.community-section-header {
		flex-direction: column;
		align-items: flex-start;
	}

	.community-moderators-grid {
		grid-template-columns: 1fr;
	}

	.community-moderator-card {
		padding: 20px;
	}

}


/* =========================================
   COMMUNITY MEMBERS
========================================= */

.community-members-grid {
	display: grid;
	grid-template-columns: repeat(3, minmax(0, 1fr));
	gap: 24px;
	margin-top: 30px;
}

.community-member-card {
	display: flex;
	align-items: center;
	gap: 20px;
	width: 100%;
	box-sizing: border-box;
	padding: 24px;
	background: #ffffff;
	border: 1px solid #E5E7EB;
	border-radius: 16px;
	transition: all 0.3s ease;
}

.community-member-card:hover {
	transform: translateY(-4px);
	box-shadow: 0 15px 35px rgba(0, 0, 0, 0.08);
}

/* Avatar */

.member-avatar {
	flex: 0 0 80px;
	width: 80px;
	height: 80px;
}

.member-avatar img {
	display: block;
	width: 80px;
	height: 80px;
	border-radius: 50%;
	object-fit: cover;
}

/* Member information */

.member-info {
	flex: 1;
	min-width: 0;
}

.member-info h4 {
	margin: 0 0 7px;
	font-size: 20px;
	line-height: 1.3;
	font-weight: 700;
	color: #111827;
	word-break: normal;
	overflow-wrap: normal;
}

.member-role {
	margin: 0 0 7px;
	color: #24346E;
	font-size: 14px;
	font-weight: 600;
	line-height: 1.4;
}

.member-info small {
	display: block;
	margin: 0;
	color: #6B7280;
	font-size: 13px;
	line-height: 1.5;
}

/* Section header */

.community-members-grid + * {
	margin-top: 30px;
}

/* Member count */

.member-count {
	display: inline-flex;
	align-items: center;
	gap: 7px;
	padding: 14px 20px;
	border: 1px solid #E5E7EB;
	border-radius: 14px;
	background: #ffffff;
	color: #6B7280;
	font-size: 15px;
	font-weight: 600;
}

.member-count::first-letter {
	color: #24346E;
}

/* =========================================
   TABLET
========================================= */

@media (max-width: 991px) {

	.community-members-grid {
		grid-template-columns: repeat(2, minmax(0, 1fr));
	}

	.community-member-card {
		padding: 20px;
	}

	.member-avatar,
	.member-avatar img {
		width: 70px;
		height: 70px;
	}

	.member-avatar {
		flex: 0 0 70px;
	}

	.member-info h4 {
		font-size: 18px;
	}

}

/* =========================================
   MOBILE
========================================= */

@media (max-width: 767px) {

	.community-members-grid {
		grid-template-columns: 1fr;
		gap: 18px;
	}

	.community-member-card {
		padding: 20px;
		gap: 18px;
	}

	.member-avatar,
	.member-avatar img {
		width: 70px;
		height: 70px;
	}

	.member-avatar {
		flex: 0 0 70px;
	}

	.member-info h4 {
		font-size: 18px;
	}

}

/* Small mobile */

@media (max-width: 480px) {

	.community-member-card {
		padding: 18px;
	}

	.member-avatar,
	.member-avatar img {
		width: 60px;
		height: 60px;
	}

	.member-avatar {
		flex: 0 0 60px;
	}

	.member-info h4 {
		font-size: 17px;
	}

	.member-role {
		font-size: 13px;
	}

	.member-info small {
		font-size: 12px;
	}

}

/* =========================================
   COMMUNITY RULES
========================================= */

.community-rules-box {
	background: #ffffff;
	border: 1px solid #E5E7EB;
	border-radius: 18px;
	padding: 10px;
	box-shadow: 0 10px 30px rgba(0, 0, 0, 0.04);
}

.community-rules {
	margin: 0;
	padding: 0;
	list-style: none;
}

.community-rule-item {
	display: flex;
	align-items: flex-start;
	gap: 20px;
	padding: 24px 22px;
	border-bottom: 1px solid #E5E7EB;
}

.community-rule-item:last-child {
	border-bottom: 0;
}

.community-rule-number {
	flex: 0 0 44px;
	width: 44px;
	height: 44px;
	display: flex;
	align-items: center;
	justify-content: center;
	background: #EEF2FF;
	color: #24346E;
	border-radius: 50%;
	font-size: 15px;
	font-weight: 700;
}

.community-rule-content {
	flex: 1;
	min-width: 0;
}

.community-rule-content p {
	margin: 0;
	color: #374151;
	font-size: 16px;
	line-height: 1.7;
}

.community-rule-item:hover {
	background: #FAFBFF;
}

.community-rule-item:first-child {
	border-radius: 12px 12px 0 0;
}

.community-rule-item:last-child {
	border-radius: 0 0 12px 12px;
}

/* =========================================
   RULE COUNT
========================================= */

.community-section-header .community-count,
.section-header .community-count {
	display: inline-flex;
	align-items: center;
	gap: 7px;
	padding: 14px 20px;
	background: #ffffff;
	border: 1px solid #E5E7EB;
	border-radius: 14px;
	color: #6B7280;
	font-size: 15px;
	font-weight: 600;
	white-space: nowrap;
}

.community-section-header .community-count strong,
.section-header .community-count strong {
	color: #24346E;
	font-size: 18px;
}

/* =========================================
   MOBILE
========================================= */

@media (max-width: 767px) {

	.community-rules-box {
		padding: 6px;
		border-radius: 14px;
	}

	.community-rule-item {
		gap: 14px;
		padding: 20px 16px;
	}

	.community-rule-number {
		flex: 0 0 38px;
		width: 38px;
		height: 38px;
		font-size: 14px;
	}

	.community-rule-content p {
		font-size: 15px;
		line-height: 1.6;
	}

	.community-section-header {
		flex-direction: column;
		align-items: flex-start;
	}

}

/* =========================================
   SMALL MOBILE
========================================= */

@media (max-width: 480px) {

	.community-rule-item {
		gap: 12px;
		padding: 18px 12px;
	}

	.community-rule-number {
		flex: 0 0 34px;
		width: 34px;
		height: 34px;
		font-size: 13px;
	}

	.community-rule-content p {
		font-size: 14px;
	}

}

/* =========================================================
   COMMUNITY SECTION CONSISTENCY
========================================================= */

.community-main-content .community-content > section {
	width: 100%;
	margin-top: 80px;
	margin-bottom: 80px;
}

.community-main-content .community-content > section:first-child {
	margin-top: 0;
}


/* =========================================================
   COMMON SECTION HEADER
========================================================= */

.community-main-content .section-header {
	display: flex;
	justify-content: space-between;
	align-items: flex-end;
	gap: 30px;
	margin-bottom: 40px;
}

.community-main-content .section-title {
	max-width: 760px;
}

.community-main-content .section-title h2 {
	margin: 10px 0;
	color: #111827;
	font-size: 38px;
	line-height: 1.2;
	font-weight: 700;
}

.community-main-content .section-title p {
	margin: 0;
	color: #6B7280;
	font-size: 16px;
	line-height: 1.7;
}

.community-main-content .section-tag {
	display: inline-block;
	padding: 6px 16px;
	background: #EEF2FF;
	color: #24346E;
	border-radius: 30px;
	font-size: 13px;
	font-weight: 600;
	line-height: 1.4;
}


/* =========================================================
   COMMON EMPTY STATE
========================================================= */

.community-main-content .community-empty-state {
	width: 100%;
	box-sizing: border-box;
	padding: 70px 30px;
	background: #ffffff;
	border: 1px solid #E5E7EB;
	border-radius: 18px;
	text-align: center;
}

.community-main-content .community-empty-state .empty-icon {
	margin-bottom: 18px;
	font-size: 44px;
	line-height: 1;
}

.community-main-content .community-empty-state h3 {
	margin: 0 0 12px;
	color: #111827;
	font-size: 24px;
	line-height: 1.3;
}

.community-main-content .community-empty-state p {
	margin: 0;
	color: #6B7280;
	font-size: 16px;
	line-height: 1.7;
}


/* =========================================================
   MOBILE
========================================================= */

@media (max-width: 767px) {

	.community-main-content .community-content > section {
		margin-top: 55px;
		margin-bottom: 55px;
	}

	.community-main-content .section-header {
		flex-direction: column;
		align-items: flex-start;
		gap: 15px;
		margin-bottom: 30px;
	}

	.community-main-content .section-title h2 {
		font-size: 32px;
	}

	.community-main-content .section-title p {
		font-size: 15px;
	}

	.community-main-content .community-empty-state {
		padding: 55px 20px;
	}

}

/* =========================================================
   COMMUNITY SIDEBAR
========================================================= */

.community-sidebar-card {
	background: #ffffff;
	border: 1px solid #E5E7EB;
	border-radius: 20px;
	padding: 28px;
	box-sizing: border-box;
	box-shadow: 0 10px 30px rgba(0, 0, 0, 0.04);
}

.community-sidebar-header {
	margin-bottom: 25px;
}

.community-sidebar-header .section-tag {
	display: inline-block;
	margin-bottom: 10px;
	padding: 6px 14px;
	background: #EEF2FF;
	color: #24346E;
	border-radius: 30px;
	font-size: 12px;
	font-weight: 600;
}

.community-sidebar-header h3 {
	margin: 0;
	color: #111827;
	font-size: 24px;
	line-height: 1.3;
}


/* Stats */

.community-sidebar-stats {
	display: grid;
	grid-template-columns: repeat(3, 1fr);
	gap: 10px;
	margin-bottom: 25px;
}

.community-sidebar-stat {
	padding: 14px 8px;
	background: #F7F8FB;
	border-radius: 10px;
	text-align: center;
}

.community-sidebar-stat strong {
	display: block;
	margin-bottom: 4px;
	color: #24346E;
	font-size: 20px;
	line-height: 1.2;
}

.community-sidebar-stat span {
	display: block;
	color: #6B7280;
	font-size: 11px;
	line-height: 1.3;
}


/* Information */

.community-info-list {
	margin: 0;
	padding: 0;
	list-style: none;
	border-top: 1px solid #E5E7EB;
}

.community-info-list li {
	display: flex;
	justify-content: space-between;
	align-items: flex-start;
	gap: 20px;
	padding: 15px 0;
	border-bottom: 1px solid #E5E7EB;
}

.community-info-list strong {
	flex: 0 0 auto;
	color: #111827;
	font-size: 14px;
}

.community-info-list span {
	color: #6B7280;
	font-size: 14px;
	text-align: right;
	word-break: break-word;
}


/* Buttons */

.community-sidebar-btn {
	display: flex;
	align-items: center;
	justify-content: center;
	gap: 8px;
	width: 100%;
	box-sizing: border-box;
	margin-top: 18px;
	padding: 13px 18px;
	border: 1px solid #24346E;
	border-radius: 9px;
	background: #ffffff;
	color: #24346E;
	font-size: 14px;
	font-weight: 600;
	line-height: 1.4;
	text-align: center;
	text-decoration: none;
	cursor: pointer;
	transition: all 0.25s ease;
}

.community-sidebar-btn:hover {
	background: #24346E;
	color: #ffffff;
}

.community-sidebar-btn.primary {
	background: #24346E;
	color: #ffffff;
}

.community-sidebar-btn.primary:hover {
	background: #1A2550;
	border-color: #1A2550;
}

.community-sidebar-btn.leave {
	color: #6B7280;
	border-color: #D6DAE3;
}

.community-sidebar-btn.leave:hover {
	background: #F7F8FB;
	color: #111827;
}

.community-sidebar-action form {
	margin: 0;
}

.community-sidebar-action .community-sidebar-btn {
	margin-top: 18px;
}


/* =========================================================
   TABLET / MOBILE
========================================================= */

@media (max-width: 767px) {

	.community-sidebar-card {
		padding: 22px;
		border-radius: 16px;
	}

	.community-sidebar-header h3 {
		font-size: 22px;
	}

}

@media (max-width: 420px) {

	.community-sidebar-stats {
		gap: 6px;
	}

	.community-sidebar-stat {
		padding: 12px 5px;
	}

	.community-sidebar-stat strong {
		font-size: 18px;
	}

	.community-sidebar-stat span {
		font-size: 10px;
	}

}

/* =========================================================
   MODERN COMMUNITY HERO
   ========================================================= */

.ri-community-hero {
	position: relative;
	background: #f7f9fc;
	padding: 0 0 34px;
	overflow: hidden;
}

.ri-community-hero .container {
	max-width: 1200px;
	margin: 0 auto;
	padding: 0 24px;
}


/* =========================================================
   BREADCRUMB
   ========================================================= */

.ri-community-breadcrumb {
	display: flex;
	align-items: center;
	gap: 8px;
	padding: 18px 0 20px;

	font-size: 12px;
	line-height: 1.4;
	color: #718096;
}

.ri-community-breadcrumb a {
	color: #64748b;
	text-decoration: none;
	transition: color .2s ease;
}

.ri-community-breadcrumb a:hover {
	color: #315bea;
}

.ri-community-breadcrumb span {
	color: #a0aec0;
}

.ri-community-breadcrumb .current {
	color: #273b73;
	font-weight: 600;
}


/* =========================================================
   HERO LAYOUT
   ========================================================= */

.ri-community-hero-inner {
	display: grid;
	grid-template-columns: minmax(0, 0.92fr) minmax(450px, 1.08fr);
	align-items: center;
	gap: 42px;

	min-height: 300px;
}


/* =========================================================
   LEFT CONTENT
   ========================================================= */

.ri-community-hero-content {
	padding: 18px 0 20px;
}

.ri-community-title-row {
	display: flex;
	align-items: center;
	gap: 18px;
	margin-bottom: 15px;
}

.ri-community-icon {
	flex: 0 0 76px;
	width: 76px;
	height: 76px;

	display: flex;
	align-items: center;
	justify-content: center;

	border-radius: 20px;
	background: #e8efff;

	color: #2f61e9;

	font-size: 24px;
	font-weight: 800;
	letter-spacing: 3px;

	box-shadow: 0 10px 25px rgba(49, 91, 234, .08);
}

.ri-community-icon span {
	margin-top: -8px;
}

.ri-community-title {
	margin: 0;

	color: #172554;

	font-size: clamp(34px, 4vw, 48px);
	font-weight: 750;
	line-height: 1.08;
	letter-spacing: -1.8px;
}

.ri-community-tagline {
	margin: 6px 0 0;

	color: #334e78;
	font-size: 18px;
	font-weight: 500;
	line-height: 1.5;
}

.ri-community-description {
	max-width: 600px;
	margin: 18px 0 22px;

	color: #5c6f8c;
	font-size: 15px;
	line-height: 1.65;
}

.ri-community-description p {
	margin: 0;
}


/* =========================================================
   ACTIONS
   ========================================================= */

.ri-community-hero-actions {
	display: flex;
	align-items: center;
	flex-wrap: wrap;
	gap: 12px;
}

.ri-community-action-form {
	margin: 0;
}

.ri-community-btn {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	gap: 9px;

	min-height: 44px;
	padding: 0 20px;

	border-radius: 24px;

	font-size: 13px;
	font-weight: 700;
	line-height: 1;

	text-decoration: none;
	cursor: pointer;

	transition:
		transform .25s ease,
		box-shadow .25s ease,
		background .25s ease,
		border-color .25s ease;
}

.ri-community-btn:hover {
	transform: translateY(-2px);
	text-decoration: none;
}

.ri-community-btn-primary {
	border: 1px solid #ff681f;
	background: #ff681f;
	color: #ffffff;

	box-shadow: 0 8px 20px rgba(255, 104, 31, .18);
}

.ri-community-btn-primary:hover {
	border-color: #ed5710;
	background: #ed5710;
	color: #ffffff;
}

.ri-community-btn-outline {
	border: 1px solid #253b82;
	background: #ffffff;
	color: #253b82;
}

.ri-community-btn-outline:hover {
	background: #253b82;
	border-color: #253b82;
	color: #ffffff;
}

.ri-btn-icon {
	font-size: 16px;
	font-weight: 800;
}


/* =========================================================
   HERO IMAGE
   ========================================================= */

.ri-community-hero-media {
	position: relative;
	align-self: stretch;
	display: flex;
	align-items: center;
}

.ri-community-image-wrap {
	position: relative;

	width: 100%;
	aspect-ratio: 1.55 / 1;

	overflow: hidden;

	border-radius: 0 0 85px 85px;

	background: #eaf0f8;

	box-shadow: 0 15px 35px rgba(24, 39, 75, .08);
}

.ri-community-featured-image {
	display: block;

	width: 100%;
	height: 100%;

	object-fit: cover;
	object-position: center;

	transition: transform .5s ease;
}

.ri-community-image-wrap:hover .ri-community-featured-image {
	transform: scale(1.02);
}


/* =========================================================
   IMAGE PLACEHOLDER
   ========================================================= */

.ri-community-image-placeholder {
	width: 100%;
	aspect-ratio: 1.55 / 1;

	display: flex;
	flex-direction: column;
	align-items: center;
	justify-content: center;
	gap: 12px;

	border-radius: 0 0 85px 85px;

	background: #edf2ff;

	color: #315bea;
}

.ri-placeholder-icon {
	font-size: 25px;
	font-weight: 800;
	letter-spacing: 5px;
}

.ri-community-image-placeholder span {
	font-size: 18px;
	font-weight: 700;
}


/* =========================================================
   TABLET
   ========================================================= */

@media (max-width: 991px) {

	.ri-community-hero-inner {
		grid-template-columns: 1fr;
		gap: 25px;
	}

	.ri-community-hero-content {
		padding-top: 10px;
	}

	.ri-community-hero-media {
		width: 100%;
	}

	.ri-community-image-wrap,
	.ri-community-image-placeholder {
		border-radius: 0 0 55px 55px;
	}

}


/* =========================================================
   MOBILE
   ========================================================= */

@media (max-width: 767px) {

	.ri-community-hero {
		padding-bottom: 25px;
	}

	.ri-community-hero .container {
		padding: 0 18px;
	}

	.ri-community-breadcrumb {
		padding: 14px 0 16px;
		font-size: 11px;
	}

	.ri-community-title-row {
		align-items: flex-start;
		gap: 13px;
	}

	.ri-community-icon {
		flex: 0 0 58px;
		width: 58px;
		height: 58px;
		border-radius: 16px;
		font-size: 18px;
	}

	.ri-community-title {
		font-size: 32px;
		letter-spacing: -1px;
	}

	.ri-community-tagline {
		font-size: 16px;
	}

	.ri-community-description {
		margin: 16px 0 20px;
		font-size: 14px;
	}

	.ri-community-hero-actions {
		width: 100%;
	}

	.ri-community-action-form {
		flex: 1;
	}

	.ri-community-btn {
		width: 100%;
		min-height: 46px;
	}

	.ri-community-hero-actions > .ri-community-btn {
		flex: 1;
	}

	.ri-community-image-wrap,
	.ri-community-image-placeholder {
		aspect-ratio: 1.25 / 1;
		border-radius: 0 0 35px 35px;
	}

}


/* =========================================================
   SMALL MOBILE
   ========================================================= */

@media (max-width: 480px) {

	.ri-community-title {
		font-size: 28px;
	}

	.ri-community-title-row {
		gap: 11px;
	}

	.ri-community-icon {
		flex-basis: 52px;
		width: 52px;
		height: 52px;
	}

	.ri-community-hero-actions {
		flex-direction: column;
		align-items: stretch;
	}

	.ri-community-action-form {
		width: 100%;
	}
}

/* =========================================================
   MODERN COMMUNITY NAVIGATION
   ========================================================= */

.ri-community-navigation {
	position: relative;
	z-index: 10;

	background: #f7f9fc;

	padding: 0 24px 24px;
}

.ri-community-navigation-inner {
	max-width: 1200px;
	margin: 0 auto;

	display: flex;
	align-items: center;

	min-height: 54px;

	padding: 0 8px;

	background: #ffffff;

	border: 1px solid #edf0f5;
	border-radius: 14px;

	box-shadow: 0 8px 24px rgba(23, 37, 84, 0.06);

	overflow-x: auto;
	scrollbar-width: none;
}

.ri-community-navigation-inner::-webkit-scrollbar {
	display: none;
}


/* ---------------------------------------------------------
   NAV LINKS
   --------------------------------------------------------- */

.ri-community-nav-link {
	position: relative;

	display: inline-flex;
	align-items: center;
	justify-content: center;
	gap: 5px;

	height: 54px;

	padding: 0 18px;

	color: #4f607c;

	font-size: 13px;
	font-weight: 600;

	text-decoration: none;
	white-space: nowrap;

	transition:
		color .2s ease,
		background .2s ease;
}

.ri-community-nav-link:hover {
	color: #315bea;
	text-decoration: none;
}

.ri-community-nav-link.active {
	color: #315bea;
}

.ri-community-nav-link.active::after {
	content: "";

	position: absolute;

	left: 14px;
	right: 14px;
	bottom: 0;

	height: 3px;

	border-radius: 3px 3px 0 0;

	background: #315bea;
}


/* ---------------------------------------------------------
   COUNT
   --------------------------------------------------------- */

.ri-nav-count {
	display: inline-flex;
	align-items: center;
	justify-content: center;

	min-width: 18px;
	height: 18px;

	padding: 0 5px;

	border-radius: 20px;

	background: #f1f4f9;

	color: #718096;

	font-size: 10px;
	font-weight: 700;
}

.ri-community-nav-link.active .ri-nav-count {
	background: #e8efff;
	color: #315bea;
}


/* ---------------------------------------------------------
   STICKY NAV
   --------------------------------------------------------- */

@media (min-width: 992px) {

	.ri-community-navigation {
		position: sticky;
		top: 0;
	}

}


/* ---------------------------------------------------------
   MOBILE
   --------------------------------------------------------- */

@media (max-width: 767px) {

	.ri-community-navigation {
		padding: 0 14px 18px;
	}

	.ri-community-navigation-inner {
		border-radius: 12px;
		padding: 0 4px;
	}

	.ri-community-nav-link {
		height: 50px;
		padding: 0 14px;
		font-size: 12px;
	}

	.ri-community-nav-link.active::after {
		left: 10px;
		right: 10px;
	}

}


/* =========================================================
   COMMUNITY OVERVIEW
   ========================================================= */

.ri-community-overview {
	max-width: 1200px;
	margin: 0 auto;
	padding: 28px 0 0;
}


/* =========================================================
   ABOUT + STATS
   ========================================================= */

.ri-community-overview-grid {
	display: grid;
	grid-template-columns: minmax(0, 1fr) 300px;
	gap: 18px;
	align-items: stretch;
}

.ri-community-about-card,
.ri-community-stats-card {
	background: #ffffff;
	border: 1px solid #e9edf4;
	border-radius: 16px;
	box-shadow: 0 8px 25px rgba(23, 37, 84, .04);
}


/* ABOUT */

.ri-community-about-card {
	padding: 28px 30px;
}

.ri-community-section-label {
	display: inline-flex;
	align-items: center;

	padding: 7px 13px;

	border-radius: 30px;

	background: #eef3ff;
	color: #29478f;

	font-size: 11px;
	font-weight: 700;
	line-height: 1;
}

.ri-community-about-card h2 {
	margin: 14px 0 14px;

	color: #172554;

	font-size: 28px;
	font-weight: 750;
	line-height: 1.2;
	letter-spacing: -.7px;
}

.ri-community-about-text {
	color: #596b87;
	font-size: 14px;
	line-height: 1.75;
}

.ri-community-about-text p {
	margin: 0 0 14px;
}

.ri-community-about-text p:last-child {
	margin-bottom: 0;
}


/* =========================================================
   STATS CARD
   ========================================================= */

.ri-community-stats-card {
	padding: 22px;
}

.ri-community-stats-card h3 {
	margin: 14px 0 20px;

	color: #172554;

	font-size: 20px;
	font-weight: 750;
	line-height: 1.2;
}

.ri-community-stat-list {
	display: flex;
	flex-direction: column;
	gap: 14px;
}

.ri-community-stat-row {
	display: flex;
	align-items: center;
	gap: 12px;
}

.ri-community-stat-icon {
	flex: 0 0 42px;

	width: 42px;
	height: 42px;

	display: flex;
	align-items: center;
	justify-content: center;

	border-radius: 12px;

	font-size: 17px;
	font-weight: 700;
}

.members-icon {
	background: #eef4ff;
	color: #2563eb;
}

.chat-icon {
	background: #f1edff;
	color: #6941c6;
	font-size: 12px;
	letter-spacing: 2px;
}

.active-icon {
	background: #eafaf1;
}

.active-icon span {
	width: 13px;
	height: 13px;
	border-radius: 50%;
	background: #17a65b;
}

.ri-community-stat-row strong {
	display: block;

	color: #172554;
	font-size: 16px;
	font-weight: 750;
	line-height: 1.2;
}

.ri-community-stat-row span {
	display: block;

	margin-top: 3px;

	color: #7a879d;
	font-size: 11px;
}

.ri-community-sidebar-join {
	width: 100%;
	margin-top: 20px;
	padding: 12px 15px;

	border: 0;
	border-radius: 10px;

	background: #173a88;
	color: #ffffff;

	font-size: 12px;
	font-weight: 700;

	cursor: pointer;

	transition: background .2s ease, transform .2s ease;
}

.ri-community-sidebar-join:hover {
	background: #102d6d;
	color: #ffffff;
	transform: translateY(-1px);
}


/* =========================================================
   MEMBER FEATURES
   ========================================================= */

.ri-community-member-features {
	margin-top: 18px;

	padding: 28px 30px;

	background: #ffffff;
	border: 1px solid #e9edf4;
	border-radius: 16px;

	box-shadow: 0 8px 25px rgba(23, 37, 84, .04);
}

.ri-community-features-header h2 {
	margin: 13px 0 24px;

	color: #172554;

	font-size: 26px;
	font-weight: 750;
	line-height: 1.2;
	letter-spacing: -.6px;
}


/* =========================================================
   FEATURE GRID
   ========================================================= */

.ri-community-feature-grid {
	display: grid;
	grid-template-columns: repeat(3, 1fr);
	gap: 14px;
}

.ri-community-feature-card {
	display: block;

	padding: 20px;

	border-radius: 14px;

	background: #f7f9fd;

	text-decoration: none;

	transition:
		transform .25s ease,
		box-shadow .25s ease,
		background .25s ease;
}

.ri-community-feature-card:hover {
	transform: translateY(-3px);

	background: #ffffff;

	box-shadow: 0 12px 28px rgba(23, 37, 84, .08);

	text-decoration: none;
}

.ri-feature-icon {
	width: 40px;
	height: 40px;

	display: flex;
	align-items: center;
	justify-content: center;

	margin-bottom: 13px;

	border-radius: 12px;

	font-size: 16px;
	font-weight: 800;
}

.feature-blue .ri-feature-icon {
	background: #dceeff;
	color: #1474d4;
}

.feature-orange .ri-feature-icon {
	background: #ffeadf;
	color: #f26a21;
}

.feature-yellow .ri-feature-icon {
	background: #fff2cf;
	color: #d99a00;
}

.feature-red .ri-feature-icon {
	background: #ffe0e3;
	color: #e5484d;
}

.feature-purple .ri-feature-icon {
	background: #e9ddff;
	color: #7041d8;
}

.feature-green .ri-feature-icon {
	background: #d9f5e5;
	color: #189b59;
}

.ri-community-feature-card h3 {
	margin: 0 0 7px;

	color: #172554;

	font-size: 14px;
	font-weight: 750;
	line-height: 1.3;
}

.ri-community-feature-card p {
	margin: 0;

	color: #718096;

	font-size: 12px;
	line-height: 1.55;
}


/* =========================================================
   TABLET
   ========================================================= */

@media (max-width: 991px) {

	.ri-community-overview {
		padding: 24px 18px 0;
	}

	.ri-community-overview-grid {
		grid-template-columns: 1fr;
	}

	.ri-community-feature-grid {
		grid-template-columns: repeat(2, 1fr);
	}

}


/* =========================================================
   MOBILE
   ========================================================= */

@media (max-width: 600px) {

	.ri-community-about-card,
	.ri-community-stats-card,
	.ri-community-member-features {
		padding: 22px;
	}

	.ri-community-about-card h2 {
		font-size: 24px;
	}

	.ri-community-features-header h2 {
		font-size: 23px;
	}

	.ri-community-feature-grid {
		grid-template-columns: 1fr;
	}

}

/* =========================================================
   REDUCE SPACE AFTER COMMUNITY NAVIGATION
   ========================================================= */

.ri-community-navigation {
	padding-bottom: 10px !important;
}

.ri-community-overview {
	padding-top: 10px !important;
	margin-top: 0 !important;
}

.community-main-content {
	padding-top: 0 !important;
}

.community-content-wrapper {
	padding-top: 0 !important;
	margin-top: 0 !important;
}

.community-content {
	padding-top: 0 !important;
	margin-top: 0 !important;
}

/* =========================================================
   MODERN COMMUNITY SIDEBAR
   ========================================================= */

.ri-community-sidebar-card {
	background: #ffffff;
	border: 1px solid #e7ebf2;
	border-radius: 16px;
	padding: 24px;
	box-shadow: 0 8px 25px rgba(23, 37, 84, .04);
}

.ri-community-sidebar-label {
	display: inline-flex;
	align-items: center;

	padding: 7px 13px;

	background: #eef3ff;
	border-radius: 30px;

	color: #29478f;

	font-size: 11px;
	font-weight: 700;
}

.ri-community-sidebar-card h3 {
	margin: 14px 0 22px;

	color: #172554;

	font-size: 25px;
	font-weight: 750;
	line-height: 1.2;
	letter-spacing: -.5px;
}


/* Stats */

.ri-community-sidebar-stats {
	display: grid;
	grid-template-columns: repeat(3, 1fr);
	gap: 10px;
}

.ri-sidebar-stat {
	min-width: 0;

	padding: 17px 8px;

	text-align: center;

	background: #f7f8fc;
	border-radius: 12px;
}

.ri-sidebar-stat strong {
	display: block;

	color: #273d7d;

	font-size: 23px;
	font-weight: 750;
	line-height: 1.1;
}

.ri-sidebar-stat span {
	display: block;

	margin-top: 7px;

	color: #7b879b;

	font-size: 11px;
}


/* Type */

.ri-community-sidebar-info {
	margin-top: 20px;
	padding-top: 18px;

	border-top: 1px solid #e5e9f0;
}

.ri-community-sidebar-info > div {
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: 15px;
}

.ri-community-sidebar-info strong {
	color: #172554;
	font-size: 13px;
}

.ri-community-sidebar-info span {
	color: #7a8598;
	font-size: 13px;
}


/* Button */

.ri-community-sidebar-action {
	margin-top: 20px;
}

.ri-community-sidebar-action form {
	margin: 0;
}

.ri-community-sidebar-button {
	width: 100%;

	display: flex;
	align-items: center;
	justify-content: center;

	min-height: 50px;
	padding: 12px 18px;

	border: 0;
	border-radius: 10px;

	background: #263b7a;
	color: #ffffff;

	font-size: 13px;
	font-weight: 700;

	text-decoration: none;
	cursor: pointer;

	transition:
		background .2s ease,
		transform .2s ease;
}

.ri-community-sidebar-button:hover {
	background: #1b2f68;
	color: #ffffff;
	text-decoration: none;
	transform: translateY(-1px);
}

.ri-community-sidebar-button.joined {
	background: #edf5ef;
	color: #20804b;
}


/* =========================================================
   MOBILE
   ========================================================= */

@media (max-width: 767px) {

	.ri-community-sidebar-card {
		padding: 20px;
	}

	.ri-community-sidebar-card h3 {
		font-size: 22px;
	}

}

/* =========================================================
   NEW CLUB SINGLE PAGE LAYOUT
   ========================================================= */

.ri-club-overview-layout {
	display: grid;
	grid-template-columns: minmax(0, 1fr) 340px;
	gap: 20px;
	align-items: start;
}


/* Content takes full width of left column */

.ri-club-overview-main {
	min-width: 0;
}


/* Remove duplicate stats card */

.ri-club-overview-main .ri-community-overview-grid {
	display: block;
}

.ri-club-overview-main .ri-community-stats-card {
	display: none;
}


/* Remove unnecessary width restriction */

.ri-club-overview-main .ri-community-overview {
	max-width: none;
	margin: 0;
	padding: 0;
}


/* Sidebar */

.ri-club-overview-sidebar {
	min-width: 0;
}


/* =========================================================
   FULL WIDTH SECTIONS
   ========================================================= */

.ri-club-full-section {
	width: 100%;
	margin-top: 22px;
}


/* =========================================================
   TABLET
   ========================================================= */

@media (max-width: 991px) {

	.ri-club-overview-layout {
		grid-template-columns: 1fr;
	}

	.ri-club-overview-sidebar {
		width: 100%;
	}

}


/* =========================================================
   MOBILE
   ========================================================= */

@media (max-width: 767px) {

	.ri-club-overview-layout {
		gap: 16px;
	}

	.ri-club-full-section {
		margin-top: 16px;
	}

}

/* =========================================================
   CLUB OVERVIEW
   ========================================================= */

.community-overview {
	display: grid;
	grid-template-columns: minmax(0, 1.6fr) minmax(280px, 1fr);
	gap: 28px;
	align-items: stretch;
	margin: 0;
	padding: 0;
}


/* Main About Card */

.community-overview-card,
.community-overview-stats {
	background: #ffffff;
	border: 1px solid #e3e8f0;
	border-radius: 24px;
	padding: 42px 46px;
	box-sizing: border-box;
}


/* About */

.community-overview-card h2 {
	margin: 24px 0 22px;
	font-size: 38px;
	line-height: 1.15;
	color: #12265c;
}

.community-overview-card .community-entry-content {
	margin: 0;
}

.community-overview-card .community-entry-content p {
	margin: 0;
	font-size: 18px;
	line-height: 1.75;
	color: #587092;
}


/* Stats */

.community-overview-stats h3 {
	margin: 22px 0 28px;
	font-size: 30px;
	line-height: 1.2;
	color: #12265c;
}

.community-overview-stat-list {
	display: flex;
	flex-direction: column;
	gap: 18px;
}

.community-overview-stat {
	display: flex;
	align-items: center;
	gap: 18px;
}

.community-stat-icon {
	width: 64px;
	height: 64px;
	flex: 0 0 64px;
	display: flex;
	align-items: center;
	justify-content: center;
	border-radius: 16px;
	background: #eef3ff;
	color: #2459df;
	font-size: 20px;
	font-weight: 700;
}

.community-stat-icon.active {
	background: #e8f8ef;
}

.community-stat-icon.active span {
	width: 20px;
	height: 20px;
	border-radius: 50%;
	background: #18a85b;
	display: block;
}

.community-overview-stat strong {
	display: block;
	font-size: 22px;
	line-height: 1.2;
	color: #12265c;
}

.community-overview-stat > div:last-child span {
	display: block;
	margin-top: 4px;
	font-size: 15px;
	color: #72819a;
}


/* Remove old highlight cards */

.community-overview .community-highlights {
	display: none;
}


/* =========================================================
   MOBILE
   ========================================================= */

@media (max-width: 900px) {

	.community-overview {
		grid-template-columns: 1fr;
		gap: 20px;
	}

	.community-overview-card,
	.community-overview-stats {
		padding: 30px;
	}

	.community-overview-card h2 {
		font-size: 32px;
	}

	.community-overview-stats h3 {
		font-size: 26px;
	}

}


@media (max-width: 600px) {

	.community-overview-card,
	.community-overview-stats {
		padding: 24px;
		border-radius: 18px;
	}

	.community-overview-card h2 {
		font-size: 28px;
	}

	.community-overview-card .community-entry-content p {
		font-size: 16px;
		line-height: 1.65;
	}

}

/* =========================================================
   CLUB OVERVIEW - COMPACT LAYOUT
   ========================================================= */

.community-main-content {
	padding-top: 28px !important;
}


/* Main overview row */

.community-overview {
	display: grid !important;
	grid-template-columns: minmax(0, 1.45fr) minmax(300px, 0.9fr) !important;
	gap: 24px !important;
	align-items: start !important;
}


/* About + Stats cards */

.community-overview-card,
.community-overview-stats {
	padding: 32px 38px !important;
	border-radius: 22px !important;
}


/* About heading */

.community-overview-card h2 {
	margin: 20px 0 18px !important;
	font-size: 34px !important;
	line-height: 1.2 !important;
}


/* About text */

.community-overview-card .community-entry-content p {
	font-size: 17px !important;
	line-height: 1.65 !important;
}


/* Stats heading */

.community-overview-stats h3 {
	margin: 18px 0 22px !important;
	font-size: 28px !important;
	line-height: 1.2 !important;
	
}


/* Stats list */

.community-overview-stat-list {
	gap: 14px !important;
}


/* Individual stat */

.community-overview-stat {
	gap: 14px !important;
}


/* Stat icon */

.community-stat-icon {
	width: 58px !important;
	height: 58px !important;
	flex: 0 0 58px !important;
	border-radius: 15px !important;
}


/* Stat number */

.community-overview-stat strong {
	font-size: 20px !important;
}


/* Stat label */

.community-overview-stat > div:last-child span {
	font-size: 14px !important;
	margin-top: 3px !important;
}


/* =========================================================
   RIGHT SIDEBAR
   ========================================================= */

.community-sidebar-card {
	padding: 32px 36px !important;
	border-radius: 22px !important;
}


/* Sidebar title */

.community-sidebar-header h3 {
	font-size: 30px !important;
	line-height: 1.2 !important;
	margin-bottom: 24px !important;
}


/* Sidebar stats */

.community-sidebar-stats {
	gap: 12px !important;
}

.community-sidebar-stat {
	padding: 18px 10px !important;
}


/* =========================================================
   TABLET
   ========================================================= */

@media (max-width: 1100px) {

	.community-overview {
		grid-template-columns: minmax(0, 1.3fr) minmax(270px, 0.9fr) !important;
	}

	.community-overview-card,
	.community-overview-stats {
		padding: 28px !important;
	}

	.community-overview-card h2 {
		font-size: 30px !important;
	}

	.community-overview-stats h3 {
		font-size: 25px !important;
	}

}


/* =========================================================
   MOBILE
   ========================================================= */

@media (max-width: 900px) {

	.community-overview {
		grid-template-columns: 1fr !important;
		gap: 20px !important;
	}

	.community-overview-stats h3 {
		white-space: normal;
	}

}


@media (max-width: 600px) {

	.community-main-content {
		padding-top: 18px !important;
	}

	.community-overview-card,
	.community-overview-stats,
	.community-sidebar-card {
		padding: 24px !important;
		border-radius: 18px !important;
	}

	.community-overview-card h2 {
		font-size: 27px !important;
	}

	.community-overview-card .community-entry-content p {
		font-size: 16px !important;
	}

}

/* =========================================================
   COMMUNITY MEMBERS - COMPACT DESIGN
   ========================================================= */

.single-community .community-members {
	margin-top: 0 !important;
	padding: 42px 0 !important;
}


/* Header */

.single-community .community-members .section-header {
	display: flex;
	align-items: flex-end;
	justify-content: space-between;
	gap: 30px;
	margin-bottom: 28px !important;
}

.single-community .community-members .section-title {
	margin: 0;
}

.single-community .community-members .section-title h2 {
	margin: 14px 0 8px !important;
}

.single-community .community-members .section-title p {
	margin: 0 !important;
}


/* Member count */

.single-community .community-members .member-count {
	display: flex;
	align-items: center;
	gap: 8px;
	padding: 14px 20px;
	border: 1px solid #e2e7f0;
	border-radius: 16px;
	background: #fff;
	white-space: nowrap;
}

.single-community .community-members .member-count strong {
	font-size: 20px;
	color: #183b87;
}

.single-community .community-members .member-count span {
	font-size: 16px;
	color: #65748b;
}


/* Member cards */

.single-community .community-members-grid {
	display: grid;
	grid-template-columns: repeat(3, minmax(0, 1fr));
	gap: 18px;
}

.single-community .community-member-card {
	display: flex;
	align-items: center;
	gap: 15px;
	padding: 20px;
	background: #fff;
	border: 1px solid #e4e8f0;
	border-radius: 18px;
	transition:
		transform .2s ease,
		box-shadow .2s ease,
		border-color .2s ease;
}

.single-community .community-member-card:hover {
	transform: translateY(-2px);
	box-shadow: 0 10px 28px rgba(20, 40, 80, .08);
	border-color: #d5def0;
}


/* Avatar */

.single-community .community-member-avatar {
	width: 64px;
	height: 64px;
	border-radius: 50%;
	display: block;
	object-fit: cover;
}


/* Member information */

.single-community .community-member-card .member-info h3 {
	margin: 0 0 5px !important;
	font-size: 18px;
	line-height: 1.3;
}

.single-community .community-member-card .member-info h3 a {
	color: #10285f;
	text-decoration: none;
}

.single-community .community-member-card .member-info h3 a:hover {
	color: #2458d6;
}

.single-community .member-role {
	display: block;
	font-size: 14px;
	font-weight: 600;
	color: #2458d6;
}

.single-community .member-joined {
	display: block;
	margin-top: 3px;
	font-size: 13px;
	color: #7a879b;
}


/* Empty state */

.single-community .community-empty-state {
	display: flex;
	align-items: center;
	justify-content: center;
	gap: 18px;
	min-height: 170px;
	padding: 28px 35px;
	background: #fff;
	border: 1px solid #e2e7f0;
	border-radius: 20px;
	text-align: left;
}

.single-community .community-empty-state .empty-icon {
	width: 64px;
	height: 64px;
	display: flex;
	align-items: center;
	justify-content: center;
	flex: 0 0 64px;
	border-radius: 18px;
	background: #eef4ff;
	font-size: 30px;
}

.single-community .community-empty-state h3 {
	margin: 0 0 5px !important;
	font-size: 22px;
	color: #10285f;
}

.single-community .community-empty-state p {
	margin: 0 !important;
	color: #71809a;
	font-size: 15px;
}


/* =========================================================
   RESPONSIVE
   ========================================================= */

@media (max-width: 900px) {

	.single-community .community-members-grid {
		grid-template-columns: repeat(2, minmax(0, 1fr));
	}

}

@media (max-width: 600px) {

	.single-community .community-members {
		padding: 30px 0 !important;
	}

	.single-community .community-members .section-header {
		align-items: flex-start;
		flex-direction: column;
		gap: 18px;
	}

	.single-community .community-members-grid {
		grid-template-columns: 1fr;
	}

	.single-community .community-empty-state {
		min-height: 140px;
		padding: 24px;
	}

}

/* =========================================================
   CHAT BOXES
   ========================================================= */

.ri-community-chat-boxes {
	margin-top: 28px;
	padding: 34px;
	background: #ffffff;
	border: 1px solid #e5eaf2;
	border-radius: 22px;
}


/* Header */

.ri-chat-boxes-header {
	display: flex;
	align-items: flex-end;
	justify-content: space-between;
	gap: 25px;
	margin-bottom: 25px;
}

.ri-chat-boxes-header h2 {
	margin: 14px 0 8px;
	color: #12265c;
	font-size: 30px;
	line-height: 1.2;
}

.ri-chat-boxes-header p {
	margin: 0;
	color: #71809a;
	font-size: 14px;
	line-height: 1.6;
}

.ri-chat-view-all {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	min-height: 42px;
	padding: 0 17px;
	border-radius: 10px;
	background: #ff681f;
	color: #ffffff;
	font-size: 12px;
	font-weight: 700;
	text-decoration: none;
	white-space: nowrap;
}

.ri-chat-view-all:hover {
	background: #e95712;
	color: #ffffff;
	text-decoration: none;
}


/* Grid */

.ri-chat-box-grid {
	display: grid;
	grid-template-columns: repeat(3, minmax(0, 1fr));
	gap: 16px;
}


/* Card */

.ri-chat-box-card {
	padding: 20px;
	background: #f8faff;
	border: 1px solid #e6ebf3;
	border-radius: 16px;
	transition:
		transform .2s ease,
		box-shadow .2s ease,
		border-color .2s ease;
}

.ri-chat-box-card:hover {
	transform: translateY(-3px);
	background: #ffffff;
	border-color: #d7e0f0;
	box-shadow: 0 12px 28px rgba(20, 40, 80, .07);
}


/* Author */

.ri-chat-box-top {
	display: flex;
	align-items: center;
	gap: 11px;
	margin-bottom: 17px;
}

.ri-chat-avatar {
	display: block;
	width: 42px;
	height: 42px;
	border-radius: 50%;
}

.ri-chat-box-author strong {
	display: block;
	color: #172554;
	font-size: 12px;
	font-weight: 700;
}

.ri-chat-box-author span {
	display: block;
	margin-top: 3px;
	color: #8a96a8;
	font-size: 10px;
}


/* Title */

.ri-chat-box-card h3 {
	margin: 0 0 9px;
	font-size: 16px;
	line-height: 1.4;
}

.ri-chat-box-card h3 a {
	color: #173575;
	text-decoration: none;
}

.ri-chat-box-card h3 a:hover {
	color: #315bea;
}


/* Description */

.ri-chat-box-card > p {
	margin: 0;
	color: #6d7c94;
	font-size: 12px;
	line-height: 1.6;
}


/* Footer */

.ri-chat-box-footer {
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: 10px;
	margin-top: 18px;
	padding-top: 14px;
	border-top: 1px solid #e5eaf2;
}

.ri-chat-replies {
	color: #7a879b;
	font-size: 10px;
}

.ri-chat-replies > span {
	margin-right: 3px;
}

.ri-chat-open {
	color: #315bea;
	font-size: 11px;
	font-weight: 700;
	text-decoration: none;
}

.ri-chat-open:hover {
	color: #173575;
}


/* View all */

.ri-chat-boxes-more {
	margin-top: 20px;
	text-align: center;
}

.ri-chat-boxes-more a {
	color: #315bea;
	font-size: 12px;
	font-weight: 700;
	text-decoration: none;
}


/* =========================================================
   EMPTY STATE
   ========================================================= */

.ri-chat-empty {
	display: flex;
	align-items: center;
	gap: 18px;
	padding: 24px;
	background: #f8faff;
	border: 1px dashed #d8e0ed;
	border-radius: 16px;
}

.ri-chat-empty-icon {
	width: 52px;
	height: 52px;
	flex: 0 0 52px;

	display: flex;
	align-items: center;
	justify-content: center;

	border-radius: 14px;
	background: #eaf0ff;

	font-size: 23px;
}

.ri-chat-empty-content {
	flex: 1;
}

.ri-chat-empty-content h3 {
	margin: 0 0 5px;
	color: #172554;
	font-size: 17px;
}

.ri-chat-empty-content p {
	margin: 0;
	color: #748198;
	font-size: 12px;
	line-height: 1.5;
}

.ri-chat-empty-button {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	min-height: 42px;
	padding: 0 15px;
	border-radius: 9px;
	background: #173a88;
	color: #ffffff;
	font-size: 11px;
	font-weight: 700;
	text-decoration: none;
	white-space: nowrap;
}

.ri-chat-empty-button:hover {
	background: #102d6d;
	color: #ffffff;
	text-decoration: none;
}


/* =========================================================
   TABLET
   ========================================================= */

@media (max-width: 900px) {

	.ri-chat-box-grid {
		grid-template-columns: repeat(2, minmax(0, 1fr));
	}

}


/* =========================================================
   MOBILE
   ========================================================= */

@media (max-width: 600px) {

	.ri-community-chat-boxes {
		padding: 24px 20px;
		border-radius: 18px;
	}

	.ri-chat-boxes-header {
		align-items: flex-start;
		flex-direction: column;
	}

	.ri-chat-boxes-header h2 {
		font-size: 25px;
	}

	.ri-chat-view-all {
		width: 100%;
	}

	.ri-chat-box-grid {
		grid-template-columns: 1fr;
	}

	.ri-chat-empty {
		align-items: flex-start;
		flex-direction: column;
	}

	.ri-chat-empty-button {
		width: 100%;
	}

}


/* =========================================================
   COMMUNITY - TRENDING
   ========================================================= */

.single-community .ri-community-trending {
	margin-top: 34px;
	padding: 0;
}

.single-community .ri-trending-header {
	display: flex;
	align-items: flex-end;
	justify-content: space-between;
	gap: 30px;
	margin-bottom: 18px;
}

.single-community .ri-trending-header h2 {
	margin: 5px 0 5px;
	font-size: 27px;
	line-height: 1.2;
	color: #101828;
}

.single-community .ri-trending-header p {
	margin: 0;
	font-size: 14px;
	color: #667085;
}

.single-community .ri-trending-view-all {
	flex-shrink: 0;
	font-size: 14px;
	font-weight: 600;
	color: #050b72;
	text-decoration: none;
}

.single-community .ri-trending-view-all:hover {
	text-decoration: underline;
}

/* List */

.single-community .ri-trending-list {
	display: grid;
	gap: 12px;
}

/* Card */

.single-community .ri-trending-card {
	display: flex;
	align-items: flex-start;
	gap: 16px;
	padding: 18px 20px;
	background: #fff;
	border: 1px solid #eaecf0;
	border-radius: 14px;
	box-shadow: 0 4px 18px rgba(16, 24, 40, 0.04);
	transition:
		transform 0.25s ease,
		box-shadow 0.25s ease,
		border-color 0.25s ease;
}

.single-community .ri-trending-card:hover {
	transform: translateY(-2px);
	box-shadow: 0 8px 24px rgba(16, 24, 40, 0.08);
	border-color: #d0d5dd;
}

/* Rank */

.single-community .ri-trending-rank {
	width: 30px;
	height: 30px;
	flex: 0 0 30px;
	display: flex;
	align-items: center;
	justify-content: center;
	border-radius: 50%;
	background: #f2f4f7;
	color: #475467;
	font-size: 13px;
	font-weight: 700;
}

/* Avatar */

.single-community .ri-trending-avatar {
	flex: 0 0 48px;
}

.single-community .ri-trending-avatar-img {
	width: 48px;
	height: 48px;
	border-radius: 50%;
	object-fit: cover;
}

/* Content */

.single-community .ri-trending-content {
	flex: 1;
	min-width: 0;
}

.single-community .ri-trending-meta {
	display: flex;
	align-items: center;
	gap: 7px;
	margin-bottom: 5px;
	font-size: 12px;
	color: #98a2b3;
}

.single-community .ri-trending-meta strong {
	color: #475467;
	font-weight: 600;
}

.single-community .ri-trending-content h3 {
	margin: 0 0 5px;
	font-size: 17px;
	line-height: 1.4;
}

.single-community .ri-trending-content h3 a {
	color: #101828;
	text-decoration: none;
}

.single-community .ri-trending-content h3 a:hover {
	color: #050b72;
}

.single-community .ri-trending-content p {
	margin: 0 0 10px;
	font-size: 13px;
	line-height: 1.6;
	color: #667085;
}

/* Footer */

.single-community .ri-trending-footer {
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: 15px;
}

.single-community .ri-trending-replies {
	font-size: 12px;
	color: #667085;
}

.single-community .ri-trending-open {
	font-size: 12px;
	font-weight: 600;
	color: #050b72;
	text-decoration: none;
}

.single-community .ri-trending-open:hover {
	text-decoration: underline;
}

/* Empty */

.single-community .ri-trending-empty {
	display: flex;
	align-items: center;
	gap: 15px;
	padding: 22px;
	background: #f9fafb;
	border: 1px dashed #d0d5dd;
	border-radius: 14px;
}

.single-community .ri-trending-empty-icon {
	width: 42px;
	height: 42px;
	display: flex;
	align-items: center;
	justify-content: center;
	border-radius: 12px;
	background: #fff;
	font-size: 20px;
}

.single-community .ri-trending-empty h3 {
	margin: 0 0 4px;
	font-size: 15px;
	color: #101828;
}

.single-community .ri-trending-empty p {
	margin: 0;
	font-size: 13px;
	color: #667085;
}

/* Tablet */

@media (max-width: 767px) {

	.single-community .ri-trending-header {
		align-items: flex-start;
		flex-direction: column;
		gap: 10px;
	}

	.single-community .ri-trending-header h2 {
		font-size: 23px;
	}

	.single-community .ri-trending-card {
		padding: 15px;
		gap: 10px;
	}

	.single-community .ri-trending-rank {
		width: 26px;
		height: 26px;
		flex-basis: 26px;
		font-size: 11px;
	}

	.single-community .ri-trending-avatar {
		flex-basis: 40px;
	}

	.single-community .ri-trending-avatar-img {
		width: 40px;
		height: 40px;
	}

	.single-community .ri-trending-content h3 {
		font-size: 15px;
	}

	.single-community .ri-trending-footer {
		align-items: flex-start;
		flex-direction: column;
		gap: 5px;
	}
}

/* =========================================================
   WRITERS CLUB - WRITING STYLES
   ========================================================= */

.single-community .ri-writing-styles {
	margin-top: 36px;
}

.single-community .ri-writing-styles-header {
	margin-bottom: 20px;
}

.single-community .ri-writing-styles-header h2 {
	margin: 6px 0 6px;
	font-size: 28px;
	line-height: 1.2;
	color: #101828;
}

.single-community .ri-writing-styles-header p {
	margin: 0;
	max-width: 650px;
	font-size: 14px;
	line-height: 1.6;
	color: #667085;
}

/* Grid */

.single-community .ri-writing-style-grid {
	display: grid;
	grid-template-columns: repeat(4, 1fr);
	gap: 16px;
}

/* Card */

.single-community .ri-writing-style-card {
	position: relative;
	display: flex;
	flex-direction: column;
	min-height: 280px;
	padding: 22px;
	background: #fff;
	border: 1px solid #eaecf0;
	border-radius: 18px;
	text-decoration: none;
	overflow: hidden;
	box-shadow: 0 5px 20px rgba(16, 24, 40, 0.04);

	transition:
		transform 0.25s ease,
		box-shadow 0.25s ease,
		border-color 0.25s ease;
}

.single-community .ri-writing-style-card:hover {
	transform: translateY(-4px);
	box-shadow: 0 12px 30px rgba(16, 24, 40, 0.09);
	border-color: #d0d5dd;
}

/* Icon */

.single-community .ri-writing-style-icon {
	width: 58px;
	height: 58px;
	display: flex;
	align-items: center;
	justify-content: center;
	margin-bottom: 22px;
	border-radius: 16px;
	font-size: 27px;
}

.single-community .ri-writing-critical .ri-writing-style-icon {
	background: #eef4ff;
}

.single-community .ri-writing-inspirational .ri-writing-style-icon {
	background: #fff4e8;
}

.single-community .ri-writing-story .ri-writing-style-icon {
	background: #edf9f1;
}

.single-community .ri-writing-satirical .ri-writing-style-icon {
	background: #f5efff;
}

/* Content */

.single-community .ri-writing-style-content {
	display: flex;
	flex-direction: column;
	flex: 1;
}

.single-community .ri-writing-style-number {
	margin-bottom: 5px;
	font-size: 11px;
	font-weight: 700;
	letter-spacing: 1px;
	color: #98a2b3;
}

.single-community .ri-writing-style-content h3 {
	margin: 0 0 9px;
	font-size: 20px;
	line-height: 1.3;
	color: #101828;
}

.single-community .ri-writing-style-content p {
	margin: 0;
	font-size: 13px;
	line-height: 1.65;
	color: #667085;
}

.single-community .ri-writing-style-link {
	margin-top: auto;
	padding-top: 20px;
	font-size: 13px;
	font-weight: 700;
	color: #24346e;
}

/* Individual accents */

.single-community .ri-writing-critical:hover .ri-writing-style-link {
	color: #3159c7;
}

.single-community .ri-writing-inspirational:hover .ri-writing-style-link {
	color: #ec222a;
}

.single-community .ri-writing-story:hover .ri-writing-style-link {
	color: #16834b;
}

.single-community .ri-writing-satirical:hover .ri-writing-style-link {
	color: #7045b5;
}

/* Tablet */

@media (max-width: 1100px) {

	.single-community .ri-writing-style-grid {
		grid-template-columns: repeat(2, 1fr);
	}

}

/* Mobile */

@media (max-width: 767px) {

	.single-community .ri-writing-styles {
		margin-top: 28px;
	}

	.single-community .ri-writing-styles-header h2 {
		font-size: 23px;
	}

	.single-community .ri-writing-style-grid {
		grid-template-columns: 1fr;
		gap: 12px;
	}

	.single-community .ri-writing-style-card {
		min-height: 0;
		padding: 18px;
	}

	.single-community .ri-writing-style-icon {
		width: 52px;
		height: 52px;
		margin-bottom: 16px;
	}

}

/* =========================================================
   WRITERS CLUB - WRITING STYLES
========================================================= */

.single-community .ri-writing-styles {
	margin-top: 36px;
}

.single-community .ri-writing-styles-header {
	margin-bottom: 22px;
}

.single-community .ri-writing-styles-header h2 {
	margin: 6px 0 7px;
	font-size: 30px;
	line-height: 1.2;
	font-weight: 700;
	color: #101828;
}

.single-community .ri-writing-styles-header p {
	margin: 0;
	max-width: 650px;
	font-size: 14px;
	line-height: 1.65;
	color: #667085;
}


/* Grid */

.single-community .ri-writing-style-grid {
	display: grid;
	grid-template-columns: repeat(4, 1fr);
	gap: 16px;
}


/* Card */

.single-community .ri-writing-style-card {
	position: relative;
	display: flex;
	flex-direction: column;
	min-height: 280px;
	padding: 22px;
	background: #ffffff;
	border: 1px solid #eaecf0;
	border-radius: 18px;
	text-decoration: none;
	overflow: hidden;

	box-shadow: 0 5px 20px rgba(16, 24, 40, 0.04);

	transition:
		transform 0.25s ease,
		box-shadow 0.25s ease,
		border-color 0.25s ease;
}


/* Top accent */

.single-community .ri-writing-style-card::before {
	content: "";
	position: absolute;
	top: 0;
	left: 0;
	right: 0;
	height: 3px;
	opacity: 0;
	transition: opacity 0.25s ease;
}

.single-community .ri-writing-critical::before {
	background: #3159c7;
}

.single-community .ri-writing-inspirational::before {
	background: #ec222a;
}

.single-community .ri-writing-story::before {
	background: #16834b;
}

.single-community .ri-writing-satirical::before {
	background: #7045b5;
}


.single-community .ri-writing-style-card:hover {
	transform: translateY(-4px);
	box-shadow: 0 14px 32px rgba(16, 24, 40, 0.09);
	border-color: #d0d5dd;
}

.single-community .ri-writing-style-card:hover::before {
	opacity: 1;
}


/* Icon */

.single-community .ri-writing-style-icon {
	width: 58px;
	height: 58px;

	display: flex;
	align-items: center;
	justify-content: center;

	margin-bottom: 22px;

	border-radius: 16px;

	font-size: 27px;
}

.single-community .ri-writing-critical .ri-writing-style-icon {
	background: #eef4ff;
}

.single-community .ri-writing-inspirational .ri-writing-style-icon {
	background: #fff4e8;
}

.single-community .ri-writing-story .ri-writing-style-icon {
	background: #edf9f1;
}

.single-community .ri-writing-satirical .ri-writing-style-icon {
	background: #f5efff;
}


/* Content */

.single-community .ri-writing-style-content {
	display: flex;
	flex-direction: column;
	flex: 1;
}

.single-community .ri-writing-style-number {
	margin-bottom: 5px;

	font-size: 11px;
	font-weight: 700;
	letter-spacing: 1px;

	color: #98a2b3;
}

.single-community .ri-writing-style-content h3 {
	margin: 0 0 9px;

	font-size: 20px;
	line-height: 1.3;
	font-weight: 700;

	color: #101828;
}

.single-community .ri-writing-style-content p {
	margin: 0;

	font-size: 13px;
	line-height: 1.65;

	color: #667085;
}


/* Link */

.single-community .ri-writing-style-link {
	margin-top: auto;
	padding-top: 20px;

	font-size: 13px;
	font-weight: 700;

	color: #24346e;

	transition: color 0.2s ease;
}

.single-community .ri-writing-critical:hover .ri-writing-style-link {
	color: #3159c7;
}

.single-community .ri-writing-inspirational:hover .ri-writing-style-link {
	color: #ec222a;
}

.single-community .ri-writing-story:hover .ri-writing-style-link {
	color: #16834b;
}

.single-community .ri-writing-satirical:hover .ri-writing-style-link {
	color: #7045b5;
}


/* =========================================================
   TABLET
========================================================= */

@media (max-width: 1100px) {

	.single-community .ri-writing-style-grid {
		grid-template-columns: repeat(2, 1fr);
	}

}


/* =========================================================
   MOBILE
========================================================= */

@media (max-width: 767px) {

	.single-community .ri-writing-styles {
		margin-top: 28px;
	}

	.single-community .ri-writing-styles-header {
		margin-bottom: 18px;
	}

	.single-community .ri-writing-styles-header h2 {
		font-size: 23px;
	}

	.single-community .ri-writing-styles-header p {
		font-size: 13px;
	}

	.single-community .ri-writing-style-grid {
		grid-template-columns: 1fr;
		gap: 12px;
	}

	.single-community .ri-writing-style-card {
		min-height: 0;
		padding: 18px;
	}

	.single-community .ri-writing-style-icon {
		width: 52px;
		height: 52px;
		margin-bottom: 16px;
	}

	.single-community .ri-writing-style-content h3 {
		font-size: 18px;
	}

}