/*--------------------------------------------------------------
# Pro Solution | Business Template
# Version 1.0
# Kang Mohan
--------------------------------------------------------------*/
:root {
    --primary: #BE1D28;
    --primary-hover: #9E1822;
    --secondary: #2F3030;
    --secondary-hover: #b87d39;
    --default-color: #44546A;
    --gray: #313232;
    --apkb: #227FCB;
}

html,
body {
    color: var(--default-color);
    height: 100%;
    margin: 0;
    scroll-behavior: smooth;
}

.back-to-top,
.go-to-bottom {
    position: fixed !important;
    right: 20px !important;
    z-index: 1050 !important;
}

.fw-normal {
    font-weight: 400 !important;
}

.fw-semibold {
    font-weight: 600 !important;
}

.fw-bold {
    font-weight: 700 !important;
}

.gy-3 {
    margin-top: -1rem;
}

.gy-3>[class*="col-"] {
    margin-top: 1rem;
}

.gy-4 {
    margin-top: -1.5rem;
}

.gy-4>[class*="col-"] {
    margin-top: 1.5rem;
}

.gy-5 {
    margin-top: -3rem;
}

.gy-5>[class*="col-"] {
    margin-top: 3rem;
}

.gy-0>[class*="col-"] {
    margin-top: 0 !important;
    margin-bottom: 0 !important;
    padding-top: 0 !important;
    padding-bottom: 0 !important;
}

/*--------------------------------------------------------------
# Rounded
--------------------------------------------------------------*/
.rounded-1 {
    border-radius: .2rem !important;
}

.rounded-2 {
    border-radius: .3rem !important;
}

.rounded-3 {
    border-radius: .5rem !important;
}

.rounded-4 {
    border-radius: .75rem !important;
}

.rounded-5 {
    border-radius: 1rem !important;
}

/*--------------------------------------------------------------
# Bootstrap 5 Utilities
--------------------------------------------------------------*/
.flex-shrink-0 {
    flex-shrink: 0 !important;
}

.me-3 {
    margin-right: 1rem !important;
}

.fs-2 {
    font-size: 2rem !important;
}

/*--------------------------------------------------------------
# Background and color
--------------------------------------------------------------*/
.bg-apkb {
    background-color: var(--apkb) !important;
}

.bg-primary {
    background-color: var(--primary) !important;
}

.bg-secondary {
    background-color: var(--secondary) !important;
}

.bg-bc_yellow {
    background-color: #F0B429 !important;
}

.bg-yellow {
    background-color: #FCF5E5 !important;
}

.bg-yellow-strong {
    background-color: #F8E6BA !important;
}

.bg-blue {
    background-color: #E4EDFA !important;
    color: var(--default-color) !important;
}

.bg-blue-strong {
    background-color: #85ADE9 !important;
    color: var(--default-color) !important;
}

.card-primary:not(.card-outline)>.card-header {
    background-color: var(--primary) !important;
}

.text-primary {
    color: var(--primary) !important;
}

/*--------------------------------------------------------------
# Navbar Color
--------------------------------------------------------------*/
.navbar .nav-link.active,
.navbar .nav-link.menu-parent-active {
    background-color: var(--secondary) !important;
    color: #fff !important;
}

.navbar .nav-link:hover {
    background-color: var(--primary-hover) !important;
    color: #fff !important;
}

.navbar .nav-link.disabled,
.navbar .nav-link:disabled {
    background-color: #ccc !important;
    color: #666 !important;
    cursor: not-allowed;
}

#navbarMenu .nav-link {
    font-size: 0.9rem !important;
}

#navbarMenu .nav-link i {
    font-size: 0.85rem !important;
}

#navbarMenu .dropdown-item {
    font-size: 0.875rem !important;
}

#navbarMenu .dropdown-item i {
    font-size: 0.8rem !important;
}

/*--------------------------------------------------------------
# Button
--------------------------------------------------------------*/
a.login {
    color: var(--primary) !important;
    text-decoration: none;
    background-color: transparent;
}

a.login:hover,
a.login:focus,
a.login:active {
    color: var(--primary-hover) !important;
    text-decoration: none;
    background-color: transparent;
}

