.elementor-kit-6{--e-global-color-primary:#12202A;--e-global-color-secondary:#EB8C22;--e-global-color-text:#12202A;--e-global-color-accent:#2754A6;--e-global-color-b1e0118:#FFFFFF;--e-global-color-8deb45c:#FF1B9D;--e-global-color-6c7696a:#002060;--e-global-typography-primary-font-family:"Open Sans";--e-global-typography-primary-font-weight:400;--e-global-typography-secondary-font-family:"Poppins";--e-global-typography-secondary-font-weight:400;--e-global-typography-text-font-family:"Open Sans";--e-global-typography-text-font-weight:400;--e-global-typography-accent-font-family:"Prompt";--e-global-typography-accent-font-weight:400;color:var( --e-global-color-text );font-size:14px;line-height:20px;}.elementor-kit-6 e-page-transition{background-color:#FFBC7D;}.elementor-kit-6 a{font-family:var( --e-global-typography-accent-font-family ), Sans-serif;font-weight:var( --e-global-typography-accent-font-weight );}.elementor-kit-6 h1{color:var( --e-global-color-primary );font-family:"Poppins", Sans-serif;font-size:65px;font-weight:600;}.elementor-kit-6 h2{color:var( --e-global-color-primary );font-family:"Open Sans", Sans-serif;font-size:40px;font-weight:400;}.elementor-kit-6 h3{color:var( --e-global-color-primary );font-family:"Open Sans", Sans-serif;font-size:25px;font-weight:400;}.elementor-kit-6 h4{color:var( --e-global-color-primary );font-family:"Open Sans", Sans-serif;font-size:20px;font-weight:400;}.elementor-kit-6 h5{font-family:"Open Sans", Sans-serif;font-size:15px;font-weight:400;}.elementor-section.elementor-section-boxed > .elementor-container{max-width:1160px;}.e-con{--container-max-width:1160px;}.elementor-widget:not(:last-child){margin-block-end:20px;}.elementor-element{--widgets-spacing:20px 20px;--widgets-spacing-row:20px;--widgets-spacing-column:20px;}{}h1.entry-title{display:var(--page-title-display);}.site-header .site-branding{flex-direction:column;align-items:stretch;}.site-header{padding-inline-end:0px;padding-inline-start:0px;}.site-footer .site-branding{flex-direction:column;align-items:stretch;}@media(max-width:1024px){.elementor-section.elementor-section-boxed > .elementor-container{max-width:1024px;}.e-con{--container-max-width:1024px;}}@media(max-width:767px){.elementor-kit-6 h1{font-size:45px;}.elementor-kit-6 h2{font-size:30px;line-height:36px;}.elementor-section.elementor-section-boxed > .elementor-container{max-width:767px;}.e-con{--container-max-width:767px;}}/* Start custom CSS */.page-nav-icons .elementor-icon-list-item.active {
    background: #eb8c22 !important;   /* solid orange */
    border-radius: 4px;
    padding: 6px 10px;
}

/* Active text + icon color */
.page-nav-icons .elementor-icon-list-item.active a,
.page-nav-icons .elementor-icon-list-item.active .elementor-icon-list-text,
.page-nav-icons .elementor-icon-list-item.active .elementor-icon-list-icon i {
    color: #ffffff !important;        /* white text/icons */
    font-weight: 600;
}

/* (Optional) remove any left border if previously added */
.page-nav-icons .elementor-icon-list-item.active {
    border-left: none !important;
}


/* ================================
   TOOLTIP FOR EACH ICON ITEM
   ================================ */

/* Make sure link can hold tooltip */
.page-nav-icons .elementor-icon-list-item a {
    position: relative;
}

/* Hidden by default */
.page-nav-icons .elementor-icon-list-item a::after,
.page-nav-icons .elementor-icon-list-item a::before {
    opacity: 0;
    pointer-events: none;
    transition: opacity 0.2s ease-in-out;
}

/* Tooltip bubble */
.page-nav-icons .elementor-icon-list-item a:hover::after {
    content: attr(data-tooltip);      /* text from data-tooltip attribute */
    position: absolute;
    background: #eb8c22;              /* solid orange tooltip */
    color: #ffffff;                   /* white text */
    padding: 6px 10px;
    border-radius: 4px;
    white-space: nowrap;
    top: -40px;                       /* show above item; adjust if needed */
    left: 0;
    z-index: 1000;
    font-size: 13px;
    opacity: 1;
}

/* Tooltip arrow below bubble */
.page-nav-icons .elementor-icon-list-item a:hover::before {
    content: "";
    position: absolute;
    top: -12px;
    left: 10px;
    border-width: 6px;
    border-style: solid;
    border-color: transparent transparent #eb8c22 transparent;
    z-index: 999;
    opacity: 1;
}

/* Video description text */
.aiovg a.aiovg-link-category {
    color: #d9d9d9 !important;
}

.aiovg .aiovg-flex-shrink-0 {
    color: #d9d9d9 !important;
}

.aiovg-count {
    color: #d9d9d9 !important;
}

.aiovg a.aiovg-link-title {
    color: #d9d9d9 !important;
}

.aiovg-description span {
    color: #d9d9d9;
}

