.dropstart .dropdown-toggle::before {display: none}

[data-tooltip],
.tooltip {
  position: relative;
  cursor: pointer;
}

[data-tooltip]:before,
[data-tooltip]:after,
.tooltip:before,
.tooltip:after {
  position: absolute;
  visibility: hidden;
  -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=0)";
  filter: progid:DXImageTransform.Microsoft.Alpha(Opacity=0);
  opacity: 0;
  -webkit-transition: 
    opacity 0.2s ease-in-out,
    visibility 0.2s ease-in-out,
    -webkit-transform 0.2s cubic-bezier(0.71, 1.7, 0.77, 1.24);
  -moz-transition:    
    opacity 0.2s ease-in-out,
    visibility 0.2s ease-in-out,
    -moz-transform 0.2s cubic-bezier(0.71, 1.7, 0.77, 1.24);
  transition:         
    opacity 0.2s ease-in-out,
    visibility 0.2s ease-in-out,
    transform 0.2s cubic-bezier(0.71, 1.7, 0.77, 1.24);
  -webkit-transform: translate3d(0, 0, 0);
  -moz-transform:    translate3d(0, 0, 0);
  transform:         translate3d(0, 0, 0);
  pointer-events: none;
}

[data-tooltip]:hover:before,
[data-tooltip]:hover:after,
[data-tooltip]:focus:before,
[data-tooltip]:focus:after,
.tooltip:hover:before,
.tooltip:hover:after,
.tooltip:focus:before,
.tooltip:focus:after {
  visibility: visible;
  -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=100)";
  filter: progid:DXImageTransform.Microsoft.Alpha(Opacity=100);
  opacity: 1;
}

.tooltip:before,
[data-tooltip]:before {
  z-index: 1001;
  border: 6px solid transparent;
  background: transparent;
  content: "";
}

.tooltip:after,
[data-tooltip]:after {
  z-index: 1000;
  padding: 8px;
  width: 160px;
  background-color: #000;
  background-color: hsla(0, 0%, 20%, 0.9);
  color: #fff;
  content: attr(data-tooltip);
  font-size: 14px;
  line-height: 1.2;
}

[data-tooltip]:before,
[data-tooltip]:after,
.tooltip:before,
.tooltip:after,
.tooltip-top:before,
.tooltip-top:after {
  bottom: 100%;
  left: 50%;
}

[data-tooltip]:before,
.tooltip:before,
.tooltip-top:before {
  margin-left: -6px;
  margin-bottom: -12px;
  border-top-color: #000;
  border-top-color: hsla(0, 0%, 20%, 0.9);
}

[data-tooltip]:after,
.tooltip:after,
.tooltip-top:after {
  margin-left: -80px;
}

[data-tooltip]:hover:before,
[data-tooltip]:hover:after,
[data-tooltip]:focus:before,
[data-tooltip]:focus:after,
.tooltip:hover:before,
.tooltip:hover:after,
.tooltip:focus:before,
.tooltip:focus:after,
.tooltip-top:hover:before,
.tooltip-top:hover:after,
.tooltip-top:focus:before,
.tooltip-top:focus:after {
  -webkit-transform: translateY(-12px);
  -moz-transform:    translateY(-12px);
  transform:         translateY(-12px); 
}

.tooltip-left:before,
.tooltip-left:after {
  right: 100%;
  bottom: 50%;
  left: auto;
}

.tooltip-left:before {
  margin-left: 0;
  margin-right: -12px;
  margin-bottom: 0;
  border-top-color: transparent;
  border-left-color: #000;
  border-left-color: hsla(0, 0%, 20%, 0.9);
}

.tooltip-left:hover:before,
.tooltip-left:hover:after,
.tooltip-left:focus:before,
.tooltip-left:focus:after {
  -webkit-transform: translateX(-12px);
  -moz-transform:    translateX(-12px);
  transform:         translateX(-12px); 
}

.tooltip-bottom:before,
.tooltip-bottom:after {
  top: 100%;
  bottom: auto;
  left: 50%;
}

.tooltip-bottom:before {
  margin-top: -12px;
  margin-bottom: 0;
  border-top-color: transparent;
  border-bottom-color: #000;
  border-bottom-color: hsla(0, 0%, 20%, 0.9);
}