.btn {
    font-size: 0.875rem !important;
    padding: 0.3rem 0.6rem !important;
}

.btn-primary {
    background-color: var(--primary) !important;
    border-color: var(--primary) !important;
    color: #fff !important;
}

.btn-primary:hover,
.btn-primary:focus {
    background-color: var(--primary-hover) !important;
    border-color: var(--primary-hover) !important;
    color: #fff !important;
}

.btn-primary:active {
    background-color: var(--primary-hover) !important;
    border-color: var(--primary-hover) !important;
    color: #fff !important;
}

.btn-primary.disabled,
.btn-primary:disabled {
    background-color: var(--primary) !important;
    border-color: var(--primary) !important;
    color: #fff !important;
}

.btn-secondary {
    background-color: var(--secondary) !important;
    border-color: var(--secondary) !important;
    color: #fff !important;
}

.btn-secondary:hover,
.btn-secondary:focus {
    background-color: var(--secondary-hover) !important;
    border-color: var(--secondary-hover) !important;
    color: #fff !important;
}

.btn-secondary:active {
    background-color: var(--secondary-hover) !important;
    border-color: var(--secondary-hover) !important;
    color: #fff !important;
}

.btn-secondary.disabled,
.btn-secondary:disabled {
    background-color: var(--secondary) !important;
    border-color: var(--secondary) !important;
    color: #fff !important;
}

.btn-outline-primary {
    color: var(--primary) !important;
    border-color: var(--primary) !important;
}

.btn-outline-primary:hover,
.btn-outline-primary:focus,
.btn-outline-primary:active {
    background-color: var(--primary) !important;
    border-color: var(--primary) !important;
    color: #fff !important;
}

.btn-outline-primary.disabled,
.btn-outline-primary:disabled {
    color: var(--primary) !important;
    border-color: var(--primary) !important;
    background-color: transparent !important;
}

.btn-outline-secondary {
    color: var(--secondary) !important;
    border-color: var(--secondary) !important;
}

.btn-outline-secondary:hover,
.btn-outline-secondary:focus,
.btn-outline-secondary:active {
    background-color: var(--secondary) !important;
    border-color: var(--secondary) !important;
    color: #fff !important;
}

.btn-outline-secondary.disabled,
.btn-outline-secondary:disabled {
    color: var(--secondary) !important;
    border-color: var(--secondary) !important;
    background-color: transparent !important;
}

.btn-default {
    background-color: #6c757d !important;
    border-color: #6c757d !important;
    color: #fff !important;
}

.btn-default:hover,
.btn-default:focus {
    background-color: #5A6268 !important;
    border-color: #545B62 !important;
    color: #fff !important;
}

.btn-default:active {
    background-color: #545B62 !important;
    border-color: #4E555B !important;
    color: #fff !important;
}

.btn-outline-default {
    color: #6c757d !important;
    border-color: #6c757d !important;
    background-color: transparent !important;
}

.btn-outline-default:hover,
.btn-outline-default:focus,
.btn-outline-default:active {
    background-color: #6c757d !important;
    border-color: #6c757d !important;
    color: #fff !important;
}

.btn-outline-default.disabled,
.btn-outline-default:disabled {
    color: #6c757d !important;
    border-color: #6c757d !important;
    background-color: transparent !important;
}

/*--------------------------------------------------------------
# Pagination
--------------------------------------------------------------*/
.page-item.active .page-link {
    z-index: 3;
    color: #fff !important;
    background-color: var(--primary) !important;
    border-color: var(--primary) !important;
}

.page-link {
    position: relative;
    display: block;
    padding: .5rem .75rem;
    margin-left: -1px;
    line-height: 1.25;
    color: var(--primary) !important;
    background-color: #fff;
    border: 1px solid #dee2e6;
}

.page-link:hover {
    color: #fff !important;
    background-color: var(--primary-hover) !important;
    border-color: var(--primary-hover) !important;
}

/*--------------------------------------------------------------
# Dropdown
--------------------------------------------------------------*/
.dropdown-item:hover {
    color: #fff !important;
    background-color: var(--primary) !important;
}

.dropdown-item.active,
.dropdown-item:active {
    color: #fff !important;
    text-decoration: none;
    background-color: var(--primary) !important;
}

