/* Home Easy Access Section - Mouse Tracking Tilt Effect */
/* Note: CSS hover transforms disabled to allow JavaScript mouse tracking */
#home-easy-access .easy-access-col-img img.w-full {
    /* transition: transform 0.3s ease !important; -- Disabled for JS control */
    cursor: pointer !important;
    transform-origin: center center !important;
}

/* Removed hover transform to prevent conflict with JavaScript */
/* #home-easy-access .easy-access-col-img img.w-full:hover {
    transform: rotate(-5deg) scale(1.05) !important;
} */

/* Alternative selector with higher specificity */
#home-easy-access .easy-access-col-img img[src*="mobile-phone"] {
    /* transition: transform 0.3s ease !important; -- Disabled for JS control */
    cursor: pointer !important;
    transform-origin: center center !important;
}

/* Removed hover transform to prevent conflict with JavaScript */
/* #home-easy-access .easy-access-col-img img[src*="mobile-phone"]:hover {
    transform: rotate(-5deg) scale(1.05) !important;
} */

/* Optional: Add a subtle shadow on hover for more depth */
#home-easy-access .easy-access-col-img {
    transition: filter 0.3s ease !important;
}

#home-easy-access .easy-access-col-img:hover {
    filter: drop-shadow(0 10px 20px rgba(0, 0, 0, 0.15)) !important;
}

.tabs-header-container ul {
    border-radius: 8px;
}

.tabs-header-container button[aria-selected="true"] {
    background-color: var(--color-primary-600);
    color: var(--color-white);
}

.tabs-header-container button[aria-selected="false"] {
    background-color: var(--color-gray-100);
    color: var(--color-gray-900);
}

.tabs-header-container button:last-child {
    border-right: 1px solid var(--color-gray-200);
}

.tabs-header-container button[aria-selected="false"]:hover {
    background-color: var(--color-gray-200);
}

.table-content-container {
    padding: 0 20px 0 20px;
    border: 1px solid var(--color-gray-200);
    border-radius: 8px;
}

.table-content-container table tr:last-child {
    border-bottom: none;
}

/* Cards Hover Effects */
.cards-why-day-traders-choose-fxt .div-card {
	position: relative;
	overflow: hidden;
	/* cursor: pointer; */
	/* transition: all 0.4s cubic-bezier(0.25, 0.46, 0.45, 0.94); */
}

/* Sliding overlay effect - slides from bottom to top */
.cards-why-day-traders-choose-fxt .div-card::before {
	content: '';
	position: absolute;
	left: 0;
	right: 0;
	bottom: 0;
	top: 100%;
	background: rgba(0, 0, 0, 0.75);
	transition: top 0.5s ease;
	z-index: 1;
	pointer-events: none;
}

.cards-why-day-traders-choose-fxt .div-card:hover::before {
	top: 0;
}

.cards-why-day-traders-choose-fxt .div-card .card-content {
	position: absolute;
	bottom: 0;
	left: 0;
	right: 0;
    height: 160px;
	transition: height 0.5s ease;
    padding: 30px;
}

.cards-why-day-traders-choose-fxt .div-card:hover .card-content {
    height: 100%;
}

/* Title styling - smoother animation */
.cards-why-day-traders-choose-fxt .card-slide-up-title {
	transform: translateY(0);
	opacity: 1;
	/* transition: all 0.5s cubic-bezier(0.23, 1, 0.32, 1) 0.1s; */
	position: relative;
	z-index: 2;
	/* margin-bottom: 0.5rem; */
}

.cards-why-day-traders-choose-fxt .div-card:hover .card-slide-up-title {
	transform: translateY(-15px);
	/* margin-bottom: 1.5rem; */
}

/* Description styling - smoother slide up */
.cards-why-day-traders-choose-fxt .card-slide-up-description {
	transform: translateY(50px);
	opacity: 0;
	/* transition: all 0.5s cubic-bezier(0.23, 1, 0.32, 1) 0.2s; */
	position: relative;
	z-index: 2;
	max-height: 0;
	overflow: hidden;
}

.cards-why-day-traders-choose-fxt .div-card:hover .card-slide-up-description {
	transform: translateY(0);
	opacity: 1;
	max-height: 400px;
}

/* Ensure all content is above overlay */
.cards-why-day-traders-choose-fxt .div-card * {
	position: relative;
	z-index: 2;
}

@media (max-width: 1024px) {
	.cards-why-day-traders-choose-fxt .div-card {
		height: 360px;
	}

    .cards-why-day-traders-choose-fxt .div-card .card-content {
        height: 160px;
        padding: 30px;
    }
}

@media (max-width: 992px) {
    .cards-why-day-traders-choose-fxt {
        gap: var(--spacing-8);
    }

	.cards-why-day-traders-choose-fxt .card-slide-up-title {
		font-size: 30px;
	}
}

@media (max-width: 768px) {
	.cards-why-day-traders-choose-fxt .card-slide-up-title {
		font-size: 24px;
	}

    .cards-why-day-traders-choose-fxt .div-card .card-content {
        height: 120px;
        padding: 30px;
    }

	.cards-why-day-traders-choose-fxt .div-card {
		height: 430px;
	}
}