.coinshare-filter {





	margin-bottom: 24px;





	padding: 18px;





	border: 1px solid #e5e7eb;





	background: #ffffff;





}





.coinshare-filter-row {





	display: grid;





	grid-template-columns: 2fr 1fr 180px;





	gap: 14px;





	align-items: end;





}





.coinshare-filter-field label {





	display: block;





	margin-bottom: 8px;





	font-size: 13px;





	font-weight: 600;





	color: #1f2937;





}





.coinshare-filter-field input,





.coinshare-filter-field select {





	width: 100%;





	min-height: 46px;





	border: 1px solid #d1d5db;





	background: #ffffff;





	border-radius: 6px;





	padding: 10px 12px;





	font-size: 16px;





	color: #111827;





}





.coinshare-filter-field input:focus,





.coinshare-filter-field select:focus {





	outline: none;





	border-color: #fb923c;





	box-shadow: 0 0 0 3px rgba(251, 146, 60, 0.18);





}





.coinshare-filter-action button {





	width: 100%;





	min-height: 46px;





	border: none;





	border-radius: 999px;





	background: linear-gradient(135deg, #f26522, #ff8a4c);





	color: #ffffff;





	font-size: 18px;





	font-weight: 600;





	cursor: pointer;





}





.coinshare-filter-action button:hover {





	filter: brightness(0.97);





}





.campaign-card {





	background: #ffffff;





	border: 1px solid #eef2f7;





	border-radius: 16px;





	overflow: hidden;





	box-shadow: 0 8px 20px rgba(15, 23, 42, 0.08);





	height: 100%;





	max-width: 100%;





	margin-inline: auto;





}





.card-img-wrapper {





	display: block;





	position: relative;





}





.coinshare-img {





	width: 100%;





	height: 220px;





	object-fit: cover;





	display: block;





}





.coinshare-img-placeholder {





	display: flex;





	align-items: center;





	justify-content: center;





	background: #e5e7eb;





	color: #6b7280;





	font-weight: 600;





	text-transform: uppercase;





	letter-spacing: 0.06em;





	font-size: 12px;





}





.category-badge {





	position: absolute;





	top: 14px;





	left: 14px;





	padding: 7px 12px;





	border-radius: 999px;





	background: rgba(15, 23, 42, 0.8);





	color: #ffffff;





	font-size: 12px;





	font-weight: 600;





	line-height: 1;





}





.campaign-title-link {





	color: #111827;





	text-decoration: none;





}





.campaign-title-link:hover {





	color: #f26522;





}





.campaign-card .progress {





	width: 100%;





	height: 8px;





	border-radius: 999px;





	background: #e5e7eb;





	overflow: hidden;





	margin-top: 14px;





}





.campaign-card .progress-bar {





	height: 100%;





	width: 0%;





	border-radius: 999px;





	background: linear-gradient(90deg, #f26522 0%, #ff8a4c 100%);





}





.campaign-raised {





	color: #f26522;





	line-height: 1.2;





}





.coinshare-campaigns-wrap.container {





	width: 100%;





	margin-inline: auto;





}





.coinshare-campaigns-wrap .coinshare-img {





	width: 100% !important;





	height: 220px !important;





	object-fit: cover !important;





}





.coinshare-campaigns-wrap .campaign-card {





	width: 100%;





	height: 100%;





}





@media (max-width: 1024px) {





	.coinshare-filter-row {





		grid-template-columns: 1fr 1fr 160px;





	}





}





.coinshare-detail {





	margin-top: 22px;





	margin-bottom: 22px;





}





.coinshare-front-msg {





	margin-bottom: 12px;





	padding: 10px 12px;





	border: 1px solid #fed7aa;





	background: #fff7ed;





	color: #9a3412;





	border-radius: 10px;





}





.coinshare-detail-grid {





	display: grid;





	grid-template-columns: minmax(0, 1fr) 320px;





	gap: 24px;





	align-items: start;





}





.coinshare-hero img,





.coinshare-hero-placeholder {





	width: 100%;





	height: 360px;





	object-fit: cover;





	border-radius: 10px;





	display: block;





}





.coinshare-hero-placeholder {





	background: #e5e7eb;





	color: #6b7280;





	display: flex;





	align-items: center;





	justify-content: center;





	text-transform: uppercase;





	font-size: 13px;





	letter-spacing: 0.05em;





}





.coinshare-meta {





	margin-top: 14px;





	font-size: 14px;





	color: #6b7280;





}





.coinshare-heading {





	margin: 8px 0 6px;





	font-size: 2.05rem;





	line-height: 1.2;





	color: #111827;





}





.coinshare-subtext {





	margin: 0 0 16px;





	color: #4b5563;





	font-size: 17px;





}





.coinshare-panel {





	margin-top: 14px;





	background: #fff;





	border: 1px solid #e5e7eb;





	border-radius: 12px;





	padding: 16px;





}





.coinshare-panel h3 {





	margin: 0 0 10px;





	font-size: 1.85rem;





}





.coinshare-story p {





	margin: 0 0 8px;





	color: #374151;





}





.coinshare-update-item {





	border: 1px solid #e5e7eb;





	border-radius: 12px;





	padding: 12px;





	margin-top: 10px;





}





.coinshare-update-date {





	font-size: 13px;





	color: #6b7280;





}





.coinshare-update-title {





	margin-top: 4px;





	font-weight: 700;





	color: #111827;





}





.coinshare-update-desc {





	margin-top: 6px;





	color: #4b5563;





}





.coinshare-empty {





	color: #6b7280;





	margin: 0;





}





.coinshare-donate {





	background: #fff;





	border: 1px solid #e5e7eb;





	border-radius: 14px;





	padding: 16px;





	position: sticky;





	top: 20px;





}





.coinshare-donate-amount {





	font-size: 33px;





	font-weight: 700;





	color: #111827;





}





.coinshare-donate-sub {





	display: flex;





	justify-content: space-between;





	gap: 12px;





	margin-top: 3px;





	margin-bottom: 10px;





	font-size: 13px;





	color: #6b7280;





}





.coinshare-donate .progress {





	width: 100%;





	height: 8px;





	border-radius: 999px;





	background: #e5e7eb;





	overflow: hidden;





}





.coinshare-donate .progress-bar {





	height: 100%;





	border-radius: 999px;





	background: linear-gradient(90deg, #f26522 0%, #ff8a4c 100%);





}





.coinshare-suggested-grid {





	margin-top: 12px;





	display: grid;





	grid-template-columns: 1fr 1fr;





	gap: 10px;





}





.coinshare-suggested-btn {





	min-height: 40px;





	border: 1px solid #0f4f74;





	background: #fff;





	border-radius: 999px;





	color: #0f4f74;





	font-weight: 600;





	cursor: pointer;





}





.coinshare-donate-form {





	margin-top: 12px;





}





.coinshare-donate-form label {





	display: block;





	margin-top: 8px;





	margin-bottom: 6px;





	font-size: 14px;





	color: #111827;





}





.coinshare-amount-input {





	display: grid;





	grid-template-columns: 38px minmax(0, 1fr);





	border: 1px solid #9ca3af;





	border-radius: 6px;





	overflow: hidden;





}





.coinshare-amount-input span {





	display: flex;





	align-items: center;





	justify-content: center;





	color: #111827;





	background: #fff;





}





.coinshare-donate-form input {





	width: 100%;





	min-height: 42px;





	border: 1px solid #9ca3af;





	border-radius: 6px;





	padding: 10px 12px;





}





.coinshare-amount-input input {





	border: 0;





	border-left: 1px solid #d1d5db;





	border-radius: 0;





}





.coinshare-donate-btn {





	width: 100%;





	border: 0;





	min-height: 46px;





	border-radius: 999px;





	margin-top: 12px;





	color: #fff;





	font-size: 1.65rem;





	font-weight: 700;





	background: linear-gradient(135deg, #f26522, #ff8a4c);





	cursor: pointer;





}





.coinshare-share-row {





	margin-top: 12px;





	display: grid;





	grid-template-columns: 1fr 1fr;





	gap: 10px;





}





.coinshare-share-btn {





	text-align: center;





	min-height: 40px;





	display: inline-flex;





	align-items: center;





	justify-content: center;





	border: 1px solid #0f4f74;





	border-radius: 999px;





	background: #fff;





	color: #0f4f74;





	font-weight: 600;





	text-decoration: none;





}





.coinshare-safe-note {





	border-top: 1px solid #e5e7eb;





	margin-top: 14px;





	padding-top: 12px;





	font-size: 13px;





	color: #6b7280;





}





.coinshare-comments-wrap .comment-respond {





	margin-top: 12px;





}





.coinshare-comments-wrap .comment-form-comment textarea {





	width: 100%;





	min-height: 80px;





	border: 1px solid #d1d5db;





	border-radius: 8px;





	padding: 10px;





}





.coinshare-comments-wrap .submit {





	border: 0;





	min-height: 38px;





	padding: 0 18px;





	border-radius: 999px;





	color: #fff;





	background: linear-gradient(135deg, #f26522, #ff8a4c);





}





@media (max-width: 1024px) {





	.coinshare-detail-grid {





		grid-template-columns: 1fr;





	}





	.coinshare-donate {





		position: static;





	}





}





.coinshare-detail-v2 {





	max-width: 1280px;





	margin: 24px auto;





	padding: 0 16px;





}





.coinshare-detail-v2 .e-con-inner {





	display: grid;





	grid-template-columns: minmax(0, 1fr) 340px;





	gap: 24px;





	align-items: start;





	max-width: 1280px !important;





	margin: 0 auto !important;





}





.coinshare-detail-v2 .elementor-heading-title,





.coinshare-detail-v2 h1,





.coinshare-detail-v2 h2,





.coinshare-detail-v2 h3 {





	color: #0f172a !important;





}





.coinshare-detail-v2 img {





	max-width: 100%;





	display: block;





}





.coinshare-left-col>.elementor-widget-image img,





.coinshare-left-col .coinshare-hero-placeholder {





	width: 100%;





	height: 390px;





	border-radius: 12px;





	object-fit: cover;





}





.coinshare-left-col .coinshare-hero-placeholder {





	background: #e5e7eb;





	color: #6b7280;





	display: flex;





	align-items: center;





	justify-content: center;





	text-transform: uppercase;





}





.coinshare-left-col .elementor-heading-title {





	margin: 0;





	font-size: 3rem;





	line-height: 1.2;





	color: #111827 !important;





	font-weight: 700 !important;





}





.coinshare-left-col .elementor-widget-text-editor p {





	margin: 0;





	color: #4b5563 !important;





}





.coinshare-left-col>.elementor-widget,





.coinshare-left-col>.e-child {





	margin-top: 12px;





}





.coinshare-card-block {





	border: 1px solid #e5e7eb;





	border-radius: 12px;





	padding: 16px;





	background: #fff;





	box-shadow: 0 2px 8px rgba(15, 23, 42, 0.04);





}





.coinshare-card-block .elementor-heading-title {





	font-size: 2.1rem;





	margin-bottom: 8px;





	color: #111827 !important;





}





.coinshare-update-row {





	border: 1px solid #e5e7eb;





	border-radius: 12px;





	padding: 12px;





	margin-top: 10px;





	background: #fff;





}





.coinshare-right-col {





	position: sticky;





	top: 16px;





}





.coinshare-donate-panel {





	border: 1px solid #e5e7eb;





	border-radius: 14px;





	background: #fff;





	padding: 16px;





	box-shadow: 0 6px 18px rgba(15, 23, 42, 0.08);





}





.coinshare-donate-panel .elementor-heading-title {





	font-size: 2.15rem;





	margin: 0;





	color: #111827 !important;





}





.coinshare-raised-row {





	display: flex;





	justify-content: space-between;





	gap: 10px;





	margin: 6px 0 10px;





}





.coinshare-raised-row p {





	font-size: 14px;





	color: #6b7280;





}





.coinshare-donate-panel .elementor-progress-wrapper {





	width: 100%;





	height: 8px;





	border-radius: 999px;





	background: #e5e7eb;





	overflow: hidden;





}





.coinshare-donate-panel .elementor-progress-bar {





	height: 100%;





	background: linear-gradient(90deg, #f26522, #ff8a4c);





}





.coinshare-detail-v2 .coinshare-suggested-grid {





	margin-top: 12px;





	display: grid;





	grid-template-columns: 1fr 1fr;





	gap: 10px;





}





.coinshare-detail-v2 .coinshare-suggested-btn {





	min-height: 40px;





	border: 1px solid #0f4f74;





	border-radius: 999px;





	background: #fff;





	color: #0f4f74;





	font-weight: 600;





	cursor: pointer;





}





.coinshare-detail-v2 .coinshare-suggested-btn:hover {





	background: #f8fafc;





}





.coinshare-detail-v2 .coinshare-donate-form {





	margin-top: 12px;





}





.coinshare-detail-v2 .coinshare-donate-form label {





	display: block;





	margin-top: 8px;





	margin-bottom: 6px;





	font-size: 14px;





}





.coinshare-detail-v2 .coinshare-amount-input {





	display: grid;





	grid-template-columns: 38px minmax(0, 1fr);





	border: 1px solid #9ca3af;





	border-radius: 6px;





	overflow: hidden;





}





.coinshare-detail-v2 .coinshare-amount-input span {





	display: flex;





	align-items: center;





	justify-content: center;





}





.coinshare-detail-v2 .coinshare-donate-form input {





	width: 100%;





	min-height: 42px;





	border: 1px solid #9ca3af !important;





	border-radius: 6px;





	padding: 10px 12px;





	background: #fff !important;





	color: #111827 !important;





}





.coinshare-detail-v2 .coinshare-amount-input input {





	border: 0;





	border-left: 1px solid #d1d5db;





	border-radius: 0;





}





.coinshare-detail-v2 .coinshare-donate-btn {





	width: 100%;





	min-height: 46px;





	border: 0;





	border-radius: 999px;





	color: #fff;





	font-weight: 700;





	font-size: 1.35rem;





	margin-top: 12px;





	background: linear-gradient(135deg, #f26522, #ff8a4c);





}





.coinshare-detail-v2 .coinshare-share-row {





	margin-top: 12px;





	display: grid;





	grid-template-columns: 1fr 1fr;





	gap: 10px;





}





.coinshare-detail-v2 .coinshare-share-btn {





	min-height: 40px;





	border: 1px solid #0f4f74;





	border-radius: 999px;





	background: #fff;





	color: #0f4f74;





	text-decoration: none;





	display: inline-flex;





	align-items: center;





	justify-content: center;





	font-weight: 600;





}





.coinshare-detail-v2 .coinshare-comments-wrap .comment-respond {





	margin-top: 14px;





}





.coinshare-detail-v2 .coinshare-comments-wrap .logged-in-as,





.coinshare-detail-v2 .coinshare-comments-wrap .comment-notes,





.coinshare-detail-v2 .coinshare-comments-wrap .comment-form-cookies-consent {





	display: none !important;





}





.coinshare-detail-v2 .coinshare-comments-wrap .comment-reply-title {





	font-size: 1.25rem !important;





	margin-bottom: 8px !important;





}





.coinshare-detail-v2 .coinshare-safe-note {





	margin-top: 12px;





	border-top: 1px solid #e5e7eb;





	padding-top: 10px;





	color: #6b7280;





	font-size: 13px;





}





.coinshare-detail-v2 .coinshare-comments-wrap .comment-form-comment textarea {





	width: 100%;





	min-height: 85px;





	border: 1px solid #d1d5db;





	border-radius: 8px;





	padding: 10px;





}





.coinshare-detail-v2 .coinshare-comments-wrap .submit {





	border: 0;





	border-radius: 999px;





	min-height: 38px;





	padding: 0 18px;





	color: #fff;





	background: linear-gradient(135deg, #f26522, #ff8a4c);





}





@media (max-width: 1024px) {





	.coinshare-detail-v2 .e-con-inner {





		grid-template-columns: 1fr;





	}





	.coinshare-right-col {





		position: static;





	}





}





/* ==========================================================































































































































































































































































































































































































































































































































































































   CoinShare v1.2 — Additional frontend styles (option4 design)































































































































































































































































































































































































































































































































































































   ========================================================== */





:root {





	--cs-blue: #0056a4;





	--cs-blue-light: #e6f0fa;





	--cs-orange: #f26522;





	--cs-orange-light: #fef0ea;





	--cs-white: #ffffff;





	--cs-dark: #1e293b;





	--cs-gray: #64748b;





}





/* ---- Hero section ---- */





.hero-section {





	position: relative;





	color: #fff;





	/* padding: 140px 0 100px;































































































































































































































































































































































































































































































































































































    background-color: var(--cs-blue); */





	overflow: hidden;





}





.hero-section .container {

	position: relative;

	z-index: 20;

}





.hero-badge {





	background: var(--cs-orange-light);





	color: var(--cs-orange);





	font-weight: 700;





	padding: 8px 16px;





	border-radius: 30px;





	font-size: .9rem;





	display: inline-block;





	margin-bottom: 20px;





}





.hero-title {





	font-size: 3.5rem;





	font-weight: 800;





	line-height: 1.1;





	margin-bottom: 24px;





	color: #fff;





}





.hero-title span {





	background: linear-gradient(120deg, #fff, var(--cs-orange));





	-webkit-background-clip: text;





	-webkit-text-fill-color: transparent;





}





.hero-subtitle {

	font-size: 1.2rem;

	color: rgba(255, 255, 255, .9);

	margin-bottom: 40px;

}





.hero-actions {

	gap: 16px;

	flex-wrap: wrap;

}





/* ---- Buttons ---- */





.btn-custom-solid {





	background: linear-gradient(135deg, var(--cs-orange), #ff8a4c);





	color: #fff !important;





	font-weight: 600;





	border-radius: 50px;





	padding: 12px 28px;





	border: none;





	box-shadow: 0 4px 15px rgba(242, 101, 34, .3);





	transition: all .3s ease;





	text-decoration: none;





}





.btn-custom-solid:hover {

	transform: translateY(-3px);

	box-shadow: 0 8px 25px rgba(242, 101, 34, .4);

	color: #fff !important;

}





.btn-custom-outline {





	border: 2px solid var(--cs-blue);





	color: var(--cs-blue) !important;





	font-weight: 600;





	border-radius: 50px;





	padding: 10px 24px;





	background: transparent;





	transition: all .3s ease;





	text-decoration: none;





}





.btn-custom-outline:hover {

	background: var(--cs-blue);

	color: #fff !important;

}





/* Hero override: white outline on dark bg */





.hero-section .btn-custom-outline {

	border-color: #fff;

	color: #fff !important;

}





.hero-section .btn-custom-outline:hover {

	background: var(--cs-blue);

}





/* ---- Search panel ---- */





.search-panel {





	padding: 0px !important;





	margin: 0px !important;





}





/* .search-panel {































































































































































































































































































































































































































































































































































































    background: #fff;































































































































































































































































































































































































































































































































































































    border-radius: 16px !important;































































































































































































































































































































































































































































































































































































    border: 1px solid rgba(0,0,0,.07);































































































































































































































































































































































































































































































































































































    box-shadow: 0 8px 30px rgba(0,0,0,.06);































































































































































































































































































































































































































































































































































































} */





.h-search-sec {

	margin-top: -40px;

	position: relative;

	z-index: 30;

	padding-bottom: 10px;

}





/* ---- Campaign cards (match option4) ---- */





.campaign-card {





	background: #fff;





	border-radius: 24px;





	border: 1px solid rgba(0, 0, 0, .05);





	/* overflow: hidden; */





	box-shadow: 0 10px 40px rgba(0, 0, 0, .04);





	transition: all .4s cubic-bezier(.175, .885, .32, 1.275);





	height: 100%;





}





.campaign-card:hover {

	transform: translateY(-10px);

	box-shadow: 0 20px 50px rgba(0, 0, 0, .10);

}





.card-img-wrapper {





	display: block;





	position: relative;





	height: 220px;





	overflow: hidden;





	background: var(--cs-blue-light);





}





.card-img-wrapper img {





	width: 100%;





	height: 100%;





	object-fit: cover;





	display: block;





}





.coinshare-img-placeholder {





	display: flex;





	align-items: center;





	justify-content: center;





	width: 100%;





	height: 100%;





	background: var(--cs-blue-light);





	color: var(--cs-blue);





	font-weight: 600;





	font-size: 13px;





	letter-spacing: .04em;





}





.category-badge {





	position: absolute;





	top: 14px;





	left: 14px;





	padding: 6px 12px;





	border-radius: 999px;





	background: rgba(15, 23, 42, .75);





	color: #fff;





	font-size: 12px;





	font-weight: 600;





}





.category-badge-inline {





	display: inline-block;





	padding: 5px 12px;





	border-radius: 999px;





	background: var(--cs-blue-light);





	color: var(--cs-blue);





	font-size: 12px;





	font-weight: 600;





}





.progress {

	height: 8px;

	border-radius: 99px;

	background: #f1f5f9;

	margin-top: 12px;

}





.progress-bar {

	background: linear-gradient(90deg, var(--cs-orange), #ff8a4c);

	border-radius: 99px;

}





/* ---- Trust list ---- */





.trust-section {

	background: var(--cs-blue-light);

}





.trust-list {

	list-style: none;

	padding: 0;

	margin: 0;

}





.trust-list li {





	display: flex;





	align-items: center;





	gap: 12px;





	padding: 14px 0;





	border-bottom: 1px solid rgba(0, 86, 164, .12);





	font-size: 1.05rem;





	font-weight: 500;





}





.trust-list li:last-child {

	border-bottom: none;

}





.trust-list li i {

	color: var(--cs-blue);

	font-size: 1.3rem;

}





/* ---- About section ---- */





.about-section {

	padding: 80px 0;

}





.about-icon-box {





	width: 52px;

	height: 52px;





	background: var(--cs-blue-light);





	border-radius: 14px;





	display: flex;

	align-items: center;

	justify-content: center;





	color: var(--cs-blue);





	font-size: 1.3rem;





	margin-bottom: 14px;





}





/* ---- How it works step number ---- */





.how-step-number {





	display: inline-block;





	font-size: 2rem;





	font-weight: 800;





	color: var(--cs-blue-light);





	-webkit-text-stroke: 2px var(--cs-blue);





}





/* ---- Category tiles ---- */





.category-tile {





	transition: all .3s ease;





	color: var(--cs-dark) !important;





}





.category-tile:hover {

	transform: translateY(-6px);

	box-shadow: 0 12px 30px rgba(0, 0, 0, .1) !important;

	border-color: var(--cs-blue) !important;

}





/* ---- Detail page ---- */





.coinshare-detail-wrap {

	min-height: 60vh;

}





.coinshare-story-content p {

	color: var(--cs-gray);

	margin-bottom: 16px;

}





.coinshare-story-content img {

	max-width: 100%;

	border-radius: 12px;

}





/* ---- Donation suggested button active state ---- */





.coinshare-suggested-btn.active {





	background: var(--cs-blue) !important;





	color: #fff !important;





	border-color: var(--cs-blue) !important;





}





/* ---- Login form overrides ---- */





#coinshare-login-form p {

	margin-bottom: 16px;

}





#coinshare-login-form label {

	font-weight: 600;

	display: block;

	margin-bottom: 6px;

	font-size: 14px;

}





#coinshare-login-form input[type=text],





#coinshare-login-form input[type=password] {





	width: 100%;





	border: 1px solid #d1d5db;





	border-radius: 10px;





	padding: 12px 14px;





	font-size: 16px;





}





#coinshare-login-form input[type=submit] {





	background: linear-gradient(135deg, var(--cs-orange), #ff8a4c);





	color: #fff;





	font-weight: 600;





	border: none;





	border-radius: 50px;





	padding: 12px 28px;





	font-size: 16px;





	cursor: pointer;





	width: 100%;





	margin-top: 10px;





}





#coinshare-login-form .forgetmenot {

	display: flex;

	align-items: center;

	gap: 8px;

	font-size: 13px;

}





/* ---- Alert overrides ---- */





.alert {

	border-radius: 12px !important;

}





/* ---- Responsive ---- */





@media (max-width: 767px) {





	.hero-title {

		font-size: 2.4rem;

	}





	.hero-section {

		padding: 120px 0 80px;

	}





	.h-search-sec {

		margin-top: 0;

	}





	.coinshare-filter-row {

		grid-template-columns: 1fr;

	}





}





/* -----------------------------------------------------------------------































































































































































































































































































































































































































































































































































































 * Pagination — [coinshare_campaigns] (v1.3.0)































































































































































































































































































































































































































































































































































































 * --------------------------------------------------------------------- */





.coinshare-pagination {





	margin-top: 2.5rem;





	flex-wrap: wrap;





	gap: 8px;





}





.coinshare-pagination .btn {





	min-width: 40px;





	text-align: center;





}





/* -----------------------------------------------------------------------































































































































































































































































































































































































































































































































































































 * Organizer Dashboard — [coinshare_organizer_dashboard] (v1.3.0)































































































































































































































































































































































































































































































































































































 * --------------------------------------------------------------------- */





.nav-pills .nav-link {





	background: transparent;





	color: var(--cs-blue, #0056a4);





	border: 2px solid var(--cs-blue, #0056a4);





	padding: 0.5rem 1.2rem;





	transition: background 0.2s, color 0.2s;





}





.nav-pills .nav-link.active,





.nav-pills .nav-link:hover {





	background: var(--cs-blue, #0056a4);





	color: #fff;





}





.badge-soft {





	display: inline-block;





	padding: 4px 10px;





	border-radius: 999px;





	font-size: 12px;





	font-weight: 600;





	background: #f1f5f9;





	color: #475569;





}





.badge-soft.badge-live {





	background: #dcfce7;





	color: #15803d;





}





.badge-soft.badge-review {





	background: #fef9c3;





	color: #854d0e;





}





.badge-soft.badge-verified {





	background: #dbeafe;





	color: #1e40af;





}





.cs-verified-badge {





	display: inline-flex;





	align-items: center;





	gap: 4px;





	background: #dbeafe;





	color: #1e40af;





	font-size: 0.78rem;





	font-weight: 600;





	padding: 3px 10px;





	border-radius: 99px;





}





/* Category tile hover */





.category-tile {





	transition: transform 0.2s, box-shadow 0.2s;





	cursor: pointer;





}





.category-tile:hover {





	transform: translateY(-3px);





	box-shadow: 0 12px 28px rgba(15, 23, 42, .12) !important;





}





/* How-it-works step number */





.how-step-number {





	font-size: 3rem;





	font-weight: 900;





	color: var(--cs-blue, #0056a4);





	opacity: .12;





	line-height: 1;





}





.form-control {





	border-radius: 8px !important;





	border: 1px solid #dee2e6 !important;





}





.c-detail-container {





	max-width: 1360px !important;





	padding: 120px 24px 70px 24px;





	margin: 0 auto;





}

@media(max-width:768px){

   .c-detail-container {

    padding: 180px 24px 70px 24px;

   } 

}

@media(min-width:1024px){

    .d-sticky-box{

        margin-top: 120px;

    }

}



.c-detail-body {





	width: 100%;





	background-color: #fff;





}





.cs-pill {





	color: #0056a4 !important;





	border-color: #0056a4 !important;





}





.cs-pill:hover {





	color: #fff !important;





	background-color: #0056a4 !important;





}





.input-group .form-control {





	border-radius: 0px 6px 6px 0px !important;





}





.log-form p a {





	color: #0056A4 !important;





}





/* ============================================================















































































































































   CoinShare v2.0.0 — Stripe Connect Onboarding Page Styles















































































































































   ============================================================ */





/* Stripe branded button */





.btn-stripe {





	background: #635bff;





	color: #fff !important;





	border: none;





	border-radius: 6px;





	font-weight: 600;





	padding: 12px 24px;





	transition: background 0.2s, transform 0.1s;





	display: inline-flex;





	align-items: center;





	gap: 8px;





	text-decoration: none;





}





.btn-stripe:hover {





	background: #4f46e5;





	color: #fff !important;





	transform: translateY(-1px);





}





.btn-stripe:active {





	transform: translateY(0);





}





/* Step progress indicator */





.cs-step-bar {





	display: flex;





	align-items: center;





	margin-bottom: 28px;





	gap: 0;





}





.cs-step-node {





	display: flex;





	flex-direction: column;





	align-items: center;





	min-width: 70px;





}





.cs-step-circle {





	width: 36px;





	height: 36px;





	border-radius: 50%;





	display: flex;





	align-items: center;





	justify-content: center;





	font-weight: 700;





	font-size: 14px;





	color: #fff;





	background: #dee2e6;





}





.cs-step-circle.active {

	background: #0056a4;

}





.cs-step-circle.done {

	background: #198754;

}





.cs-step-label {





	font-size: 11px;





	color: #888;





	text-align: center;





	margin-top: 4px;





	max-width: 80px;





	line-height: 1.2;





}





.cs-step-label.active {

	color: #0056a4;

	font-weight: 600;

}





.cs-step-connector {





	flex: 1;





	height: 2px;





	background: #dee2e6;





	margin-bottom: 18px;





}





.cs-step-connector.done {

	background: #198754;

}





/* Split percentage cards */





.cs-split-card {





	border-radius: 10px;





	padding: 20px;





	text-align: center;





}





.cs-split-card .cs-pct {





	font-size: 36px;





	font-weight: 700;





	line-height: 1;





}





.cs-split-card.campaigner {





	background: #d1fae5;





}





.cs-split-card.campaigner .cs-pct {

	color: #065f46;

}





.cs-split-card.platform {





	background: #e0e7ff;





}





.cs-split-card.platform .cs-pct {

	color: #3730a3;

}





/* Onboarding info boxes */





.cs-info-box {





	border-radius: 10px;





	padding: 16px 20px;





	margin-bottom: 16px;





}





.cs-info-box.needs {





	background: #fffbeb;





	border: 1px solid #fde68a;





}





.cs-info-box.split-info {





	background: #f0f7ff;





	border: 1px solid #bcd4f5;





}





.cs-info-box.test-mode {





	background: #fff3cd;





	border: 2px solid #ffc107;





}





.cs-info-box.complete {





	background: #d1fae5;





	border: 2px solid #6ee7b7;





}





/* Test mode banner */





.cs-test-banner {





	background: #fff3cd;





	border: 2px solid #ffc107;





	border-radius: 8px;





	padding: 14px 18px;





	margin-bottom: 20px;





	display: flex;





	align-items: center;





	gap: 12px;





	font-size: 14px;





}





/* Success state */





.cs-success-icon {





	font-size: 64px;





	line-height: 1;





	text-align: center;





	display: block;





	margin-bottom: 12px;





}





/* Campaign summary row */





.cs-campaign-summary {





	display: flex;





	align-items: center;





	gap: 14px;





	padding: 14px;





	border: 1px solid #e5e7eb;





	border-radius: 10px;





	background: #fafafa;





	margin-bottom: 20px;





}





.cs-campaign-thumb {





	width: 56px;





	height: 56px;





	border-radius: 8px;





	object-fit: cover;





	flex-shrink: 0;





}





/* Ensure btn classes work standalone (no WooCommerce conflict) */





.cs-btn-primary {





	display: inline-block;





	background: #0056a4;





	color: #fff !important;





	padding: 10px 22px;





	border-radius: 6px;





	text-decoration: none;





	font-weight: 600;





	border: none;





	cursor: pointer;





	transition: background 0.2s;





}





.cs-btn-primary:hover {

	background: #004080;

}





.cs-btn-outline {





	display: inline-block;





	background: transparent;





	color: #0056a4 !important;





	padding: 9px 20px;





	border-radius: 6px;





	text-decoration: none;





	font-weight: 600;





	border: 2px solid #0056a4;





	cursor: pointer;





	transition: all 0.2s;





}





.cs-btn-outline:hover {





	background: #0056a4;





	color: #fff !important;





}





/* Mobile responsive */





@media (max-width: 576px) {





	.cs-step-label {

		font-size: 10px;

		max-width: 60px;

	}





	.cs-split-card .cs-pct {

		font-size: 28px;

	}





}





.cs-share-btn {





	color: #0056a4 !important;





	border-color: #0056a4 !important;





}





.cs-share-btn:hover {





	color: #fff !important;





	background-color: #0056a4 !important;





}





.d-now-btn {





	background: var(--cs-orange, #f47c20);





	color: #fff;





	border: none;





	border-radius: 99px;





	padding: 12px 20px;





	font-size: 1.05rem;





	font-weight: 700;





	cursor: pointer;





	transition: .15s;





	position: fixed;





	left: 0;





	top: 30%;





	z-index: 50;





	box-shadow: 0px 4px 15px 0px rgba(241.99999999999997, 100.9999999999999, 33.999999999999986, 0.30196078431372547);





}





.d-now-btn:hover {





	transform: translateX(10px);





	background: var(--cs-orange, #f47c20);





	color: #fff;





}



/* .cs-donate-box{



    position: sticky;



    top: 200px;



    z-index: 1200;



} */