/* Base Structural CSS for Advanced Chapter Accordion */

.adv-accordion-container {
    width: 100%;
}

.adv-accordion-item {
    transition: background-color 0.3s ease, border-color 0.3s ease, box-shadow 0.3s ease;
    overflow: hidden;
    width: 100%;
}

.adv-accordion-header {
    display: grid !important;
    grid-template-columns: auto minmax(0, 1fr) auto auto !important;
    align-items: center !important;
    width: 100% !important;
    background: transparent;
    border: none;
    cursor: pointer;
    text-align: left;
    outline: none;
    box-sizing: border-box;
    transition: background-color 0.3s ease;
}

.adv-accordion-header:focus-visible {
    outline: 2px solid var(--e-global-color-primary, #333);
}

.adv-accordion-header a {
    text-decoration: none;
    color: inherit;
}

.chap-num {
    margin-right: 8px;
    pointer-events: none;
    white-space: nowrap;
    flex-shrink: 0;
}

.chap-title {
    min-width: 0 !important;
    width: 100% !important;
    white-space: normal !important;
    overflow-wrap: break-word !important;
    word-break: normal !important;
    line-height: 1.3 !important;
    pointer-events: none;
    text-align: left;
    overflow: visible !important;
    text-overflow: clip !important;
}

.chap-page {
    white-space: nowrap !important;
    flex-shrink: 0 !important;
    margin-left: auto !important;
    padding-left: 12px !important;
    padding-right: 12px !important;
    pointer-events: none;
}

.chap-chevron {
    white-space: nowrap !important;
    flex-shrink: 0 !important;
    display: inline-flex !important;
    align-items: center;
    justify-content: center;
    transition: transform 0.3s ease;
    pointer-events: none;
}

/* Rotate Chevron on Active State */
.adv-accordion-item.is-active .chap-chevron {
    transform: rotate(90deg);
}

.adv-accordion-content {
    box-sizing: border-box;
    overflow: hidden;
}

.panel-inner {
    display: flex;
    flex-direction: row;
    align-items: stretch;
}

.accent-line {
    display: inline-block;
    align-self: stretch;
    flex-shrink: 0;
}

.sections-list {
    flex-grow: 1;
    display: flex;
    flex-direction: column;
}

.sub-sec-row {
    display: grid;
    grid-template-columns: minmax(0, 1fr) auto;
    align-items: center;
    column-gap: 16px;
    transition: color 0.2s ease;
}

.sub-sec-row.is-bold {
    font-weight: bold;
}

.sub-sec-title {
    word-break: break-word;
}

.sub-sec-title a {
    text-decoration: none;
    color: inherit;
}

.sub-sec-page {
    text-align: right;
    white-space: nowrap;
}

/* Individual Chapter Colors Override CSS variables support */
.adv-accordion-item.has-custom-colors .chap-title { color: var(--chap-title-color) !important; }
.adv-accordion-item.has-custom-colors .chap-title a { color: var(--chap-title-color) !important; }
.adv-accordion-item.has-custom-colors .chap-page { color: var(--chap-page-color) !important; }
.adv-accordion-item.has-custom-colors .chap-num { color: var(--chap-title-color) !important; }
.adv-accordion-item.has-custom-colors .adv-accordion-header { background-color: var(--chap-header-bg) !important; }

.adv-accordion-item.has-custom-colors .adv-accordion-header:hover .chap-title { color: var(--chap-hover-color) !important; }
.adv-accordion-item.has-custom-colors .adv-accordion-header:hover .chap-page { color: var(--chap-hover-color) !important; }

.adv-accordion-item.has-custom-colors.is-active .chap-title { color: var(--chap-active-color) !important; }
.adv-accordion-item.has-custom-colors.is-active .chap-page { color: var(--chap-active-color) !important; }
.adv-accordion-item.has-custom-colors.is-active .adv-accordion-header { background-color: var(--chap-active-bg) !important; }
.adv-accordion-item.has-custom-colors .accent-line { background-color: var(--chap-accent-color) !important; }