body {
    font-family: 'Kanit', sans-serif;
    font-size: 16px !important;
}
.color-main-template {
    color: #7e0949;
}
th,td {
    font-size: 14px !important;
}
.form-control {
    font-size: 16px !important;
}
label {
    font-size: 16px !important;
}
.h-title {
    margin: -25px 0px 0px 10px;
    position: absolute;
    font-size: 20px;
    font-weight: bold;
    color: #3699FF;
}
.h-sub-title {
    margin: 30px 0px 0px 10px;
    position: absolute;
    font-size: 16px;
}
.footer {
    position: fixed;
    height: 65px;
    bottom: 0;
    width: 100%;
}
.example-preview{
    border: 4px solid #F3F6F9;
    padding: 1.75rem 1.5rem;
    border-top-left-radius: 0.42rem;
    border-top-right-radius: 0.42rem;
}
header-fixed .wrapper {
    padding-top: 0px;
}
.form-control {
    font-size: 16px;
}
.header-fixed.subheader-fixed.subheader-enabled .wrapper {
    padding-top: 35px !important;
}
.title-1{
    font-size: 20px !important;
    font-weight: bold !important;
}
.title-2{
    font-size: 16px !important;
    font-weight: bold !important;
}
.title-3{
    font-size: 16px !important;
    margin-left: 2.5rem !important;
}
.title-4{
    color: #B5B5C3 !important;
    font-size: 16px !important;
}
.brand {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: justify;
    -ms-flex-pack: justify;
    justify-content: space-between;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    -webkit-box-orient: horizontal;
    -webkit-box-direction: normal;
    -ms-flex-direction: row;
    flex-direction: row;
    padding: 0 5px;
    height: 65px;
}
.blur {
    filter: blur(5px);
}
.aside-menu .menu-nav > .menu-item > .menu-heading .menu-text, .aside-menu .menu-nav > .menu-item > .menu-link .menu-text {
    color: #a2a3b7;
    font-size: 14px;
}
.aside-menu .menu-nav > .menu-item > .menu-link {
    padding: 9px 18px;
}
.text-black {
    color: #000000;
}
.text-success-99 {
    color: #088994;
}
.text-primary-sme {
    color: #1e80ed;
}

/*ปรับสี*/
body::before {
    content: "";
    position: fixed;
    inset: 0;
    background: rgba(128, 128, 128, 0.7);
    pointer-events: none;
    z-index: 9999;
    mix-blend-mode: saturation;
}
/**/

#tbProgressActionPlan tbody tr {
    transition: all 0.2s ease;
    cursor: grab;
}

#tbProgressActionPlan tbody tr:hover {
    background: #f8f9fa !important;
    transform: translateY(-2px);
    box-shadow: 0 4px 12px rgba(0, 0, 0, 0.08) !important;
}

#tbProgressActionPlan tbody tr:hover > td {
    background: transparent !important;
    border-color: #e9ecef !important;
}

.sortable-chosen {
    transform: scale(1.03);
    background-color: #e8f5e9 !important;
    transition: transform .15s ease;
}

.sortable-ghost {
    opacity: .4;
    background: #c5e1a5 !important;
}

#tbProgressActionPlan tbody tr:active {
    cursor: grabbing;
}

.row-success {
    animation: successFlash 0.6s ease;
}

@keyframes successFlash {
    0%, 100% { background: transparent; }
    50% { background: #d1e7dd !important; }
}