.container_tabs {
    border-bottom: 3px solid rgba(239, 237, 239, 0.5);
}

.tab_button {
    position: relative;
    color: var(--black) !important;
    font-family: "SoletoTKHeadline_W_Lt";
    font-size: 1.5rem;
    padding: 24px 0px 12px 0;
    margin: 0 10px 0 0px;
    border: none;
    background: none;
}

@media (max-width: 575px) { 
    .tab_button {
        /* padding: 16px; */
        font-family: 'SoletoTK_W_Md';
    }
}

.tabs_hover_container:hover {
    background-color: var(--hover-blue-tabs);
}
/* Adjusted initial margin to move the line outside the button */
.tab_button::after {
    content: '';
    position: absolute;
    bottom: 0;
    left: 40%;
    right: 40%;
    height: 3px;
    background-color: transparent;
    margin: -25px 0; 
    transform: translateY(1);
    transition: margin 1s ease;
}

.tab_button.active::after {
    background-color: var(--dark-blue);
    height: 4px;
    margin: -3px 0; 
    transform: translateY(1);
    transition: margin 0.3s ease;
}

.tab_content {
    display: none;
    /* margin-top: 20px; */
    color: black;
}

/* TODO: Check - Might not be needed */
.tab_content.active {
    display: block;
}


@media (min-width: 575px) {
  .tabsRowPadding:nth-child(1) {
    padding-right: 12px !important;
  }

  .tabsRowPadding:nth-child(2) {
    padding-left: 12px !important;
    padding-right: 12px !important;
  }

  .tabsRowPadding:nth-child(3) {
    padding-left: 12px !important;
  }
}


/* Responsive font size */
@media screen and (max-width: 1200px) {
    .tab_button {
        font-size: 1.2rem; 
    }
}

@media screen and (max-width: 768px) {
    .tab_button {
        font-size: 0.9rem;
    }
}

.tabs_icon {
        height: 40px;
        width: auto;
    }
