/* --- Section Container --- */
.compare-programs-section {
    padding-top: 4rem; /* Equivalent to py-16 */
    padding-bottom: 4rem; /* Equivalent to py-16 */
    overflow: hidden;
}

.compare-programs-container {
    width: 100%;
    max-width: 80rem; /* Equivalent to max-w-7xl */
    margin-left: auto;
    margin-right: auto;
    padding-left: 1rem; /* Equivalent to px-4 */
    padding-right: 1rem;
}

@media (min-width: 640px) { /* sm breakpoint */
    .compare-programs-container {
        padding-left: 1.5rem; /* sm:px-6 */
        padding-right: 1.5rem;
    }
}

@media (min-width: 1024px) { /* lg breakpoint */
    .compare-programs-container {
        padding-left: 2rem; /* lg:px-8 */
        padding-right: 2rem;
    }
}

/* --- Section Header --- */
.compare-header {
    text-align: center;
    margin-bottom: 3rem; /* Equivalent to mb-12 */
}

.compare-title {
    font-size: 1.875rem; /* Equivalent to text-3xl */
    font-weight: 700; /* Equivalent to font-bold */
    color: #001f3f; /* Representative for dark-navy */
    margin-bottom: 1rem; /* Equivalent to mb-4 */
}

@media (min-width: 768px) { /* md breakpoint */
    .compare-title {
        font-size: 2.25rem; /* Equivalent to md:text-4xl */
    }
}

.compare-subtitle {
    font-size: 1.125rem; /* Equivalent to text-lg */
    color: #4b5563; /* Equivalent to text-gray-600 */
    max-width: 48rem; /* Equivalent to max-w-3xl */
    margin-left: auto;
    margin-right: auto;
}

/* --- Desktop Table Layout (hidden on mobile, visible on lg) --- */
.desktop-table-container {
    display: none; /* hidden */
}

@media (min-width: 1024px) { /* lg breakpoint */
    .desktop-table-container {
        display: block; /* lg:block */
    }
}

.desktop-table-wrapper {
    background-color: #fff; /* bg-white */
    overflow-x: auto; /* Allow horizontal scroll on smaller desktop screens */
    border-radius: 0.5rem; /* added for style */
}

.desktop-table {
    width: 100%;
    border-collapse: collapse; /* Ensure table borders are single lines */
    table-layout: fixed; /* Fix table layout for consistent columns */
}

.table-header-cell {
    width: 25%; /* w-1/4 */
    padding: 1.5rem; /* py-6 */
    text-align: center;
    color: #fff;
    font-weight: 600; /* font-semibold */
    border-color: transparent; /* border-0 */
}

    .table-header-cell.benefits-column {
        text-align: left; /* Aligns "Benefits" to the left */
    }

.program-header-content {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 0.75rem; /* space-y-3 */
}

.program-logo {
    width: 4rem; /* w-16 */
    height: auto; /* h-auto */
}

.program-name {
    font-weight: 600;
    color: #fff;
}

.program-subtitle {
    font-size: 0.875rem; /* text-sm */
    color: rgba(135, 206, 235, 0.9); /* text-light-blue/90 */
}

.table-body-row {
    border-color: transparent; /* border-0 */
    transition: background-color 0.2s ease-in-out;
}

    .table-body-row.bg-gray-50 {
        background-color: #f9fafb; /* bg-gray-50 */
    }

    .table-body-row.bg-white {
        background-color: #fff; /* bg-white */
    }

    .table-body-row:hover {
        background-color: rgba(135, 206, 235, 0.05); /* hover:bg-light-blue/5 */
    }

.table-body-cell {
    padding: 1.5rem; /* py-6 */
    text-align: center;
    border-color: transparent; /* border-0 */
}

.benefit-name-cell {
    text-align: left;
    font-weight: 500;
    color: #1a202c; /* text-gray-900 */
}

