/* Style for the table */
table {
    width: 100%;
    border-collapse: collapse;
    border: 1px solid black;
    height: 10%;
}

/* Style for table header */
th {
    padding: 10px;
    text-align: center;
    border-bottom: 2px solid #fff;
}

/* Style for table cells */
td {
    padding: 10px;
    border-bottom: 1px solid #fff;
}

/* Style for alternating rows */
tr:nth-child(even) {
    background-color: rgba(183, 182, 182, 0.224);
}

/* Style for selected plan button */
#selectedPlan button {
    cursor: pointer;
    outline: none;
    /* Changed to remove the outline */
    background-color: #e47203;
    color: white;
    /* Added to ensure button text is visible */
    border: none;
    /* Added to remove button border */
    padding: 5px 10px;
    /* Added padding for button */
    border-radius: 5px;
    /* Added border radius for button */
}

/* Style for check and cross icons */
.fas {
    margin-right: 5px;
}




.select-plan-button {
    width: 90px;
    padding: 5px;
    background: #fff;
    color: white;
    border: none;
    border-radius: 5px;
}

.plan-header {
    background: #499202;
    color: white;
}

.feature-available {
    /* Your styles for available features */
}

.highlighted-row {
    background-color: #ffff99;
    /* Example color: yellow */
}

.feature-available {
    /* Your styles for available features */
}