.dropdown-item:focus {
    background-color: var(--primary) !important;
    color: #fff !important;
}

/*--------------------------------------------------------------
# Width
--------------------------------------------------------------*/
.w-90 {
    width: 90% !important;
}

.w-80 {
    width: 80% !important;
}

.w-75 {
    width: 75% !important;
}

.w-15 {
    width: 20% !important;
}

/*--------------------------------------------------------------
# Table
--------------------------------------------------------------*/
.table-clear {
    --bs-table-bg: transparent !important;
    --bs-table-accent-bg: transparent !important;
    --bs-table-striped-bg: transparent !important;
    --bs-table-active-bg: transparent !important;
    --bs-table-hover-bg: transparent !important;
}

#mytable td,
.dataTables_scrollBody table td {
    font-size: 0.925rem !important;
    padding: 3.5px !important;
    white-space: normal !important;
    word-break: break-word;
    vertical-align: top !important;
}

#mytable td p {
    margin-top: 0;
    margin-bottom: 0;
}

/* Duplicate thead */
.dataTables_scrollBody thead tr {
    height: 0 !important;
}

.dataTables_scrollBody thead th {
    height: 0 !important;
    padding-top: 0 !important;
    padding-bottom: 0 !important;
    border-top: 0 !important;
    border-bottom: 0 !important;
}

#mytable .btn-group-sm>.btn,
.dataTables_scrollBody .btn-group-sm>.btn {
    width: 25px !important;
    height: 25px !important;
    padding: 0 !important;
    font-size: 0.925rem !important;
    line-height: 1 !important;
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
}

#mytable .btn-group-sm>.btn i,
.dataTables_scrollBody .btn-group-sm>.btn i {
    font-size: 0.75rem !important;
}

.dataTables_scrollHead thead th {
    font-size: 0.9rem !important;
}

.dataTables_info,
.dataTables_paginate {
    font-size: 0.875rem !important;
}

.dataTables_paginate .pagination .page-link {
    font-size: 0.875rem !important;
    padding: 0.275rem 0.55rem !important;
}

/*--------------------------------------------------------------
# CK-Editor
--------------------------------------------------------------*/
/* Base */
.ckeditor+.ck-editor {
    display: flex;
    flex-direction: column;
}

.ck-editor__editable.ck-content,
.ck-editor__editable.ck-content *,
.ck-editor__editable.ck-content *::before,
.ck-editor__editable.ck-content *::after {
    box-sizing: border-box;
}

.ck-editor__editable.ck-content {
    font-family: inherit;
    font-size: inherit;
    line-height: inherit;
    color: inherit;
}

/* Height */
.ckeditor+.ck-editor .ck-editor__editable.ck-content {
    height: 250px !important;
    min-height: 250px !important;
    max-height: 250px !important;
    overflow-y: auto !important;
}

.ckeditor.ck-height-100+.ck-editor .ck-editor__editable.ck-content {
    height: 175px !important;
    min-height: 175px !important;
    max-height: 175px !important;
}

.ckeditor.ck-height-200+.ck-editor .ck-editor__editable.ck-content {
    height: 250px !important;
    min-height: 250px !important;
    max-height: 250px !important;
}

.ckeditor.ck-height-500+.ck-editor .ck-editor__editable.ck-content {
    height: 500px !important;
    min-height: 500px !important;
    max-height: 500px !important;
}

.ckeditor.ck-height-1000+.ck-editor .ck-editor__editable.ck-content {
    height: 1000px !important;
    min-height: 1000px !important;
    max-height: 1000px !important;
}

/* Typography */
.ck-editor__editable.ck-content p,
.ck-editor__editable.ck-content h1,
.ck-editor__editable.ck-content h2,
.ck-editor__editable.ck-content h3,
.ck-editor__editable.ck-content h4,
.ck-editor__editable.ck-content h5,
.ck-editor__editable.ck-content h6 {
    font-family: inherit;
    color: inherit;
}

.ck-editor__editable.ck-content h1 {
    font-size: 2.5rem !important;
}

.ck-editor__editable.ck-content h2 {
    font-size: 2rem !important;
}