.aiovg-date time {
    color: #d9d9d9;
}

.aiovg-views-count,
.aiovg-views-label {
    color: #d9d9d9;
}

.aiovg-category-description span {
    color: #d9d9d9;
}

.single-aiovg_videos {
    background-color: #000032;
}

.single-aiovg_videos .entry-title {
    font-size: 34px;
    line-height: 1.3;
    color: #d9d9d9;
}

.single-aiovg_videos #comments .comment-reply-title {
    color: #d9d9d9;
}

.single-aiovg_videos h2.aiovg-header {
    color: #d9d9d9;
}

.single-aiovg_videos #comments,
.single-aiovg_videos #comments * {
    color: #d9d9d9;
}

/* = Added for documentation 05/08/2026 == */


/* =========================================
   BODY
========================================= */

body {
    overflow-x: hidden;
}


/* =========================================
   PROGRESS BAR
========================================= */

#progress-wrapper {
    position: fixed;
    top: 60px;
    left: 0;
    width: 100%;
    height: 18px;
    background: #fff;
    z-index: 9999;
    pointer-events: none;
    box-shadow: 0 2px 6px rgba(0, 0, 0, 0.08);
}

#doc-progress-bar {
    width: 0%;
    height: 100%;
    background: #eb8c22;
    transition: width .2s ease;
}


/* =========================================
   TOC SIDEBAR
========================================= */

#column1 {
    position: fixed;
    top: 180px;
    left: 0;
    width: 360px;

    /*
    Available screen height:
    100vh - 220px
    */

    max-height: calc(100vh - 220px);

    z-index: 9998;

    transition:
        left .3s ease,
        opacity .3s ease,
        visibility .3s ease;

    /* Hidden initially */

    opacity: 0;
    visibility: hidden;
    pointer-events: none;
}


/* =========================================
   SHOW TOC AFTER HERO SECTION
========================================= */

#column1.toc-visible {
    opacity: 1;
    visibility: visible;
    pointer-events: auto;
}


/* =========================================
   HIDE TOC ON TOGGLE
========================================= */

#column1.hide-toc {
    left: -360px;
}


/* =========================================
   TOC INTERNAL SCROLL
========================================= */

/*
Only the Elementor TOC body will scroll.

This prevents other sidebar styling
from being affected.
*/

#column1 .elementor-toc__body {
    max-height: calc(100vh - 260px);

    overflow-y: auto;
    overflow-x: hidden;

    padding-right: 8px;
}


/* =========================================
   OPTIONAL SCROLLBAR STYLING
========================================= */

/*
This only styles the scrollbar inside
the Elementor TOC.
*/

#column1 .elementor-toc__body::-webkit-scrollbar {
    width: 6px;
}

#column1 .elementor-toc__body::-webkit-scrollbar-track {
    background: transparent;
}

#column1 .elementor-toc__body::-webkit-scrollbar-thumb {
    background: #cccccc;
    border-radius: 10px;
}

#column1 .elementor-toc__body::-webkit-scrollbar-thumb:hover {
    background: #999999;
}


/* =========================================
   TOGGLE BUTTON
========================================= */

#toggleColumnDoc {
    position: fixed;
    top: 180px;
    left: 360px;

    z-index: 99999;

    transition: all .3s ease;

    /* Hidden initially */

    opacity: 0;
    visibility: hidden;
    pointer-events: none;
}


/* =========================================
   SHOW TOGGLE BUTTON AFTER HERO
========================================= */

#toggleColumnDoc.toc-visible {
    opacity: 1;
    visibility: visible;
    pointer-events: auto;
}


/* =========================================
   BUTTON POSITION WHEN TOC IS HIDDEN
========================================= */

#toggleColumnDoc.toc-hidden {
    left: 10px;
}


/* =========================================
   CONTENT AREA
========================================= */

.custom-elementor-widget-theme-post-content {
    margin-left: 400px !important;
    transition: all .3s ease;
}


/* =========================================
   EXPAND CONTENT WHEN TOC IS HIDDEN
========================================= */

body.content-expanded .elementor-widget-theme-post-content {
    margin-left: 40px;
}


/* =========================================
   TARGET OFFSET
========================================= */

:target {
    scroll-margin-top: 220px;
}


/* =========================================
   ACTIVE TOC ITEM
========================================= */

.custom-active > a {
    background: #0b527a;
    color: #fff !important;
    border-radius: 6px;
    padding: 10px 16px;
}


/* =========================================
   RESPONSIVE TABLET
========================================= */

@media (max-width: 1024px) {

    #column1 {
        width: 300px;
    }

    #column1.hide-toc {
        left: -300px;
    }

    #toggleColumnDoc {
        left: 300px;
    }

    .elementor-widget-theme-post-content {
        margin-left: 0;
    }
}

#toc-column_c {
    max-height: calc(100vh - 220px);
    overflow-y: auto;
    overflow-x: hidden;
}


/* =========================================
   RESPONSIVE MOBILE
========================================= */

@media (max-width: 767px) {

    #column1 {
        width: 280px;
    }

    #column1.hide-toc {
        left: -280px;
    }

    #toggleColumnDoc {
        left: 280px;
    }

}/* End custom CSS */