.tooltip-bottom:hover:before,
.tooltip-bottom:hover:after,
.tooltip-bottom:focus:before,
.tooltip-bottom:focus:after {
  -webkit-transform: translateY(12px);
  -moz-transform:    translateY(12px);
  transform:         translateY(12px); 
}

.tooltip-right:before,
.tooltip-right:after {
  bottom: 50%;
  left: 100%;
}

.tooltip-right:before {
  margin-bottom: 0;
  margin-left: -12px;
  border-top-color: transparent;
  border-right-color: #000;
  border-right-color: hsla(0, 0%, 20%, 0.9);
}

.tooltip-right:hover:before,
.tooltip-right:hover:after,
.tooltip-right:focus:before,
.tooltip-right:focus:after {
  -webkit-transform: translateX(12px);
  -moz-transform:    translateX(12px);
  transform:         translateX(12px); 
}

.tooltip-left:before,
.tooltip-right:before {
  top: 3px;
}

.tooltip-left:after,
.tooltip-right:after {
  margin-left: 0;
  margin-bottom: -16px;
}


		body {
			font-family: 'Roboto', -apple-system, BlinkMacSystemFont, 'Segoe UI', sans-serif;
		}
		
		.portal-header {
			padding: 1.5rem 0;
			background-color: #f8f9fa;
			border-bottom: 1px solid #e9ecef;
		}
		
		.logo-container {
			display: flex;
			align-items: center;
		}
		
		.logo-container img {
			max-height: 80px;
			margin-right: 1rem;
		}
		
		.site-title {
			font-size: 1.5rem;
			margin-bottom: 0;
			color: #212529;
			font-weight: 600;
		}
		
		.section-title {
			position: relative;
			padding-bottom: 0.75rem;
			margin-bottom: 2rem;
		}
		
		.section-title:after {
			content: '';
			position: absolute;
			bottom: 0;
			left: 50%;
			transform: translateX(-50%);
			width: 80px;
			height: 3px;
			background-color: #0d6efd;
		}
		
		.icon-box {
			display: inline-flex;
			align-items: center;
			justify-content: center;
			width: 80px;
			height: 80px;
			border-radius: 50%;
			background-color: rgba(13, 110, 253, 0.1);
		}
		
		/* Responsive adjustments */
		@media (max-width: 767.98px) {
			.logo-container {
				flex-direction: column;
				text-align: center;
				margin-bottom: 1rem;
			}
			
			.logo-container img {
				margin-right: 0;
				margin-bottom: 0.5rem;
			}
			
			.top-nav {
				justify-content: center !important;
			}
		}

		/* Payment Option Buttons */
		.payment-option-btn {
			transition: all 0.3s ease;
			border: 2px solid #dee2e6;
			text-decoration: none;
		}
		
		.payment-option-btn:hover {
			transform: translateY(-3px);
			box-shadow: 0 8px 25px rgba(13, 110, 253, 0.15);
			border-color: #0d6efd;
		}
		
		.payment-option-btn.active {
			background-color: #0d6efd;
			border-color: #0d6efd;
			color: white;
		}
		
		.payment-option-btn.active .text-muted {
			color: rgba(255, 255, 255, 0.8) !important;
		}
		
		.payment-option-btn.active .bg-warning {
			background-color: rgba(255, 193, 7, 0.9) !important;
		}
		
		.payment-option-btn.active .bg-success {
			background-color: rgba(25, 135, 84, 0.9) !important;
		}
		
		.payment-option-btn.active .text-warning {
			color: #664d03 !important;
		}
		
		.payment-option-btn.active .text-success {
			color: #0f5132 !important;
		}
		
		.payment-option-btn.active:hover {
			background-color: #0b5ed7;
			border-color: #0a58ca;
		}
		
		.payment-option-btn i {
			transition: all 0.3s ease;
		}
		
		.payment-option-btn:hover i {
			transform: scale(1.1);
		}
		
		@media (max-width: 767.98px) {
			.payment-option-btn {
				margin-bottom: 1rem;
			}
		}