/**
 * Pricing Compare Table Styles
 * Version: 1.0.8 (Updated)
 */

/* ... (Wrapper, Header Row, Title Row CSS remains same) ... */

.pct-header-row,
.pct-feature-row.pct-cell-layout-row { /* Default Horizontal Layout */
    display: flex;
    flex-direction: row;
    min-width: 700px;
}

.pct-title-row {
    position: relative;
    font-weight: bold;
    cursor: default;
    min-width: 700px;
    border-bottom: 1px solid #eee;
    padding: 10px 15px;
}

.pct-title-row.pct-collapsible {
    cursor: pointer;
    display: flex;
    justify-content: space-between;
    align-items: center;
}

.pct-title-row .pct-toggle-icon {
    transition: transform 0.3s ease;
    display: inline-flex;
    align-items: center;
}

.pct-title-row.open .pct-toggle-icon {
    transform: rotate(180deg);
}

.pct-feature-col-spacer,
.pct-feature-label-cell {
    flex: 2; /* Feature label column is wider */
    flex-shrink: 0;
    padding: 15px;
    box-sizing: border-box;
    border-bottom: 1px solid #eee;
    font-weight: 500;
}

.pct-header-col {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: flex-start;
    border-left: 1px solid #eee;
    position: relative;
    background-color: #fff; /* Default BG if none is set in repeater */
    min-height: 180px; /* Give header space */
    flex: 1; /* Default flex */
    box-sizing: border-box;
}
.pct-feature-col-spacer {
    border-bottom: 1px solid #ddd;
}
.pct-header-col:first-of-type {
    border-left: none;
}

/* ** ALIGNMENT FIX: Cells are now direct flex children of .pct-feature-row (if horizontal) ** */
.pct-cell {
    flex: 1; /* Data columns are equal width by default */
    padding: 15px;
    text-align: center;
    box-sizing: border-box;
    border-bottom: 1px solid #eee;
    border-left: 1px solid #eee;
    transition: background-color 0.3s ease;
}

.pct-cell:first-of-type {
    border-left: none;
}

/* ... (Header Content, Button, Popular Badge CSS remains same) ... */


/* ** MAIN BUG FIX: Collapsible Child Layout ** */
.pct-collapsible-child {
    display: none; /* Hidden by default */
}

/* This rule forces visible child rows (that are horizontal) to maintain flex layout */
.pct-collapsible-child.pct-visible.pct-cell-layout-row {
    display: flex;
    flex-direction: row;
}
/* This rule forces visible child rows (that are vertical) to display correctly */
.pct-collapsible-child.pct-visible.pct-cell-layout-column {
    display: flex;
    flex-direction: row; /* The row itself is still flex */
    flex-wrap: wrap; /* But it wraps */
}

/* Indent child rows for better visual hierarchy */
.pct-collapsible-child .pct-feature-label-cell { 
    padding-left: 40px !important; 
}


/* ** NEW: Vertical Cell Layout Rules ** */
.pct-feature-row.pct-cell-layout-column {
    display: flex; /* Row itself is still flex */
    flex-direction: row; /* Row itself is still horizontal */
    flex-wrap: wrap; /* Allow wrapping */
    min-width: 700px;
}
.pct-feature-row.pct-cell-layout-column .pct-feature-label-cell {
    width: 100%;
    flex-basis: 100%; /* Label takes full width */
    border-bottom: 1px solid #eee;
}
/* This wrapper ONLY exists for vertical layouts */
.pct-feature-row.pct-cell-layout-column .pct-cells-wrapper {
    display: flex;
    flex-direction: column;
    flex-basis: 100%; /* Cell wrapper takes full width */
    width: 100%;
}
.pct-feature-row.pct-cell-layout-column .pct-cell {
    width: 100%; /* Make cells full width of wrapper */
    text-align: left; /* Align text left */
    padding-left: 40px; /* Indent cell content */
    border-left: none; /* No vertical borders needed */
}
/* Add indentation for child rows that are also vertical */
.pct-collapsible-child.pct-cell-layout-column .pct-cell {
    padding-left: 60px; /* Extra indent for nested vertical content */
}


/* ** UPDATED: Icon Size Fix (now per-cell) ** */
.pct-cell .pct-icon {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    /* Default size, will be overridden by inline styles from the repeater */
    font-size: 20px; 
    width: 20px;
    height: 20px;
}
/* These ensure SVG icons also scale with font-size */
.pct-cell .pct-icon i {
    font-size: inherit;
    width: inherit;
    height: inherit;
}
.pct-cell .pct-icon svg {
    width: inherit;
    height: inherit;
    height: 1em; /* Fix for SVG scaling */
    width: 1em;  /* Fix for SVG scaling */
}


/* ... (Sticky Header and Row Background CSS remains same) ... */