.ck-editor__editable.ck-content h3 {
    font-size: 1.75rem !important;
}

.ck-editor__editable.ck-content h4 {
    font-size: 1.5rem !important;
}

.ck-editor__editable.ck-content h5 {
    font-size: 1.25rem !important;
}

.ck-editor__editable.ck-content h6 {
    font-size: 1rem !important;
}

.ck-editor__editable.ck-content .fw-bold {
    font-weight: 700 !important;
}

.ck-editor__editable.ck-content .fw-semibold {
    font-weight: 600 !important;
}

.ck-editor__editable.ck-content .fs-2 {
    font-size: calc(1.325rem + .9vw) !important;
}

.ck-editor__editable.ck-content .fs-3 {
    font-size: calc(1.3rem + .6vw) !important;
}

.ck-editor__editable.ck-content .fs-5 {
    font-size: 1.25rem !important;
}

.ck-editor__editable.ck-content .small,
.ck-editor__editable.ck-content small {
    font-size: .875em;
}

.ck-editor__editable.ck-content .lh-1 {
    line-height: 1 !important;
}

/* Grid */
.ck-editor__editable.ck-content>.row {
    padding-left: 0.75rem !important;
    padding-right: 0.75rem !important;
}

.ck-editor__editable.ck-content .row>[class*="col-"] {
    flex-shrink: 0;
    max-width: 100%;
    padding-right: 0.5rem !important;
    padding-left: 0.5rem !important;
    margin-top: var(--bs-gutter-y);
}

.ck-editor__editable.ck-content .card-body {
    padding-top: 0rem !important;
}

/* Display */
.ck-editor__editable.ck-content .d-flex {
    display: flex !important;
}

.ck-editor__editable.ck-content .d-block {
    display: block !important;
}

.ck-editor__editable.ck-content .d-inline-block {
    display: inline-block !important;
}

.ck-editor__editable.ck-content .flex-column {
    flex-direction: column !important;
}

.ck-editor__editable.ck-content .flex-wrap {
    flex-wrap: wrap !important;
}

.ck-editor__editable.ck-content .align-items-center {
    align-items: center !important;
}

.ck-editor__editable.ck-content .align-items-start {
    align-items: flex-start !important;
}

.ck-editor__editable.ck-content .justify-content-center {
    justify-content: center !important;
}

.ck-editor__editable.ck-content .flex-shrink-0 {
    flex-shrink: 0 !important;
}

.ck-editor__editable.ck-content .h-100 {
    height: 100% !important;
}

.ck-editor__editable.ck-content .overflow-hidden {
    overflow: hidden !important;
}

/* Padding */
.ck-editor__editable.ck-content .p-0 {
    padding: 0 !important;
}

.ck-editor__editable.ck-content .p-3 {
    padding: 1rem !important;
}

.ck-editor__editable.ck-content .p-4 {
    padding: 1.5rem !important;
}

.ck-editor__editable.ck-content .px-3 {
    padding-right: 1rem !important;
    padding-left: 1rem !important;
}

.ck-editor__editable.ck-content .px-4 {
    padding-right: 1.5rem !important;
    padding-left: 1.5rem !important;
}

.ck-editor__editable.ck-content .py-2 {
    padding-top: .5rem !important;
    padding-bottom: .5rem !important;
}

/* Margin */
.ck-editor__editable.ck-content .mb-0 {
    margin-bottom: 0 !important;
}

.ck-editor__editable.ck-content .mb-1 {
    margin-bottom: .25rem !important;
}

.ck-editor__editable.ck-content .mb-2 {
    margin-bottom: .5rem !important;
}

.ck-editor__editable.ck-content .mb-3 {
    margin-bottom: 1rem !important;
}

.ck-editor__editable.ck-content .mb-4 {
    margin-bottom: 1.5rem !important;
}

.ck-editor__editable.ck-content .mt-1 {
    margin-top: .25rem !important;
}

.ck-editor__editable.ck-content .mt-60 {
    margin-top: 60px !important;
}

.ck-editor__editable.ck-content .mt-120 {
    margin-top: 120px !important;
}

.ck-editor__editable.ck-content .me-2 {
    margin-right: .5rem !important;
}

