/* Vertical tabs styling */
.nav-tabs-vertical {
    gap: 10px;
    flex-direction: column;
}

.nav-tabs-vertical .nav-item {
    border-bottom: 1px solid var(--primary-color);
    border-radius: 8px;       
}

.nav-tabs-vertical .nav-link {
    border-radius: 8px;
    color: var(--gray-700) !important;
    padding: var(--space-3) var(--space-4) !important;
}

.nav-tabs-vertical .nav-link:hover,
.nav-tabs-vertical .nav-link.active {
    background-color:  var(--primary-color) !important;
    color: var(--white) !important; 
}

.nav-tabs-vertical .nav-link span {
    display: block;
}


/* Content styling */
.why-choose .tab-content {
    padding-left: var(--space-4);
}

/* Transition styles */
.content-container {
    transition: all 0.3s ease;
}

.why-choose .accordion-item {
    color: var(--gray-900);
    background-color: var(--white);
    border-color: var(--gray-300);
}

.why-choose .accordion-button {
    font-size: var(--text-base);
    font-weight: var(--font-semibold);
}

.why-choose .accordion-button:not(.collapsed)::after {
    background-image: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16' fill='none' stroke='white' stroke-linecap='round' stroke-linejoin='round'><path d='M2 5L8 11L14 5'/></svg>");
}

.why-choose .accordion-button:not(.collapsed) {
    color: var(--white);
    background-color: var(--primary-color);
    box-shadow: unset;
}

.why-choose .accordion-button:focus {
    border-color: unset;
    box-shadow: unset;
}

/* Desktop layout adjustments */

@media (max-width: 1199px) {
    .vertical-tabs-content img {
        width: 100%;
        height: auto;
    }
}

@media (min-width: 992px) {
    .desktop-tabs-container {
        display: flex;
        align-items: center;
        justify-content: space-between;
    }
}

@media (min-width: 1200px) {
    .vertical-tabs-nav {
        width: 100%;
        max-width: 300px;
    }
    
    .vertical-tabs-content {
        width: 100%;
        max-width: 940px;
    }
}