.module-plans-table {
    background:var(--light-gray);
}

.module-plans-table .inner-wrapper {
    background:#fff;
    border-radius: 15px;
}

.module-plans-table .intro-wrapper {
    margin-bottom:4rem;
    text-align: center;
}

.module-plans-table .table-wrapper {
    overflow-x:auto;
}

.module-plans-table .table-wrapper.add-read-more {
    position: relative;
    transition: all .5s ease-in-out;
    max-height:200px;
    overflow-y: hidden;
}

.module-plans-table .table-wrapper.add-read-more.expanded {
    max-height: 5000px; /* Large enough to fit content */
}

.module-plans-table .table-wrapper.collapsed.add-read-more::after {
    content: "";
    position: absolute;
    bottom: 0;
    left: 0;
    width: 100%;
    height: 80px;
    background: linear-gradient(to bottom, rgba(255, 255, 255, 0), white);
    pointer-events: none; /* Don't block interactions */
    transition: opacity 0.3s ease;
    z-index:2;
}

.module-plans-table .expand-btn {
    display: flex;
    justify-content: center;
    align-items: center;
    cursor: pointer;
    text-transform: uppercase;
    padding: 10px;
    text-align: center;
    width: auto;
    margin: 10px auto; /* Keep it centered below table */
    font-weight: bold;
    transition: 0.3s;
    font-size:1.6rem;
}

.module-plans-table .expand-btn:after {
    content:'\f063';
    color:#000;
    font: var(--fa-font-solid);
    background-color:var(--yellow);
    border-radius: 50%;
    padding:2px;
    width:2.5rem;
    height:2.5rem;
    display: inline-flex;
    justify-content: center;
    align-items: center;
    font-size:1.6rem;
    margin-left:8px;
    text-decoration: none;
}

.module-plans-table .expand-btn.expanded:after {
    content:'\f062';
}

.module-plans-table table {
    width: 100%;
    border-collapse: collapse;
    border:0;
}

.module-plans-table table colgroup {
    display: none;
}

.module-plans-table table tr {
    height: auto !important;;
}

.module-plans-table table th, 
.module-plans-table table td {
    padding:1rem 2rem;
    text-align: center;
    font-size:1.6rem;
    position: relative;
    border:0;
}

.module-plans-table table td:first-child {
    text-align: left;
}

.module-plans-table .table-wrapper.first-row-is-header tr:first-child td {
    font-weight:bold;
    color:#000;
    text-transform: uppercase;
    border-bottom:2px solid #fff
}

.module-plans-table .table-wrapper.first-row-is-header tr:first-child td:nth-child(2) {
    background-color:var(--yellow);
}

.module-plans-table .table-wrapper.first-row-is-header tr:first-child td:nth-child(3) {
    background-color:var(--silver);
}

.module-plans-table .table-wrapper.first-row-is-header tr:first-child td:nth-child(4) {
    background-color:var(--medium-gray);
}

.module-plans-table .table-wrapper.first-row-is-header tr:first-child td:nth-child(5) {
    background-color:var(--light-gray);
}

.module-plans-table .table-wrapper.first-row-is-header tr:first-child td:first-child {
    background-color:transparent
}

.module-plans-table table td:after {
    content:'';
    position: absolute;
    right:0;
    top:0;
    width:2px;
    height:100%;
    background:#fff;
}

.module-plans-table .table-wrapper tr:nth-child(odd) td {
    background-color: var(--light-gray);
}

.module-plans-table .table-wrapper tr:hover td {
    background-color: var(--medium-gray);
}

.module-plans-table table td:before {
    content: ""; /* Necessary to display the pseudo-element */
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    pointer-events: none; /* Ensure the pseudo-element doesn't interfere with interactions */
    z-index: -1; /* Make sure the overlay is above the content but behind the cell content */
}

.module-plans-table table td:nth-child(2):before {
    background-color: rgba(255, 199, 44, 0.1);
}

.module-plans-table table td:nth-child(3):before {
    background-color: rgba(245, 244, 241, 0.1); 
}

.module-plans-table table td:nth-child(4):before {
    background-color: rgba(103, 104, 107, 0.1); 
}

.module-plans-table table td:nth-child(5):before {
    background-color: rgba(209, 204, 189, 0.1); 
}

table td, table th {
    z-index: 2; /* Ensure the content is always above the pseudo-element overlay */
}

.module-plans-table .mobile-tables {
    display: flex;
    gap:4rem;
    flex-wrap: wrap;
}

.module-plans-table table:not(.mobile-table) {
    display:none;
    margin-top:4rem;
}

.module-plans-table table.mobile-table td {
    width:50%;
}

.module-plans-table .table-wrapper.first-row-is-header .mobile-table.mobile-table-gold tr:first-child td {
    background-color: var(--yellow);
}

.module-plans-table .table-wrapper.first-row-is-header .mobile-table.mobile-table-silver tr:first-child td {
    background-color: var(--silver);
}

.module-plans-table .table-wrapper.first-row-is-header .mobile-table.mobile-table-bronze tr:first-child td {
    background-color: var(--medium-gray);
}

.module-plans-table .table-wrapper.first-row-is-header .mobile-table.mobile-table-platinum tr:first-child td {
    background-color: var(--light-gray);
}

.module-plans-table .table-wrapper.first-row-is-header .mobile-table.mobile-table-catastrophic tr:first-child td {
    background-color: var(--dark-gray);
    color:#fff;
}



@media (min-width:1200px) {
    .module-plans-table table:not(.mobile-table) {
        display:table;
    }

    .module-plans-table table.mobile-table {
        display:none;
    }
}