.ck-editor__editable.ck-content .me-3 {
    margin-right: 1rem !important;
}

.ck-editor__editable.ck-content .ms-2 {
    margin-left: .5rem !important;
}

/* Gap */
.ck-editor__editable.ck-content .gap-2 {
    gap: .5rem !important;
}

.ck-editor__editable.ck-content .gap-3 {
    gap: 1rem !important;
}

/* Gutter */
.ck-editor__editable.ck-content .gy-3 {
    margin-top: -1rem;
}

.ck-editor__editable.ck-content .gy-3>[class*="col-"] {
    margin-top: 1rem;
}

.ck-editor__editable.ck-content .gy-4 {
    margin-top: -1.5rem;
}

.ck-editor__editable.ck-content .gy-4>[class*="col-"] {
    margin-top: 1.5rem;
}

.ck-editor__editable.ck-content .gy-5 {
    margin-top: -3rem;
}

.ck-editor__editable.ck-content .gy-5>[class*="col-"] {
    margin-top: 3rem;
}

/* Rounded */
.ck-editor__editable.ck-content .rounded {
    border-radius: .375rem !important;
}

.ck-editor__editable.ck-content .rounded-3 {
    border-radius: .5rem !important;
}

.ck-editor__editable.ck-content .rounded-circle {
    border-radius: 50% !important;
}

.ck-editor__editable.ck-content .rounded-pill {
    border-radius: 50rem !important;
}

/* Todo-list */
.ck-content ul.todo-list {
    margin: 0 !important;
    padding: 2px 0 2px 2px !important;
    list-style: none !important;
}

.ck-content ul.todo-list>li {
    position: relative !important;
    margin: 0 0 4px 0 !important;
    padding: 2px 0 2px 26px !important;
    background: none !important;
    border: none !important;
    list-style: none !important;
    line-height: 1.3 !important;
}

.ck-content ul.todo-list>li>label.todo-list__label {
    position: absolute !important;
    top: 3px !important;
    left: 0 !important;
    width: 18px !important;
    height: 18px !important;
    margin: 0 !important;
    padding: 0 !important;
}

.ck-content ul.todo-list>li>label.todo-list__label>input[type="checkbox"] {
    position: static !important;
    display: block !important;
    width: 16px !important;
    height: 16px !important;
    margin: 0 !important;
}

.ck-content ul.todo-list>li>span.todo-list__label__description {
    display: block !important;
    margin: 0 !important;
    padding: 0 !important;
}

.ck-content ul.todo-list>li>span.todo-list__label__description label.todo-list__label {
    display: block !important;
    margin: 0 !important;
    padding: 0 !important;
    font-weight: normal !important;
}

.ck-content ul.todo-list>li>span.todo-list__label__description span.todo-list__label__description {
    display: block !important;
    margin: 0 !important;
    padding: 0 !important;
}

.ck-content ul.todo-list>li p {
    margin: 0 !important;
}

.ck-content ul.todo-list>li>ul.todo-list {
    margin-left: 20px !important;
}

/* List */
.ck-content ul {
    padding-left: 1.5rem;
}

.ck-content ul[style*="list-style-type: disc"] {
    list-style-type: disc;
}

.ck-content ul[style*="list-style-type: circle"] {
    list-style-type: circle;
}

.ck-content ul[style*="list-style-type: square"] {
    list-style-type: square;
}

.ck-content ol {
    padding-left: 1.5rem;
}

/* Blockquote */
.ck-content blockquote {
    background-color: #E4EDFA !important;
    padding: 0.5rem !important;
    margin: 0 !important;
    border: none !important;
    border-radius: 0.25rem !important;
    font-style: normal !important;
}

/* Button */
.ck-editor__editable.ck-content .btn-apkb {
    display: inline-block !important;
    background-color: var(--primary) !important;
    border: 1px solid var(--primary) !important;
    color: #fff !important;
    padding: 0.3rem 0.6rem !important;
    font-size: 0.875rem !important;
    line-height: 1.5 !important;
    text-align: center !important;
    text-decoration: none !important;
    vertical-align: middle !important;
}

