/* TOC Wrapper */
.yj-toc {
	padding: 20px 0;
    border-radius: 16px;
    box-shadow: 0px 2px 10px 0px rgba(0, 0, 0, 0.02);
}

/* TOC Header */
.yj-toc-header {
	padding: 0 24px;
    margin: 0;
    border: 0;
    background: transparent;
    cursor: pointer;
}
/* *** */
.yj-toc-icon {
    flex-shrink: 0;
    transition: transform 0.3s ease;
}
.yj-toc-icon img {
    display: block;
    width: 20px;
    height: 20px;
}
.yj-toc-header[aria-expanded="true"] .yj-toc-icon {
    transform: rotate(180deg);
}

/* TOC Items Wrapper */
.yj-toc-content {
    display: grid;
    grid-template-rows: 0fr;
    transition: grid-template-rows 0.3s ease;
}
.yj-toc-content>.yj-toc-list {
    min-height: 0;
}
.yj-toc-content.is-open {
    grid-template-rows: 1fr;
}

/* TOC List */
.yj-toc-list {
/* 	max-height: calc(100vh - 172px); */
}

/* TOC Item */
.toc-item {
	text-decoration: none;
	padding: 16px 24px;
	border-bottom: solid 1px #e8e8e8;
    transition: all 400ms;
}
.toc-item:hover {
	padding: 16px 24px 16px 32px;
	background-color: #e8e8e840;
}
.toc-item:last-child {
	border: 0px;
}
.toc-item:first-child {
	margin: 12px 0 0 0;	
}
/* *** */
.yj-toc .toc-item-number {
    margin: 0;
    flex-shrink: 0;
}
/* *** */
.yj-toc .toc-item-text {
    display: -webkit-box;
	-webkit-line-clamp: 2;
	-webkit-box-orient: vertical;
	overflow: hidden;
}


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

@media (max-width: 767px) {
    .yj-toc-list {
        gap: 12px;
    }

    .yj-toc .toc-item {
        gap: 12px;
    }
}