{% import "../_variables.css" as var %}

/* ============================================
   Comparison Table - Accordion Extension
   ============================================ */

/* Section Headers */

.comptab--accordion .comptab__section-header {
  display: flex;
  align-items: center;
  gap: 8px;
  background: var(--comptab-section-header-bg, rgba(0, 0, 0, 0.05));
  cursor: pointer;
  user-select: none;
  border-bottom: var(--comptab-bdw) solid var(--comptab-border-color, #ddd);
  font-weight: 600;
  /* Default: no rounded corners */
  border-radius: 0;
}

/* First section header: only top-left rounded (aligns with outer table) */
.comptab--accordion .comptab__section:first-child .comptab__section-header {
  border-top-left-radius: var(--comptab-radius);
}

/* Last section header when collapsed: only bottom corners rounded */
.comptab--accordion .comptab__section:last-child[data-expanded="false"] .comptab__section-header {
  border-bottom-left-radius: var(--comptab-radius);
  border-bottom-right-radius: var(--comptab-radius);
}

/* Feature rows: never have rounded corners */
.comptab--accordion .comptab__section-body .comptab__row .comptab__col {
  border-radius: 0 !important;
}

.comptab--accordion.comptab--dark .comptab__section-header {
  background: var(--comptab-section-header-bg, rgba(255, 255, 255, 0.08));
}

.comptab--accordion .comptab__section-header:hover {
  background: var(--comptab-section-header-bg-hover, rgba(0, 0, 0, 0.08));
}

.comptab--accordion.comptab--dark .comptab__section-header:hover {
  background: var(--comptab-section-header-bg-hover, rgba(255, 255, 255, 0.12));
}

/* Section Icons */

.comptab__section-icon {
  display: flex;
  align-items: center;
  justify-content: center;
  flex-shrink: 0;
}

.comptab__accordion-icon {
  width: 16px;
  height: 16px;
}

/* Show/hide icons based on expanded state */

.comptab__section[data-expanded="true"] .comptab__section-icon--collapsed,
.comptab__section[data-expanded="false"] .comptab__section-icon--expanded {
  display: none;
}

/* Hide section body when collapsed */

.comptab__section[data-expanded="false"] .comptab__section-body {
  display: none;
}

/* Outer container corners: maintain rounded corners on the overall table */

.comptab--accordion {
  border-radius: var(--comptab-radius);
  overflow: hidden;
}


/* Square corners override */

.comptab--square-corners .comptab__section-header {
  border-radius: 0 !important;
}

/* Responsive adjustments */

@media (max-width: px) {
  .comptab__accordion-icon {
    width: 16px;
    height: 16px;
  }
}

@media (max-width: px) {
  .comptab__accordion-icon {
    width: 16px;
    height: 16px;
  }
}

@media (max-width: px) {
  .comptab__section-header {
    gap: 6px;
  }
  .comptab__accordion-icon {
    width: 14px;
    height: 14px;
  }
}