
:root {
    --bg-primary-theme: #381f75;
    --bg-primary-btn-border: #512da8;
    --bg-primary-btn-hover:#5e35b1;
    --bg-primary-btn-click:#41257b;
    --bg-nav-treeview-menu-list-active : #57606f;
    --bg-sidebar : #2f3542;
}

.navbar-new-theme {
    background-color: var(--bg-primary-theme);
    color: #fff;
}


.sidebar-light-indigo .nav-sidebar>.nav-item>.nav-link.active,
.sidebar-light-indigo .nav-sidebar>.nav-item>.nav-link.active {
    background-color: var(--bg-primary-theme);
    color: #fff;
}

.sidebar-light-indigo .nav-sidebar>.has-treeview>.nav-treeview>.nav-item>.nav-link.active,
.sidebar-light-indigo .nav-sidebar>.has-treeview>.nav-treeview>.nav-item>.nav-link.active {
    background-color: var(--bg-nav-treeview-menu-list-active);
    color: #fff;
}

.sidebar-dark-primary .nav-sidebar>.nav-item>.nav-link.active-logout,
.sidebar-light-primary .nav-sidebar>.nav-item>.nav-link.active-logout {
    background-color: #EA2027;
    color: #fff;
}

.btn-primary { /*สีปุ่มตอนยังไม่ชี้*/
    color: #fff;/*สีตัวหนังสือในปุ่ม*/
    background-color: var(--bg-primary-theme);/*สีพื้นหลังปุ่ม*/
    border-color: var(--bg-primary-btn-border);/*สีเส้นขอบปุ่ม*/
    border-width: 0.5px;/*ขนาดของเส้นขอบปุ่ม*/
}

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

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


.btn-primary:not(:disabled):not(.disabled):active, .btn-primary:not(:disabled):not(.disabled).active,
.show > .btn-primary.dropdown-toggle { /*สีตอนกดปุ่ม*/
  color: #fff;
  background-color: var(--bg-primary-btn-click);
  border-color: var(--bg-primary-btn-border);
}


.user-show-moblie {
    display: none;
}

.user-show-pc {
    display: block;
}

.sidebar-collapse [class*="user-show-pc"] {
    display: none;
}

.sidebar-collapse [class*="user-show-moblie"] {
    display: block;
}


.titleUserGoogleScholar {
    font-size: x-large;
}

@media only screen and (max-width: 800px) {
    .titleUserGoogleScholar {
        font-size: medium;
    }
}
@media only screen and (min-width: 801px) {
    .titleUserGoogleScholar {
        font-size: x-large;
    }
}
