.doc-section .doc-box .doc-left .doc-title-list{
    overflow-y: auto;
    max-height: calc(100vh - 260px);
    scroll-behavior: smooth;
}
.doc-section .doc-box .doc-left h5{
    margin: 30px 0 10px;
    font-size: 18px;
    color: #1C1058;
    font-weight: 500;
}
.doc-section .doc-box .doc-content h1 span,
.doc-section .doc-box .doc-titles ul li a span,
.doc-section .doc-box .doc-toc ul li a span {
    font-size: 11px;
    text-transform: uppercase;
    color: #5b3ec1;
    background-color: #ece7ff;
    border-radius: 4px;
    padding: 4px 7px;
    position: relative;
    top: -2px;
    left: 7px;
    font-weight: 600;
    letter-spacing: 1px;
}
.doc-section {
    margin-top: 56px;
    margin-bottom: 80px;
    flex: 1;
}
.doc-section .doc-box {
    display: flex;
    justify-content: space-between;
}
.doc-section .doc-box .doc-left {
    padding-right: 20px;
}
.doc-section .doc-box .doc-titles {
    flex: 0 23%;
    position: relative;
}
.doc-section .doc-box .doc-content {
    flex: 0 53%;
    color: #3C2D88;
    font-size: 15px;
    font-weight: 400;
    line-height: 18.2px;
    letter-spacing: 0.05em;
    padding: 0 20px;
}
.doc-section .doc-box .doc-toc {
    flex: 0 23%;
    padding-left: 30px;
    position: relative;
}
.doc-section .doc-box .doc-titles .doc-titles-group,
.doc-section .doc-box .doc-toc .doc-toc-group {
    position: sticky;
    top: 140px;
}
.doc-section .doc-box .doc-titles h3 {
    color: #1C1058;
    font-size: 18px;
    font-weight: 600;
    line-height: 21.6px;
}
.doc-section .doc-box .doc-titles ul {
    margin: 0 0 0 5px;
    padding: 0;
    list-style: none;
}
.doc-section .doc-box .doc-titles ul li {
    position: relative;
}
.doc-section .doc-box .doc-titles ul li a {
    color: #533AD8;
    font-weight: 500;
    font-size: 14px;
    line-height: 18.2px;
}
/*.doc-section .doc-box .doc-titles ul li a span,*/
/*.doc-section .doc-box .doc-toc ul li a span {*/
/*    background-color: #74b27b;*/
/*    color: #fff;*/
/*}*/
.doc-section .doc-box .doc-titles ul li a.active {
    color: #042626;
}
.doc-section .doc-box .doc-titles ul li i {
    position: absolute;
    right: 15px;
    color: #5B3EC1;
    font-size: 14px;
    top: 5px;
    cursor: pointer;
    transition: transform 0.3s;
}
.doc-section .doc-box .doc-titles ul li i.open {
    transform: rotate(180deg);
}
.doc-section .doc-box .doc-titles ul li ul.doc-child-title {
    height: 0;
    overflow: hidden;
    transition: height 0.3s, margin 0.3s;
    border-left: 2px solid #A59DC4;
    margin: 0;
}
.doc-section .doc-box .doc-titles ul li ul.doc-child-title li {
    margin-bottom: 10px;
    padding: 0 20px;
}
.doc-section .doc-box .doc-titles ul li ul.doc-child-title li.active,
.doc-section .doc-box .doc-titles ul.doc-title li.active{
    background: linear-gradient(180deg, #7F69F4 0%, #533AD8 100%);
    padding: 3px 20px;
}
.doc-section .doc-box .doc-titles ul.doc-title li.active{
    padding: 3px 10px;
}
.doc-section .doc-box .doc-titles ul li ul.doc-child-title li a {
    color: #533AD8;
    font-size: 14px;
    font-weight: 500;
    line-height: 18.2px;
}
.doc-section .doc-box .doc-titles ul li ul.doc-child-title li.active a,
.doc-section .doc-box .doc-titles ul li.active a{
    color: #fff;
}
.doc-section .doc-box .doc-content nav.breadcrumbs span{
    color: #3C2D88;
}
.doc-section .doc-box .doc-content nav.breadcrumbs {
    font-size: 12px;
    font-weight: 500;
    line-height: 15.6px;
    color: #3b423b;
}
.doc-section .doc-box .doc-content nav.breadcrumbs a {
    text-decoration: none !important;
}
.doc-section .doc-box .doc-content h1 {
    font-size: 24px;
    font-weight: 500;
    line-height: 28.8px;
    color: #1C1058;
    margin-top: 24px;
    margin-bottom: 32px;
}
.doc-section .doc-box .doc-content h1 span {
    background-color: #daf5f5;
    color: #036666;
}
.doc-section .doc-box .doc-content h2 {
    font-size: 20px;
    font-weight: 500;
    line-height: 21.6px;
    color: #1C1058;
    border-bottom: 1px solid #DFCDF8;
    padding-bottom: 10px;
    margin-bottom: 24px;
    margin-top: 32px;
}
.doc-section .doc-box .doc-content h2 span {
    font-size: 12px;
    text-transform: uppercase;
    color: #5b3ec1;
    background-color: #ece7ff;
    border-radius: 4px;
    padding: 4px 7px;
    position: relative;
    top: -2px;
    left: 7px;
    font-weight: 600;
    letter-spacing: 1px;
}
.doc-section .doc-box .doc-content h3 {
    font-size: 18px;
    font-weight: 600;
    color: #473E69;
}
.doc-section .doc-box .doc-content h4,
.doc-section .doc-box .doc-content h5,
.doc-section .doc-box .doc-content h6 {
    font-size: 16px;
    font-weight: 600;
    color: #473E69;
}
.doc-section .doc-box .doc-content a {
    color: #533AD8;
    font-weight: 600;
    text-decoration: underline;
}
.doc-section .doc-box .doc-content ol li,
.doc-section .doc-box .doc-content ul li {
    line-height: 22.4px;
    margin-bottom: 10px;
}
.doc-section .doc-box .doc-toc h4 {
    font-size: 14px;
    font-weight: 500;
    line-height: 18.2px;
    color: #1C1058;
    margin-bottom: 20px;
}
.doc-section .doc-box .doc-content p {
    line-height: 22px;
    margin-bottom: 20px;
}
.doc-section .doc-box .doc-content img{
    margin-bottom: 20px;
}
.doc-section .doc-box .doc-toc ul {
    list-style: none;
    padding: 0;
    margin: 0;
}
.doc-section .doc-box .doc-toc ul li a {
    color: #533AD8;
    font-size: 14px;
    font-weight: 500;
    line-height: 18.2px;
}
.doc-section .doc-box .doc-toc ul li a:focus {
    outline: 0 !important;
}
.doc-section .doc-box .doc-toc ul li.active a {
    color: #74b27b;
}
.doc-section .doc-box .doc-titles .doc-mobile-dropdown select{
    width: 100%;
    background-color: #473e69;
    color: #ece7ff;
    font-size: 14px;
    line-height: 14px;
    font-weight: 600;
    border-radius: 8px;
    padding: 12px 10px;
    appearance: none;
    height: 45px;
}
.doc-section .doc-box .doc-titles .doc-mobile-dropdown select:focus-visible{
    outline: none !important;
}
.doc-section .doc-box .doc-titles .doc-title-mobile:before{
    content: "▼";
    position: absolute;
    top: 83%;
    right: 15px;
    transform: translateY(-50%);
    pointer-events: none;
    font-size: 14px;
    color: #ece7ff;
}
.doc-section .doc-box .doc-titles .doc-mobile-dropdown select option{
    font-size: 14px;
    font-weight: 400;
    background-color: #ffffff;
    color: #473e69
}
@media (min-width: 0px) and (max-width: 767px) {
    .doc-toc, .doc-title, .doc-section .doc-box .doc-left h5 {
        display: none;
    }
    .doc-section .doc-box .doc-content {
        flex: 0 100%;
    }
    .doc-section .doc-box .doc-content {
        flex: 0 100%;
        padding: 0 10px;
    }
    .doc-section .doc-box .doc-content ul, .doc-section .doc-box .doc-content ol{
        margin-left: 20px;
    }
    .doc-section .doc-box{
        flex-wrap: wrap;
    }
    .doc-section .doc-box .doc-titles{
        flex: 0 100%;
        padding: 0 10px;
        margin-bottom: 40px;
    }
    .doc-section .doc-box .doc-titles .doc-left{
        padding-right: 0;
    }
    .doc-section .doc-box .doc-titles h3{
        margin-bottom: 8px;
    }
}
@media (min-width: 768px) and (max-width: 1024px) {
    .doc-toc, .doc-title {
        display: none;
    }
    .doc-section .doc-box .doc-content {
        flex: 0 100%;
    }
    .doc-section .doc-box{
        flex-wrap: wrap;
    }
    .doc-section .doc-box .doc-titles{
        flex: 0 100%;
        padding: 0 10px;
        margin-bottom: 40px;
    }
    .doc-section .doc-box .doc-titles .doc-left{
        padding-right: 0;
    }
    .doc-section .doc-box .doc-titles h3{
        margin-bottom: 8px;
    }
}

/* Search Bar Styles */
.doc-search-wrapper {
    position: relative;
    margin-bottom: 20px;
}

#cd-doc-search {
    width: 100%;
    padding: 10px 15px;
    border: 1px solid #786F9B;
    border-radius: 6px;
    font-size: 14px;
    color: #3b423b;
    background-color: #fff;
    transition: border-color 0.3s;
}

