/* =========================================================
   RESET DASAR
   ========================================================= */

.body-wrapper {
    min-height: 100%;
    margin-top: -145px;
    padding-top: 145px;
}


/* =========================================================
   HEADER LAYOUT
   ========================================================= */
.profile-image {
    width: 35px;
}

.app-title {
    font-family: 'Roboto Light';
}

    .app-title a {
        color: #7f7f7f;
        text-decoration: none;
    }

.app-subtitle {
    color: #ee8f01;
    font-size: .8rem;
}

a.app-title {
    text-decoration: none;
}

.header-title {
    background-color: white;
}

.user-profile {
    font-size: .95em;
}


/* =========================================================
   MENU NAV
   ========================================================= */
@media (max-width: 991.98px) {
    .offcanvas-collapse {
        position: fixed;
        /* navbar height */
        top: 53px;
        bottom: 0;
        left: -100%;
        width: 100%;
        padding-right: 1rem;
        padding-left: 1rem;
        overflow-y: auto;
        visibility: hidden;
        background-color: #343a40;
        transition: transform .3s ease-in-out, visibility .3s ease-in-out;
        z-index: 9999;
    }

        .offcanvas-collapse.open {
            visibility: visible;
            transform: translateX(100%);
        }

            .offcanvas-collapse.open .nav-item,
            .offcanvas-collapse.open .nav-link {
                color: white;
            }

    nav#navbarMain .navbar-brand img {
        height: 40px;
    }
}

.navbar-dark .navbar-nav .nav-link {
    color: rgb(232, 232, 232);
}

nav#navbarMain {
    font-size: 1.1em;
    -webkit-transition: background-color .3s ease-out;
    -moz-transition: background-color .3s ease-out;
    -o-transition: background-color .3s ease-out;
    transition: background-color .3s ease-out;
}

    nav#navbarMain ul.navbar-nav > li {
        border-top-left-radius: 2px;
        border-top-right-radius: 2px;
        -webkit-transition: background-color .3s ease-out;
        -moz-transition: background-color .3s ease-out;
        -o-transition: background-color .3s ease-out;
        transition: background-color .3s ease-out;
    }

        nav#navbarMain ul.navbar-nav > li:hover {
            -webkit-transition: border-bottom-color .5s ease-out;
            -moz-transition: border-bottom-color .5s ease-out;
            -o-transition: border-bottom-color .5s ease-out;
            transition: border-bottom-color .5s ease-out;
        }

        nav#navbarMain ul.navbar-nav > li > a {
            border-bottom: 3px solid transparent;
        }

            nav#navbarMain ul.navbar-nav > li:hover > a,
            nav#navbarMain ul.navbar-nav > li.active > a,
            nav#navbarMain ul.navbar-nav > li > a.active {
                border-bottom: 3px solid #ff6500;
                color: #ff6500;
            }

    nav#navbarMain ul.dropdown-menu li a.active,
    nav#navbarMain ul.dropdown-menu li a:visited {
        background-color: #c95609;
    }

nav#navbarMain {
    background-color: white;
    border-bottom: 3px solid #ccc;
}

    nav#navbarMain .dropdown-menu {
        background-color: rgba(0, 0, 0, .75);
    }

        nav#navbarMain .dropdown-menu li a {
            color: #eee;
            -webkit-transition: background-color .3s ease-out;
            -moz-transition: background-color .3s ease-out;
            -o-transition: background-color .3s ease-out;
            transition: background-color .3s ease-out;
        }

        nav#navbarMain .dropdown-menu li:hover a:not(.active) {
            background-color: #dd8a25;
        }

    nav#navbarMain .navbar-brand img {
        margin-top: -80px;
        height: 80px;
        -webkit-transition: all .3s ease-out;
        -moz-transition: all .3s ease-out;
        -o-transition: all .3s ease-out;
        transition: all .3s ease-out;
        transition-property: margin-top, height;
    }

    nav#navbarMain .navbar-brand {
        padding-right: 20px;
    }

    nav#navbarMain .navbar-collapse {
        border-top: 1px solid #ddd;
    }

    nav#navbarMain.fixed-top .navbar-collapse {
        border-top: 1px solid transparent;
    }

    nav#navbarMain.fixed-top .navbar-brand img {
        height: 40px;
        margin-top: 0px;
        -webkit-transition: all .3s ease-out;
        -moz-transition: all .3s ease-out;
        -o-transition: all .3s ease-out;
        transition: all .3s ease-out;
        transition-property: margin-top, height;
    }

    nav#navbarMain .dropdown-divider {
        border-color: white;
    }

.bg-content-qa:nth-child(even) {
    background: rgb(177, 170, 170);
}

.bg-content-qa:nth-child(odd) {
    background: white;
}


/* =========================================================
   CONTENT AREA
   ========================================================= */

.app-main {
    padding-top: 1rem;
    min-height: 625px;
}


/* ========================================================= 
   FOOTERS
   ========================================================= */
footer {
    font-family: 'Quicksand';
    font-size: .9em;
    background-color: #e7edf4;
    background-image: url('assets/images/bg-pattern.png');
}

    footer a {
        text-decoration: none;
    }

        footer a:hover {
            text-decoration: underline;
        }

.identity-band {
    display: table;
    background-color: #0064a8;
    padding: 0;
}

    .identity-band .orange {
        display: table-cell;
        padding: 0;
        border-right: 3px solid transparent;
        border-top: 10px solid rgb(239, 143, 33);
    }

    .identity-band .blue {
        background-color: rgb(0, 100, 168);
        display: table-cell;
        padding: 0;
        width: 66.6%;
    }


.copyright {
    color: white;
    background-color: #555;
}


/* ❌ Matikan styling Bootstrap untuk elemen yang ditangani Telerik */
button, input, select, textarea {
    box-shadow: none;
}





@media (min-width: 991.98px) {
    .no-description {
        border-left: 2px solid #ddd;
    }
}

.no-heading {
    font-size: 10em;
    font-weight: bold;
    color: #e86d6d;
}

.no-description {
    font-size: 1.6em;
}