.highlighted-plan {
    background-color: #e47203;
    /* Example color: gold */
}
/* Sairiki membership page */
:root {
			--sairiki-blue: #063f98;
			--sairiki-blue-deep: #042f73;
			--sairiki-red: #d50f3f;
			--sairiki-red-deep: #b40c34;
			--sairiki-ink: #17213a;
			--sairiki-muted: #64718a;
			--sairiki-soft: #f5f8ff;
			--sairiki-line: #e5eaf4;
		}

		.membership-page {
			background: var(--sairiki-soft);
			color: var(--sairiki-ink);
		}

		.membership-page .inPrem2Nav {
			background: rgba(255,255,255,.98);
			border: 0;
			box-shadow: 0 10px 30px rgba(6,63,152,.08);
			margin-bottom: 0;
			min-height: 80px;
		}

		.membership-page .inPrem2Nav .navbar-brand {
			height: auto;
			padding: 10px;
		}

		.membership-page .inPrem2Nav .gt-header-logo {
			max-height: 60px;
		}

		.membership-page .inPrem2Nav .inPrem2Link {
			border-bottom: 4px solid transparent;
			color: var(--sairiki-ink);
			font-size: 14px;
			font-weight: 600;
			padding: 27px 18px;
		}

		.membership-page .inPrem2Nav .inPrem2Link:hover,
		.membership-page .inPrem2Nav .inPrem2Link:focus,
		.membership-page .inPrem2Nav li.active .inPrem2Link {
			background: transparent;
			border-bottom-color: var(--sairiki-red);
			color: var(--sairiki-red);
		}

		.membership-page .inPrem2Nav .navbar-toggle {
			background: var(--sairiki-blue);
			margin-top: 22px;
		}

		.membership-page .inPrem2Nav .navbar-toggle .icon-bar {
			background: #fff;
		}

		.membership-page .inPrem2Nav .nav-action {
			border-radius: 999px !important;
			color: #fff !important;
			font-weight: 700;
			margin: 20px 0 0 10px;
			padding: 9px 20px;
		}

		.membership-page .inPrem2Nav .register-action {
			background: var(--sairiki-blue) !important;
		}

		.membership-page .inPrem2Nav .login-action {
			background: var(--sairiki-red) !important;
		}

		.membership-page .inPrem2Nav .dropdown-menu > li > a {
			color: var(--sairiki-ink);
			padding: 7px 18px;
		}

		.membership-hero {
			background: #fff;
			border-bottom: 1px solid var(--sairiki-line);
			padding: 54px 20px 48px;
			text-align: center;
		}

		.membership-hero span {
			color: var(--sairiki-red);
			display: block;
			font-size: 12px;
			font-weight: 800;
			margin-bottom: 8px;
			text-transform: uppercase;
		}

		.membership-hero h1 {
			color: var(--sairiki-blue-deep);
			font-family: 'Merriweather', serif;
			font-size: 38px;
			font-weight: 800;
			margin: 0 0 12px;
		}

		.membership-hero p {
			color: var(--sairiki-muted);
			font-size: 15px;
			margin: 0;
		}

		.membership-content {
			margin: 0 auto;
			max-width: 1500px;
			padding: 54px 28px 76px;
		}

		.membership-page .table-container {
			background: #fff;
			border: 1px solid var(--sairiki-line);
			border-radius: 8px;
			box-shadow: 0 18px 50px rgba(6,63,152,.09);
			overflow-x: auto;
			padding: 24px;
			scrollbar-color: var(--sairiki-blue) var(--sairiki-soft);
			scrollbar-width: thin;
		}

		.membership-page .table-container::-webkit-scrollbar {
			height: 10px;
		}

		.membership-page .table-container::-webkit-scrollbar-track {
			background: var(--sairiki-soft);
			border-radius: 999px;
		}

		.membership-page .table-container::-webkit-scrollbar-thumb {
			background: var(--sairiki-blue);
			border: 2px solid var(--sairiki-soft);
			border-radius: 999px;
		}

		.membership-page .table-container::-webkit-scrollbar-thumb:hover {
			background: var(--sairiki-red);
		}

		.membership-page #gt-plan {
			border-collapse: separate;
			border-spacing: 0;
			margin: 0;
			min-width: 820px;
			width: 100%;
		}

		.membership-page #gt-plan th {
			background: #fff;
			border-bottom: 1px solid var(--sairiki-line);
			border-right: 1px solid var(--sairiki-line);
			color: var(--sairiki-muted);
			font-size: 13px;
			padding: 17px 14px;
			text-align: center;
		}

		.membership-page #gt-plan tr th:first-child {
			color: var(--sairiki-blue-deep);
			font-weight: 800;
			min-width: 155px;
			text-align: left;
		}

		.membership-page #gt-plan .plan-header {
			background: var(--sairiki-blue-deep) !important;
			color: #fff !important;
			font-size: 17px;
			font-weight: 800;
			padding: 20px 14px;
		}

		.membership-page #gt-plan th.featured-plan-column {
			background: rgba(213,15,63,.055);
			border-left: 2px solid rgba(213,15,63,.28);
			border-right: 2px solid rgba(213,15,63,.28);
		}

		.membership-page #gt-plan th.plan-header.featured-plan-column {
			background: linear-gradient(135deg, var(--sairiki-red), var(--sairiki-red-deep)) !important;
			border-color: var(--sairiki-red);
			position: relative;
		}

		.membership-page #gt-plan th.plan-header.featured-plan-column:after {
			background: #fff;
			border-radius: 999px;
			color: var(--sairiki-red);
			content: "Featured";
			display: block;
			font-size: 10px;
			font-weight: 800;
			margin: 8px auto 0;
			padding: 3px 9px;
			width: max-content;
		}

		.membership-page #gt-plan tr:first-child th:first-child {
			background: var(--sairiki-blue-deep);
			border-top-left-radius: 6px;
		}

		.membership-page #gt-plan tr:first-child th:last-child {
			border-top-right-radius: 6px;
		}

		.membership-page #gt-plan .fa-check {
			color: #159957 !important;
			font-size: 17px;
		}

		.membership-page #gt-plan .fa-times {
			color: var(--sairiki-red) !important;
			font-size: 17px;
		}

		.membership-page .plan-value {
			background: var(--sairiki-soft);
			border: 1px solid var(--sairiki-line);
			border-radius: 999px;
			color: var(--sairiki-blue-deep);
			display: inline-block;
			font-size: 12px;
			font-weight: 800;
			min-width: 72px;
			padding: 6px 12px;
		}

		.membership-page .plan-value.yes {
			background: rgba(21,153,87,.1);
			border-color: rgba(21,153,87,.2);
			color: #107741;
		}

		.membership-page .plan-value.no {
			background: rgba(213,15,63,.08);
			border-color: rgba(213,15,63,.16);
			color: var(--sairiki-red);
		}

		.membership-page #gt-plan [id^="planamount"] {
			color: var(--sairiki-blue-deep);
			display: block;
			font-size: 20px;
			font-weight: 800;
			margin-bottom: 12px;
		}

		.membership-page .select-plan-button {
			background: var(--sairiki-blue);
			border: 0;
			border-radius: 999px;
			color: #fff;
			font-weight: 800;
			padding: 9px 20px;
			width: auto;
		}

		.membership-page .select-plan-button:hover,
		.membership-page .select-plan-button:focus {
			background: var(--sairiki-blue-deep);
		}

		.membership-page .inMembershipSelected {
			background: #fff;
			border: 1px solid var(--sairiki-line);
			border-radius: 8px;
			box-shadow: 0 18px 45px rgba(6,63,152,.1);
			margin-top: 28px;
			overflow: hidden;
		}

		.membership-page .inMembershipSelected .gt-panel-head {
			background: var(--sairiki-blue-deep) !important;
			color: #fff;
			font-size: 16px;
			font-weight: 800;
			padding: 16px 22px;
		}

		.membership-page .inMembershipSelected .gt-panel-body {
			background: #fff;
			padding: 24px;
		}

		.membership-page .inMembershipSelected h4 {
			color: var(--sairiki-muted);
			font-size: 12px;
			font-weight: 800;
			text-transform: uppercase;
		}

		.membership-page .inMembershipSelected h5,
		.membership-page #dis_plan_amount {
			color: var(--sairiki-blue-deep) !important;
			font-size: 18px;
			font-weight: 800;
		}

		.membership-page #checkout {
			background: linear-gradient(135deg, var(--sairiki-red), var(--sairiki-red-deep)) !important;
			border: 0;
			border-radius: 999px;
			box-shadow: 0 12px 28px rgba(213,15,63,.22);
			color: #fff;
			font-weight: 800;
			padding: 12px 28px;
		}

		@media (max-width: 767px) {
			.membership-page .inPrem2Nav .inPrem2Link {
				padding: 12px 16px;
			}

			.membership-page .inPrem2Nav .nav-action {
				display: block;
				margin: 8px 16px;
				text-align: center;
			}

			.membership-hero {
				padding: 40px 18px 36px;
			}

			.membership-hero h1 {
				font-size: 30px;
			}

			.membership-content {
				padding: 34px 12px 52px;
			}

			.membership-page .table-container {
				padding: 12px;
			}
		}