#cd-doc-search:focus {
    outline: none;
    border-color: #D6CCFA;
    border-width: 2px;
}

.cd-search-results {
    display: none;
    position: absolute;
    top: 100%;
    left: 0;
    width: 100%;
    background: #fff;
    border: 1px solid #786F9B;
    border-radius: 0 0 6px 6px;
    box-shadow: 0 4px 6px rgba(0,0,0,0.1);
    z-index: 100;
    max-height: 300px;
    overflow-y: auto;
}

.cd-search-results ul {
    list-style: none;
    margin: 0;
    padding: 0;
}

.cd-search-results li {
    border-bottom: 1px solid #f0f0f0;
}

.cd-search-results li:last-child {
    border-bottom: none;
}

.cd-search-results li a {
    display: block;
    padding: 10px 15px;
    color: #3b423b;
    text-decoration: none;
    font-size: 14px;
    transition: background 0.2s;
}

.cd-search-results li a:hover {
    background-color: #f9f9f9;
    color: #74b27b;
}

.cd-search-results .no-results {
    padding: 10px 15px;
    color: #888;
    font-size: 13px;
    margin: 0;
}

/* Category List Styles */
.doc-categories-list {
    display: flex;
    flex-wrap: wrap;
    gap: 40px;
    margin-top: 30px;
    justify-content: center;
    width: 80% !important;

}
.doc-categories-list .doc-category-item{
    flex: 0 48%;
    background-color: #ece7ff;
    padding: 30px;
    border-radius: 10px;
    border: 1px solid #B8A7F6;
}
.doc-categories-list .doc-category-item h2 {
    font-weight: 600;
    font-size: 24px;
    line-height: 32px;
    letter-spacing: -1px;
    color: #473E69;
    margin: 0;
}