.ck-editor__editable.ck-content .btn-apkb:hover {
    background-color: var(--primary-hover) !important;
    border-color: var(--primary-hover) !important;
    color: #fff !important;
}

/* Toolbar */
.ck.ck-sticky-panel .ck-sticky-panel__content_sticky {
    top: 0 !important;
    z-index: 1000;
    background: #fff;
}

/* Source */
.ck-source-editing-area textarea {
    font-size: 11px !important;
    line-height: 1.5 !important;
}

/* Editable */
.ck-editor__editable {
    padding-bottom: 1rem !important;
}

/* Responsive */
@media (min-width: 992px) {
    .ck-editor__editable.ck-content .col-lg-4 {
        flex: 0 0 auto;
        width: 33.33333333%;
    }

    .ck-editor__editable.ck-content .col-lg-5 {
        flex: 0 0 auto;
        width: 41.66666667%;
    }

    .ck-editor__editable.ck-content .col-lg-6 {
        flex: 0 0 auto;
        width: 50%;
    }

    .ck-editor__editable.ck-content .col-lg-7 {
        flex: 0 0 auto;
        width: 58.33333333%;
    }

    .ck-editor__editable.ck-content .col-lg-8 {
        flex: 0 0 auto;
        width: 66.66666667%;
    }

    .ck-editor__editable.ck-content .col-lg-10 {
        flex: 0 0 auto;
        width: 83.33333333%;
    }

    .ck-editor__editable.ck-content .p-lg-5 {
        padding: 3rem !important;
    }
}

/* Fullscreen */
@media (min-width: 992px) {
    .ck-fullscreen-wrapper {
        position: fixed !important;
        top: 0 !important;
        left: 0 !important;
        width: 100vw !important;
        height: 100vh !important;
        z-index: 1040 !important;
        background: #fff !important;
        display: flex !important;
        flex-direction: column !important;
    }

    .ck-fullscreen-wrapper .ck-editor {
        width: 100% !important;
        height: 100% !important;
        display: flex !important;
        flex-direction: column !important;
    }

    .ck-fullscreen-wrapper .ck-editor__top {
        flex: 0 0 auto !important;
    }

    .ck-fullscreen-wrapper .ck-editor__main {
        flex: 1 1 auto !important;
        min-height: 0 !important;
        display: flex !important;
        flex-direction: column !important;
        overflow: hidden !important;
    }

    .ck-fullscreen-wrapper .ck-editor__editable {
        flex: 1 1 auto !important;
        height: 100% !important;
        min-height: 0 !important;
        max-height: none !important;
        overflow-y: auto !important;
        border-radius: 0 !important;
    }

    .ck-fullscreen-wrapper .ck-source-editing-area {
        flex: 1 1 auto !important;
        min-height: 0 !important;
        height: 100% !important;
        overflow: hidden !important;
    }

    .ck-fullscreen-wrapper .ck-source-editing-area textarea {
        width: 100% !important;
        height: 100% !important;
        min-height: 0 !important;
        max-height: none !important;
        overflow: auto !important;
        resize: none !important;
    }

    .ck-fullscreen-wrapper {
        position: fixed !important;
        top: 0 !important;
        left: 0 !important;
        width: 100vw !important;
        height: 100vh !important;
        z-index: 1040 !important;
        background: #fff !important;
        display: flex !important;
        flex-direction: column !important;
    }

    .ck-fullscreen-wrapper .ck-editor {
        width: 100% !important;
        height: 100% !important;
        display: flex !important;
        flex-direction: column !important;
    }

    .ck-fullscreen-wrapper .ck-editor__top {
        flex: 0 0 auto !important;
    }

    .ck-fullscreen-wrapper .ck-editor__main {
        flex: 1 1 auto !important;
        min-height: 0 !important;
        display: flex !important;
        flex-direction: column !important;
        overflow: hidden !important;
    }

    /* Hanya editable utama, jangan nested editable tabel */
    .ck-fullscreen-wrapper .ck-editor__main>.ck-editor__editable_inline {
        flex: 1 1 auto !important;
        height: 100% !important;
        min-height: 0 !important;
        max-height: none !important;
        overflow-y: auto !important;
        border-radius: 0 !important;
    }

    /* Pastikan cell tabel tetap seperti mode normal */
    .ck-fullscreen-wrapper .ck-editor__nested-editable {
        flex: none !important;
        width: auto !important;
        height: auto !important;
        min-width: 0 !important;
        min-height: 0 !important;
        max-width: none !important;
        max-height: none !important;
        overflow: visible !important;
    }

    .ck-editor__editable.ck-content td {
        padding: 5px !important;
        line-height: 1.3 !important;
    }

    .ck-editor__editable.ck-content td p {
        margin: 0 !important;
        padding: 0 !important;
        line-height: 1.3 !important;
    }

    .ck-editor__editable.ck-content th {
        padding: 8px 5px !important;
        line-height: 1.4 !important;
    }

    .ck-editor__editable.ck-content th p {
        margin: 0 !important;
        padding: 0 !important;
        line-height: 1.4 !important;
    }

    .ck-fullscreen-wrapper .ck-source-editing-area {
        flex: 1 1 auto !important;
        min-height: 0 !important;
        height: 100% !important;
        overflow: hidden !important;
    }

    .ck-fullscreen-wrapper .ck-source-editing-area textarea {
        width: 100% !important;
        height: 100% !important;
        min-height: 0 !important;
        max-height: none !important;
        overflow: auto !important;
        resize: none !important;
    }

    /* Pop Up CKEditor saat fullscreen */
    body.ck-fullscreen-active .ck.ck-balloon-panel,
    body.ck-fullscreen-active .ck.ck-balloon-panel_visible {
        z-index: 2100 !important;
    }

    /* Dropdown / contextual toolbar CKEditor */
    body.ck-fullscreen-active .ck.ck-dropdown__panel,
    body.ck-fullscreen-active .ck.ck-list,
    body.ck-fullscreen-active .ck.ck-toolbar {
        z-index: 2100 !important;
    }

    /* CKFinder */
    body.ck-fullscreen-active .ckfinder,
    body.ck-fullscreen-active .ckfinder-modal,
    body.ck-fullscreen-active .ckfinder-dialog,
    body.ck-fullscreen-active [class*="ckfinder"] {
        z-index: 2200 !important;
    }
}