.sairiki-body-hidden,
.sairiki-app-bottom-nav {
	display: none;
}

@media (max-width: 1199px) {
	html,
	body.membership-page {
		overflow-x: hidden;
	}

	body.membership-page {
		padding-bottom: 86px;
	}

	.membership-page #main {
		max-width: 100%;
		overflow-x: hidden;
		padding-top: 72px;
	}

	.membership-page .inPrem2Nav {
		align-items: center;
		background: #fff !important;
		border: 0;
		box-shadow: 0 8px 22px rgba(6,63,152,.1);
		display: flex;
		height: 72px;
		left: 0;
		margin: 0;
		min-height: 72px;
		position: fixed;
		right: 0;
		top: 0;
		z-index: 1050;
	}

	.membership-page .inPrem2Nav .container {
		align-items: center;
		display: flex;
		height: 72px;
		justify-content: center;
		position: relative;
		width: 100%;
	}

	.membership-page .inPrem2Nav .navbar-brand {
		float: none;
		height: auto;
		margin: 0 !important;
		padding: 0;
	}

	.membership-page .inPrem2Nav .gt-header-logo {
		display: block;
		max-height: 54px;
		max-width: 180px;
		object-fit: contain;
	}

	.membership-page .inPrem2Nav .navbar-header,
	.membership-page .inPrem2Nav .navbar-collapse {
		display: none !important;
	}

	.membership-hero {
		padding: 24px 18px 22px;
	}

	.membership-hero span {
		font-size: 11px;
		margin-bottom: 6px;
	}

	.membership-hero h1 {
		font-size: 26px;
		line-height: 1.25;
	}

	.membership-hero p {
		font-size: 13px;
		line-height: 1.55;
	}

	.membership-content {
		padding: 18px 10px 26px;
	}

	.membership-page .table-container {
		border-radius: 8px;
		box-shadow: 0 10px 28px rgba(6,63,152,.08);
		margin: 0;
		overflow-x: auto;
		padding: 10px;
		-webkit-overflow-scrolling: touch;
	}

	.membership-page #gt-plan {
		min-width: 760px;
	}

	.membership-page #gt-plan th {
		font-size: 12px;
		padding: 13px 10px;
	}

	.membership-page #gt-plan .plan-header {
		font-size: 14px;
		padding: 16px 10px;
	}

	.membership-page .select-plan-button {
		padding: 9px 14px;
		width: 100%;
	}

	.membership-page .inMembershipSelected {
		margin-top: 18px;
	}

	.membership-page .inMembershipSelected .gt-panel-body {
		padding: 18px 16px;
	}

	.membership-page .inMembershipSelected .gt-panel-body .row > [class*="col-"] {
		margin-bottom: 12px;
	}

	.membership-page .inMembershipSelected #checkout {
		display: block;
		text-align: center;
		width: 100%;
	}

	body.membership-page footer,
	body.membership-page .footer-before-login,
	body.membership-page .sairiki-footer,
	body.membership-page .sairiki-footer-bottom,
	.membership-page .fixLangugeBtn,
	.membership-page .onlineWidget {
		display: none !important;
	}

	.sairiki-app-bottom-nav {
		align-items: center;
		background: rgba(255,255,255,.96);
		border: 1px solid #dfe6f0;
		border-radius: 18px;
		bottom: 10px;
		box-shadow: 0 12px 30px rgba(6,63,152,.18);
		display: grid;
		gap: 2px;
		grid-template-columns: repeat(5,minmax(0,1fr));
		left: 10px;
		padding: 8px 6px;
		position: fixed;
		right: 10px;
		z-index: 1060;
	}

	.sairiki-app-bottom-nav a {
		align-items: center;
		border-radius: 12px;
		color: #66738b;
		display: flex;
		flex-direction: column;
		font-size: 10px;
		font-weight: 700;
		gap: 4px;
		line-height: 1.1;
		min-height: 48px;
		padding: 7px 3px;
		text-align: center;
		text-decoration: none !important;
	}

	.sairiki-app-bottom-nav a i {
		color: var(--sairiki-blue);
		font-size: 17px;
	}

	.sairiki-app-bottom-nav a.is-active {
		background: #eef4ff;
		color: var(--sairiki-blue-deep);
	}

	.sairiki-app-bottom-nav a.is-primary {
		background: var(--sairiki-blue);
		color: #fff;
	}

	.sairiki-app-bottom-nav a.is-primary i {
		color: #fff;
	}
}

