/*
==================================================
YLIG TABLE OF CONTENTS
==================================================
*/

/*
==================================================
MAIN CONTAINER
==================================================
*/

.ylig-table-of-contents {
    width: 100%;
    position: relative;
}


/*
==================================================
TITLE — "IN THIS ARTICLE"
==================================================
*/

.ylig-table-of-contents .ylig-toc-title {
    margin: 0 0 25px;
    padding: 0;
}


/*
==================================================
TOC LIST
==================================================
*/

.ylig-table-of-contents .ylig-toc-list {
    width: 100%;
    margin: 0;
    padding: 0;
}


/*
==================================================
MAIN H2 GROUP
==================================================
*/

.ylig-table-of-contents .ylig-toc-parent {
    width: 100%;
    margin: 0;
    padding: 0;
}


/*
==================================================
MAIN TOC ITEM
==================================================
*/

.ylig-table-of-contents .ylig-toc-item {
    display: flex;
    align-items: baseline;
    width: 100%;
    margin: 0 0 10px;
    padding: 0;
}


/*
==================================================
NUMBERS
==================================================
*/

.ylig-table-of-contents .ylig-toc-number {
    flex: 0 0 auto;
    display: inline-block;
}


/*
==================================================
MAIN LINKS
==================================================
*/

/*
IMPORTANT:
!important overrides theme/global pink link styling.
*/

.ylig-table-of-contents .ylig-toc-link {
    color: #000000 !important;

    text-decoration-line: underline;
    text-decoration-color: #FFA7C7 !important;
    text-decoration-thickness: 1px;
    text-underline-offset: 2px;

    cursor: pointer;

    transition:
        color 0.2s ease,
        text-decoration-color 0.2s ease;
}


/*
Main link hover.
*/

.ylig-table-of-contents .ylig-toc-link:hover {
    color: #000000 !important;
}


/*
==================================================
HIERARCHY CHILDREN
==================================================
*/

/*
H3 children are hidden by default.
*/

.ylig-table-of-contents .ylig-toc-children {
    display: none !important;

    width: 100%;
    margin: 0;
    padding: 0 0 0 40px;
}


/*
When the MAIN H2 is hovered,
show ONLY its children.
*/

.ylig-table-of-contents
.ylig-toc-parent:hover
> .ylig-toc-children {
    display: block !important;
}


/*
==================================================
CHILD ITEMS
==================================================
*/

.ylig-table-of-contents .ylig-toc-child {
    display: block;

    width: 100%;
    margin: 0 0 8px;
    padding: 0;
}


/*
==================================================
CHILD LINKS
==================================================
*/

.ylig-table-of-contents .ylig-toc-child-link {
    color: #000000 !important;

    text-decoration-line: underline;
    text-decoration-color: #FFA7C7 !important;
    text-decoration-thickness: 1px;
    text-underline-offset: 2px;

    cursor: pointer;

    transition:
        color 0.2s ease,
        text-decoration-color 0.2s ease;
}


/*
Child hover.
*/

.ylig-table-of-contents .ylig-toc-child-link:hover {
    color: #000000 !important;
}


/*
==================================================
FORCE YLIG COLORS OVER THEME / ELEMENTOR
==================================================
*/

.ylig-table-of-contents a.ylig-toc-link,
.ylig-table-of-contents a.ylig-toc-child-link,
.ylig-table-of-contents a.ylig-toc-link:visited,
.ylig-table-of-contents a.ylig-toc-child-link:visited {
    color: #000000 !important;
}


/*
Hover/focus/active states.
*/

.ylig-table-of-contents a.ylig-toc-link:hover,
.ylig-table-of-contents a.ylig-toc-link:focus,
.ylig-table-of-contents a.ylig-toc-link:active,
.ylig-table-of-contents a.ylig-toc-child-link:hover,
.ylig-table-of-contents a.ylig-toc-child-link:focus,
.ylig-table-of-contents a.ylig-toc-child-link:active {
    color: #000000 !important;
}


/*
==================================================
UNDERLINE
==================================================
*/

.ylig-table-of-contents a.ylig-toc-link,
.ylig-table-of-contents a.ylig-toc-child-link {
    text-decoration-line: underline !important;
    text-decoration-color: #FFA7C7 !important;
}


/*
==================================================
EMPTY MESSAGE
==================================================
*/

.ylig-table-of-contents .ylig-toc-empty {
    margin: 0;
    padding: 0;
}


/*
==================================================
ACCESSIBILITY
==================================================
*/

.ylig-table-of-contents a:focus-visible {
    outline: 2px solid #FFA7C7;
    outline-offset: 3px;
}


/*
==================================================
MOBILE
==================================================
*/

@media (max-width: 767px) {

    .ylig-table-of-contents
    .ylig-toc-children {
        padding-left: 25px;
    }

}


/*
==================================================
ELEMENTOR EDITOR
==================================================
*/

.elementor-editor-active
.ylig-table-of-contents
.ylig-toc-link,
.elementor-editor-active
.ylig-table-of-contents
.ylig-toc-child-link {
    color: #000000 !important;
}