.program-detail-cell {
    color: #374151; /* text-gray-700 */
    font-size: 0.875rem; /* text-sm */
}

/*.program-detail-cell.icon-cell {
    display: flex;
    align-items: center;
    justify-content: center;
}*/

.check-icon {
    height: 1.25rem; /* h-5 */
    width: 1.25rem; /* w-5 */
    color: #005EB8; /* text-daikin-blue */
    stroke: currentColor;
}


/* --- Mobile Accordion Layout (visible on mobile, hidden on lg) --- */
.mobile-accordion-container {
    display: block; /* Show by default */
}

@media (min-width: 1024px) { /* lg breakpoint */
    .mobile-accordion-container {
        display: none; /* lg:hidden */
    }
}

.mobile-accordion-container > *:not(:last-child) {
    margin-bottom: 1rem; /* space-y-4 */
}

.mobile-accordion-item {
    border: 1px solid #e5e7eb; /* border border-gray-200 */
    border-radius: 0.5rem; /* rounded-lg */
    overflow: hidden;
}

.mobile-accordion-trigger {
    width: 100%;
    padding: 1rem; /* px-4 py-6 */
    background-color: #001f3f; /* bg-dark-navy */
    color: #fff;
    display: flex;
    align-items: center;
    justify-content: space-between;
    border: none;
    cursor: pointer;
    transition: background-color 0.2s ease-in-out;
}

    .mobile-accordion-trigger:hover {
        background-color: rgba(0, 31, 63, 0.9); /* hover:bg-dark-navy/90 */
    }

    .mobile-accordion-trigger.is-open .mobile-chevron-icon {
        transform: rotate(180deg);
    }

.mobile-accordion-title-group {
    display: flex;
    align-items: center;
    gap: 0.75rem; /* space-x-3 */
}

.mobile-program-logo {
    width: 2.5rem; /* w-10 */
    height: auto; /* h-auto */
}

.mobile-program-text {
    text-align: left;
}

.mobile-program-name {
    font-weight: 600;
}

.mobile-program-subtitle {
    font-size: 0.875rem;
    color: rgba(135, 206, 235, 0.9); /* text-light-blue/90 */
}

.mobile-chevron-icon {
    height: 1.25rem; /* h-5 */
    width: 1.25rem; /* w-5 */
    transition: transform 0.3s ease-in-out;
    stroke: currentColor;
}

.mobile-accordion-item.is-open svg {
    transform: rotate(270deg);
    transition: 0.3s linear;
}

.mobile-accordion-item:not(.is-open) svg {
    transform: rotate(90deg);
    transition: 0.3s linear;
}

.mobile-accordion-content {
    max-height: 0;
    overflow: hidden;
    transition: max-height 0.3s ease-in-out;
    background-color: #fff;
}

.mobile-benefit-item {
    display: flex;
    flex-direction: column;
    padding: 0.75rem 1rem; /* px-4 py-3 */
    border-bottom: 1px solid #f3f4f6; /* border-b border-gray-100 */
}

    .mobile-benefit-item.last {
        border-bottom: 0; /* last:border-b-0 */
    }

.mobile-benefit-category {
    font-weight: 500;
    color: #1a202c; /* text-gray-900 */
    margin-bottom: 0.5rem; /* mb-2 */
}

.mobile-benefit-value {
    padding-left: 1rem; /* pl-4 */
    font-size: 0.875rem; /* text-sm */
    color: #4b5563; /* text-gray-700 */
}

.mobile-benefit-value.icon-value {
    display: flex;
    align-items: center;
    justify-content: flex-start;
}

.mobile-benefit-value.icon-value span {
    font-size: 1.5rem;
    font-weight: 400;
    color: #9ca3af;
}

@media (min-width: 768px) {
    .program-subtitle {
        display: none;
    }
}

@media (max-width: 767px) {
    .table-header-row {
        background-color: #001f3f; /* bg-dark-navy */
        border-color: transparent; /* border-0 */
    }
}