@media (min-width: 768px) and (max-width: 1199px) {
	.membership-page #main {
		padding-top: 82px;
	}

	.membership-page .inPrem2Nav,
	.membership-page .inPrem2Nav .container {
		height: 82px;
		min-height: 82px;
	}

	.membership-page .inPrem2Nav .gt-header-logo {
		max-height: 62px;
		max-width: 220px;
	}

	.membership-hero {
		padding: 36px 24px 32px;
	}

	.membership-hero h1 {
		font-size: 32px;
	}

	.membership-content {
		padding-left: 18px;
		padding-right: 18px;
	}

	.sairiki-app-bottom-nav {
		bottom: 16px;
		left: 50%;
		max-width: 640px;
		right: auto;
		transform: translateX(-50%);
		width: calc(100% - 28px);
	}
}

@media (max-width: 420px) {
	.sairiki-app-bottom-nav a {
		font-size: 9px;
	}
}

.membership-plan-cards {
	display: none;
}

@media (max-width: 1199px) {
	.membership-page .table-container {
		background: transparent;
		border: 0;
		box-shadow: none;
		overflow: visible;
		padding: 0;
	}

	.membership-page #gt-plan {
		display: none;
	}

	.membership-plan-cards {
		display: grid;
		gap: 14px;
		grid-template-columns: 1fr;
	}

	.membership-plan-card {
		background: #fff;
		border: 1px solid var(--sairiki-line);
		border-radius: 8px;
		box-shadow: 0 10px 26px rgba(6,63,152,.08);
		overflow: hidden;
		padding: 18px;
		position: relative;
	}

	.membership-plan-card.is-featured {
		border-color: rgba(213,15,63,.38);
		box-shadow: 0 12px 28px rgba(213,15,63,.11);
	}

	.membership-plan-card.gt-reco {
		border-color: var(--sairiki-blue);
		box-shadow: 0 0 0 3px rgba(10,75,170,.12), 0 12px 28px rgba(6,63,152,.12);
	}

	.membership-plan-card-head {
		align-items: flex-start;
		border-bottom: 1px solid var(--sairiki-line);
		display: flex;
		gap: 12px;
		justify-content: space-between;
		padding-bottom: 14px;
	}

	.membership-plan-card-head h2 {
		color: var(--sairiki-blue-deep);
		font-family: 'Merriweather', serif;
		font-size: 20px;
		font-weight: 800;
		margin: 4px 0 5px;
	}

	.membership-plan-card-head p {
		color: var(--sairiki-muted);
		font-size: 12px;
		margin: 0;
	}

	.membership-plan-badge {
		color: var(--sairiki-red);
		display: block;
		font-size: 10px;
		font-weight: 800;
		text-transform: uppercase;
	}

	.membership-plan-badge i {
		margin-right: 4px;
	}

	.membership-plan-price {
		color: var(--sairiki-blue);
		font-size: 26px;
		font-weight: 800;
		line-height: 1;
		white-space: nowrap;
	}

	.membership-plan-price small {
		font-size: 14px;
		margin-right: 2px;
	}

	.membership-plan-benefits {
		display: grid;
		gap: 10px;
		list-style: none;
		margin: 15px 0 18px;
		padding: 0;
	}

	.membership-plan-benefits li {
		align-items: center;
		color: #46536b;
		display: flex;
		font-size: 12px;
		gap: 9px;
		line-height: 1.4;
	}

	.membership-plan-benefits li i {
		align-items: center;
		background: #eef4ff;
		border-radius: 50%;
		color: var(--sairiki-blue);
		display: flex;
		flex: 0 0 24px;
		height: 24px;
		justify-content: center;
		width: 24px;
	}

	.membership-page .membership-plan-select {
		border-radius: 5px;
		font-size: 12px;
		min-height: 42px;
		width: 100%;
	}
}

@media (min-width: 768px) and (max-width: 1199px) {
	.membership-plan-cards {
		grid-template-columns: repeat(2,minmax(0,1fr));
	}

	.membership-plan-benefits {
		grid-template-columns: repeat(2,minmax(0,1fr));
	}
}