.select2-container--bootstrap4 .select2-results__option--highlighted[aria-selected] {
    background-color: var(--primary) !important;
    color: white !important;
}

/*--------------------------------------------------------------
# Additional
--------------------------------------------------------------*/
.status-select-wrapper {
    width: 150px;
}
.status-select-wrapper .form-control-sm {
    height: calc(1.8125rem + 2px);
    padding: .25rem .5rem;
    font-size: .875rem;
    line-height: 1.5;
}

.card-primary:not(.card-outline) > .card-header {
    background-color: var(--primary);
    border-color: var(--primary);
}
.card.card-outline.card-primary {
    border-top-color: var(--primary);
}




/*--------------------------------------------------------------
# CKEditor Source Editing Height
--------------------------------------------------------------*/
.ckeditor+.ck-editor .ck-editor__main>.ck-source-editing-area {
    height: 250px !important;
    min-height: 250px !important;
    max-height: 250px !important;
    overflow: hidden !important;
}
.ckeditor+.ck-editor .ck-editor__main>.ck-source-editing-area textarea {
    display: block !important;
    width: 100% !important;
    height: 100% !important;
    box-sizing: border-box !important;
    overflow-y: auto !important;
    resize: none !important;
}
.ckeditor.ck-height-100+.ck-editor .ck-editor__main>.ck-source-editing-area {
    height: 175px !important;
    min-height: 175px !important;
    max-height: 175px !important;
}
.ckeditor.ck-height-200+.ck-editor .ck-editor__main>.ck-source-editing-area {
    height: 250px !important;
    min-height: 250px !important;
    max-height: 250px !important;
}
.ckeditor.ck-height-500+.ck-editor .ck-editor__main>.ck-source-editing-area {
    height: 500px !important;
    min-height: 500px !important;
    max-height: 500px !important;
}
.ckeditor.ck-height-1000+.ck-editor .ck-editor__main>.ck-source-editing-area {
    height: 1000px !important;
    min-height: 1000px !important;
    max-height: 1000px !important;
}