.doc-categories-list .doc-category-item ul {
    list-style: none;
    padding: 0;
    margin: 20px 0 40px;
}

.doc-categories-list .doc-category-item ul li {
    margin-bottom: 10px;
    position: relative;
    padding-left: 24px;
}

.doc-categories-list .doc-category-item ul li:before {
    content: "";
    position: absolute;
    background-image: url('data:image/svg+xml,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 640 640"><path fill="%23473e69" d="M192 112L304 112L304 200C304 239.8 336.2 272 376 272L464 272L464 512C464 520.8 456.8 528 448 528L192 528C183.2 528 176 520.8 176 512L176 128C176 119.2 183.2 112 192 112zM352 131.9L444.1 224L376 224C362.7 224 352 213.3 352 200L352 131.9zM192 64C156.7 64 128 92.7 128 128L128 512C128 547.3 156.7 576 192 576L448 576C483.3 576 512 547.3 512 512L512 250.5C512 233.5 505.3 217.2 493.3 205.2L370.7 82.7C358.7 70.7 342.5 64 325.5 64L192 64zM248 320C234.7 320 224 330.7 224 344C224 357.3 234.7 368 248 368L392 368C405.3 368 416 357.3 416 344C416 330.7 405.3 320 392 320L248 320zM248 416C234.7 416 224 426.7 224 440C224 453.3 234.7 464 248 464L392 464C405.3 464 416 453.3 416 440C416 426.7 405.3 416 392 416L248 416z"/></svg>');
    width: 20px;
    height: 20px;
    left: -2px;
    top: 3px;
    background-repeat: no-repeat;
    background-position: left
}

.doc-categories-list .doc-category-item ul li a {
    color: #473e69;
    text-decoration: none;
    font-size: 16px;
    transition: .2s ease all;
    font-weight: 400;
}
.doc-categories-list .doc-category-item a.view-details-link{
    background-color: #5b3ec1;
    color: #fff;
    border-radius: 6px;
    padding: 10px 26px;
    font-weight: 500;
    font-size: 16px;
    line-height: 100%;
}