﻿/* Theme Layout Stylings
-----------------------------------*/
.layout-sidebar {
    background-color: #e6923f;
}

.nav-item .active {
    background-color: #f4e8dc;
    color: #d9720c;
    font-weight: 500;
    font-size: 18px;
}
.btn-block.reset {
    display: block;
    width: 100%;
    background-color: #e6923f;
    border-color: #e6923f;
    color: #ffffff;
}
.nav-topbar {
    background-color: #ffefe0;
}

    .nav-topbar .user-name {
        color: #bf6d1b;
        font-weight: 500;
        font-size: 18px;
    }

.theme-body {
    background-color: #fff7ee;
}

.nav-item .nav-link {
    color: #fff7ee !important;
    margin: 8px 0 !important;
    font-size: 18px;
    font-weight: 500;
}

    .nav-item .active, .nav-item .active:hover, .nav-item .nav-link:hover {
        color: #bf6d1b !important;
        background-color: #fff7ee !important;
    }

.logo-title {
    color: #ffffff;
    font-weight: 500 !important;
    margin-top: 8px;
    font-size: 24px;
    border-bottom: 2px solid #fff;
    padding-bottom: 12px;
    width: 100%;
    text-align: center;
    width: 50%;
    display: flex;
    justify-content: center;
}

.brand-link {
    display: flex;
    flex-direction: column;
    align-items: center;
    margin-top: 12px;
}

    .brand-link .brand-image {
        max-height: 112px !important;
        max-width: 122px;
        width: 100%;
    }

.nav-collapse .fa-bars {
    color: #e6923f;
    font-size: 22px !important;
}


.student-login-dropdown .dropdown-item {
    font-size: medium !important;
    font-weight: 500;
    color: #bf6d1b;
}

    .student-login-dropdown .dropdown-item:focus, .dropdown-item:hover {
        color: #bf6d1b;
        text-decoration: none;
        background-color: #fff;
        box-shadow: inset 0 0 2rem rgb(246 222 199) ;
    }


    .student-login-dropdown .dropdown-item.active {
        color: #bf6d1b;
        text-decoration: none;
        background-color: #fff;
        box-shadow: inset 0 0 2rem rgb(246 222 199) ;
    }

.student-login-dropdown .dropdown-menu {
    background-color: #f1c8a0;
}

@media screen and (min-width: 992px) {
    .sidebar-mini.sidebar-collapse .brand-text,
    .sidebar-mini.sidebar-collapse .sidebar .nav-sidebar .nav-link p,
    .sidebar-mini.sidebar-collapse .sidebar .user-panel > .info {
        margin-left: 15px;
        animation-name: none;
        visibility: visible;
    }
    .sidebar-mini.sidebar-collapse .brand-text {
        display: none;
    }
    .sidebar-mini.sidebar-collapse .sidebar .nav-sidebar .nav-link p {
        display: none;
    }
}


@media screen and (max-width: 992px) {
    .sidebar-mini.sidebar-collapse .sidebar .nav-sidebar .nav-link:hover {
        background-color: #e6923f !important;
        color: #fff7ee !important;
    }
}

/* Theme Layout Stylings End
    -----------------------------------*/



/* Chat Screen Stylings
-----------------------------------*/
.chat-screen {
    box-shadow: 0px 1px 1px 0 rgb(63 63 63 / 33%), 0px 2px 5px 0 rgb(151 151 151 / 47%);
    border: 1px solid #e6923f63;
    padding: 8px;
    background-color: #fffbf7;
    border-radius: 11px;
}

#left-chat-container {
    border-right: 1px solid #d3d3d3;
    background: #fffbf7;
    padding-right: 8px;
    overflow-y: auto;
}

#left-chat-container .header, #right-chat-container .header {
    box-shadow: none;
    background: #fffbf7 !important;
}

.left-container .header .img-text p, #studentChatContainerName, #teacherChatContainerName {
    color: #bf6d1b;
    font-size: large;
    font-weight: 500;
}

#left-chat-container .search-container {
    position: relative;
    width: 98%;
    height: 42px;
    display: flex;
    align-items: center;
    padding: 0 10px;
    background: #fffbf7;
    margin-bottom: 4px;
}

.search-container .search-input {
    min-width: 100%;
    display: flex;
    align-items: center;
    border: 1px solid #f5d3af;
    border-radius: 8px;
    padding: 0 12px;
    background-color: #ffffff;
    height: 100%;
    box-shadow: inset 1px 1px 8px rgba(190, 125, 27, 0.5);
}

    .search-container .search-input input {
        padding-left: 12px;
        height: 96%;
        font-size: 16px;
        border-radius: 24px;
        color: #bf6d1b;
       background: transparent;
    }

.chat-list {
    background-color: #fffbf7;
    height: auto;
}
    .chat-list .chat-box {
        height: auto;
        padding: 12px 8px;
        background: #fffbf7;
        box-shadow: 0px 1px 1px 0 rgb(63 63 63 / 33%), 0px 2px 5px 0 rgb(151 151 151 / 47%);
    }

        .chat-list .chat-box .chat-details .text-head h4 {
            color: #bf6d1b;
            font-weight: 500;
            font-size: medium;
        }

#studentChatContainerName, #teacherChatContainerName {
    margin: 0 0 0 12px;
}

.search-container .search-input i, .message-search .chat-icon {
    color: #e6923f;
    font-size: 16px;
}

.message-search .chat-icon {
    padding: 0 12px 0 0 !important;
}
.message-search {
    border: 1px solid #f5d3af;
    border-radius: 8px;
    background: #fff;
    padding: 0 12px;
    box-shadow: inset 1px 1px 8px rgba(190, 125, 27, 0.5);
    color: #bf6d1b;
}


.message-search #search-message, #search-message::placeholder, .search-container .search-input input::placeholder {
    color: #bf6d1b;
    font-size: 16px;
    height: 96%;
}

#right-chat-container {
    background: #fffbf7;
    padding-left: 8px;
}

#right-chat-container .header {
        border-bottom: 1px solid #d3d3d3;
        border-left: none;
    }

#right-chat-container .chat-container {
        background-color: #fffbf7;
    }

    #right-chat-container .chatbox-input {
        background: #ffefe0;
        border-radius: 8px;
    }

        .chatbox-input a {
            background: #e6923f;
            color: #fff;
        }

        .chatbox-input a:hover {
            background: #fff;
            color: #bf6d1b;
            box-shadow: inset 1px 1px 8px rgba(190, 125, 27, 0.5);
        }

            .chatbox-input a:focus {
                background: #fff;
                color: #bf6d1b;
                box-shadow: inset 1px 1px 8px rgba(190, 125, 27, 0.5);
            }

            .chatbox-input a:active {
                background: #fff;
                color: #bf6d1b;
                box-shadow: inset 1px 1px 8px rgba(190, 125, 27, 0.5);
            }

.chatbox-input i {
    cursor: pointer;
    color: #fff;
}

.chatbox-input a:hover i {
    color: #bf6d1b;
}

.chatbox-input input{
    box-shadow: inset 1px 1px 8px rgba(190, 125, 27, 0.5);
    color: #bf6d1b;
}

.chatbox-input input::placeholder {
    color: #bf6d1b;
}

.message-date-text {
    padding: 6px 8px;
    background: #fff;
    color: #bf6d1b;
    font-weight: 600;
    box-shadow: inset 1px 5px 20px rgba(190, 125, 27, 0.5)
}

.message-box.my-message p::before {
    background: linear-gradient(135deg, #676666 0%, #676666 50%, transparent 50%, transparent);
}

.message-box p {
    background: #676666;
    color: #fffbf7;
    padding: 6px 12px;
}

.message-box.friend-message::before {
    background: linear-gradient(225deg, #bf6d1b 0%, #bf6d1b 50%, transparent 50%, transparent);
}

.friend-message p {
    background: #bf6d1b;
    color: #fffbf7;
    text-align: start;
    padding: 6px 12px;
   
}

.message-box p span {
    margin-top: 2px;
    font-size: 10px;
    opacity: 0.8;
}

.chat-list .chat-box:hover {
    background: #ffefe0;
}

.back-arrow {
    color: #bf6d1b !important;
}

.message-date-text {
    margin: 0;
}

.theme-body {
    min-height: calc(100vh - 100px) !important;
}

.message-delete-btn {
    color: #bf6d1b;
    font-size: 16px;
    cursor: pointer;
    box-shadow: inset 1px 1px 5px rgba(190, 125, 27, 0.5);
    border-radius: 50%;
    padding: 8px;
    border: 1px solid #f5d3af;
}

    .message-delete-btn:hover {
        color: #e6923f;
        box-shadow: inset 1px 1px 5px rgba(190, 125, 27, 0.5);
    }

    .message-delete-btn:focus {
        color: #bf6d1b;
        box-shadow: inset 1px 1px 5px rgba(190, 125, 27, 0.5);
    }

    .message-delete-btn:active {
        color: #e6923f;
        box-shadow: inset 1px 1px 5px rgba(190, 125, 27, 0.5);
    }

.message-delete-icon{
    color: #bf6d1b !important;
}

.no-message-icon{
    color: #bf6d1b;
}
.no-message-text {
    color: #bf6d1b;
}
    #left-chat-container .chat-list::-webkit-scrollbar, #right-chat-container .chat-container::-webkit-scrollbar {
    width: 8px;
    background-color: #F5F5F5;
}

#left-chat-container .chat-list::-webkit-scrollbar-thumb, #right-chat-container .chat-container::-webkit-scrollbar-thumb {
    background: #e9bf95;
    border-radius: 10px;
}

#left-chat-container .chat-list::-webkit-scrollbar-track, #right-chat-container .chat-container::-webkit-scrollbar-track {
    -webkit-box-shadow: inset 0 0 6px rgba(0,0,0,0.3);
    background-color: #F5F5F5;
    border-radius: 10px;
}

#left-chat-container .chat-list::-webkit-scrollbar-thumb:hover, #right-chat-container .chat-container::-webkit-scrollbar-thumb:hover {
    background-color: #e9bf95;
}

#left-chat-container .chat-list::-webkit-scrollbar-thumb:active, #right-chat-container .chat-container::-webkit-scrollbar-thumb:active {
   background-color: #e9bf95;
}

#left-chat-container .chat-list::-webkit-scrollbar-thumb:focus, #right-chat-container .chat-container::-webkit-scrollbar-thumb:focus {
    background-color: #e9bf95;
}

#left-chat-container .chat-list::-webkit-scrollbar-thumb:window-inactive, #right-chat-container .chat-container::-webkit-scrollbar-thumb:window-inactive {
    background-color: #e9bf95;
}

#left-chat-container .chat-list::-webkit-scrollbar-button, #right-chat-container .chat-container::-webkit-scrollbar-button {
    display: none;
}

#left-chat-container .chat-list::-webkit-scrollbar-corner, #right-chat-container .chat-container::-webkit-scrollbar-corner {
    background-color: #F5F5F5;
}



.no-students-container {
    background: linear-gradient(175deg, rgb(241 195 150) 0%, rgb(242 224 206) 93%, rgb(226 205 184) 99%);
    box-shadow: inset 0 0 2rem rgb(246 222 199);
}

.no-students-head-icon {
    background: #bf6d1b;
    color: #fff;
    box-shadow: inset 0 1px 4px rgba(0, 0, 0, 0.075);
}

.no-students-list-header {
    color: #bf6d1b;
}

.no-students-description {
    color: #474936;
}


@media screen and (max-width: 768px) {
    #left-chat-container {
        border-right: none;
        padding-right: 0px;
    }

    .card-body {
        padding: 12px;
    }

    #left-chat-container .search-container {
        padding: 0;
        width: 100%;
    }

    #right-chat-container .header {
        height: auto !important;
        padding-bottom: 12px !important;
        gap: 12px !important;
        flex-wrap: wrap !important;
    }

    .message-search {
        flex: 1 0 auto;
        width: 100%;
    }

    .chat-container {
        height: calc(100% - 180px);
    }
}

/* Chat Screen Stylings End
    -----------------------------------*/

/* Meetings Page Styles
-------------------------------------*/
.add-meeting-btn {
    background-color: #e6923f;
    border:1px solid #e6923f;
    border-radius: 8px;
}

.add-meeting-btn:hover {
    background-color: transparent;
    border: 1px solid #e6923f;
    color: #e6923f !important;
    font-weight: 500;
}

    .add-meeting-btn:focus {
        background-color: #bf6d1b;
        box-shadow: 0 0 0 .2rem rgba(230, 146, 63, 0.5);
        border-color: #e6923f;
    }

.add-meeting-btn:active {
    background-color: #e6923f;
    border-color: #e6923f;
    box-shadow: inset 0 0.5rem 1rem rgba(0, 0, 0, 0.15);
}

.meeting-timings{
    color: #bf6d1b;
    font-size: small;
}

.meeting-url {
    color: #bf6d1b;
    font-size: medium;
    font-weight: 500;
}


.url-link{
    color: #e6923f;
    font-size: small;
    text-decoration: underline;
}

.user-icon {
    background: #f5d3af;
    padding: 10px;
    border-radius: 50%;
    color: #bf6d1b;
}
.meeting-organizer {
    bottom: -1.2em;
    right: 45px;
    font-weight: 300;
    color: #e6923f
}

/* Calendar Styles Overriding
-----------------------------------*/
.fc-daygrid-day-number {
    color: #e6923f !important;
    font-size: 16px;
    font-weight: 500;
    line-height: 10px;
}

.fc .fc-toolbar.fc-header-toolbar {
    margin-bottom: 4px !important;
    padding: 12px 0 !important;
}

.fc-daygrid-event {
 /* background-color: #e6923f !important;
    border-color: #e6923f !important;*/
}

.fc-col-header-cell-cushion {
    padding: 16px !important;
    width: 100% !important;
    color: #e6923f !important;
    font-size: 18px !important;
    font-weight: 500 !important;
}

.fc-daygrid-day-frame {
    padding: 12px !important;
    border-radius: 16px;
}

.fc-theme-standard .fc-scrollgrid {
    border: 1px solid #f5d3af !important;
    border-radius: 10px !important;
    overflow: hidden;
    border-right: none !important;
    border-bottom: none !important;
}

.fc-theme-standard td, .fc-theme-standard th {
    border-color: #f5d3af !important;
}

.fc-scrollgrid-sync-table tr {
    border-right: none !important;
    border-bottom: none !important;
}

.fc-prev-button, .fc-next-button {
    background-color: #e6923f !important;
    border-color: #e6923f !important;
    margin: 1px !important;
    border-radius: 4px !important;
}

.fc-toolbar-title {
    color: #bf6d1b !important;
}

.fc .fc-daygrid-day.fc-day-today {
    background-color: #ffdebf !important;
  }



/* Login Css start
-------------------------------------------------- */

.initial-login .card-body:first-child {
    padding: 0px !important;
}

.login-outerContainer {
    padding: 64px !important;
    background-color: #f5e5d6;
    display: flex;
    justify-content: center;
}

.login-left-container {
    background-color: #fff7ee !important;
}

.login-right-container {
    background-color: #ffdfc1 !important;
}

.login-cardBox {
    background-color: #fff7ee !important;
}

.login-btn {
    background-color: #ea923b !important;
    border-color: #ea923b !important;
}

.card-primary.card-outline {
    border-top: 3px solid #ea923b !important;
}

.icheck-primary {
    margin: 12px 0;
}

.forget-linkbtn {
    color: #721e1e;
    text-decoration: underline;
    margin-top: 12px;
}

a.forget-linkbtn:hover {
    color: #721e1e;
}

.input-group-text{
    background-color: #f5e5d6;
    border: none;
    color: #bf6d1b;
     }


a.login-header {
    color: #bf6d1b;
    text-decoration: none;
    transition: color 0.3s, text-decoration 0.3s;
}

    a.login-header:hover  {
        color: #bf6d1b;
        text-decoration: none;
    }

@media screen and (max-width: 768px) {
    .login-outerContainer {
        padding: 12px !important;
    }
}
    .footer {
        background-color: #f5e5d6;
    }

    .text-muted {
        color: #fff7ee !important;
    }

/* Student Portal Stylings */
.header-nav .navbar-brand {
    color: #bf6d1b !important;
    text-wrap: nowrap;
    font-weight: 500;
}

.student-navbar {
    background: #fbf5ed !important;
    /*height: 64px;*/
    margin: 14px 14px;
    display: flex;
    align-items: center;
    border-radius: 10px;
    border: none !important;
    box-shadow: inset 0 0 2rem rgb(246 222 199) !important;
    padding: 0 !important;
}

    .student-navbar .container-fluid .navbar-collapse .navbar-nav .nav-item .nav-link {
        color: #bf6d1b !important;
        margin: 0 !important;
    }

.welcome-topbar {
    background: linear-gradient(175deg, rgb(241 195 150) 0%, rgb(242 224 206) 93%, rgb(226 205 184) 99%) !important;
    min-height: 196px;
    display: flex;
    align-items: stretch;
    margin: 18px;
    border-radius: 10px;
}

    .welcome-topbar h2 {
        color: #bf6d1b;
        font-size: 28px;
        margin-bottom: 16px;
    }

    .welcome-topbar h3 {
        font-size: 18px;
        color: #bf6d1b;
        margin: 0;
    }

.welcome-studentImg {
    position: absolute;
    max-width: 300px;
    right: 0px;
    width: 100%;
    bottom: 0;
}

.student-navbarContainer {
    max-width: 1400px;
}

.welcome-topbarContainer {
    max-width: 1400px;
    position: relative;
    display: flex;
    flex-grow: 1;
    flex-direction: column;
    justify-content: center;
}

.contentpage-container {
    max-width: 1400px;
}

/* Student Home Screen */
.block-title {
    font-size: 28px;
    font-family: roboto;
    color: #c46d1b;
}
   
/* Login Css end
-------------------------------------------------- */




/* Payments page Css start
-------------------------------------------------- */


.payments-label {
    color: #bf6d1b;
    font-weight: 500;
}


.payments-list-table {
    background-color: #fffbf7;
    width: 100%;
    border-radius: 8px;
    padding: 12px;
    color: #bf6d1b;
    box-shadow: 1px 1px 2px 1px rgb(151 151 151 / 47%);
}

.payments-list-table thead th {
    background-color: #fffbf7;
    color: #bf6d1b;
}

.payments-list-table tbody tr {
    background-color: #fffbf7;
}

.payments-list-table tbody tr:nth-of-type(odd) {
    background-color: #fff7ee;
}

.payments-list-table tbody tr:nth-of-type(even) {
    background-color: #fffbf7;
}

.payments-list-table tbody tr:hover {
    background-color: #ffefe0;
}

.payments-list-table tbody tr td {
    color: #bf6d1b;
    font-size: 16px;
}
/*------For Reset Password for student---------------*/
.btn-dark-orange {
    background-color: #b95b0d; /* Dark Orange color */
    border-color: #d9720c; /* Dark Orange color */
    color: #ffffff; /* White text */
}

    .btn-dark-orange:hover {
        background-color: #d9720c; /* Darker shade on hover */
        border-color: #d9720c; /* Darker shade on hover */
        color: #ffffff; /* White text on hover */
    }

/*------------------------*/
/* Payments page Css end
 -------------------------------------------------- */


/* User List page Css start
-------------------------------------------------- */
.users-list-btn-cont {
    display: flex;
    justify-content: flex-end;
    gap: 12px;
    align-items: center;
}


.add-btn, .add-admin-btn {
    border-radius: 8px;
    padding: 8px 16px;
    color: #fff;
    font-size: 16px;
    font-weight: 500;
}

.add-btn {
    background-color: #e6923f;
    border: 1px solid #e6923f;
}


.add-admin-btn {
    background-color: #bf6d1b;
    border: 1px solid #bf6d1b;
}


.add-btn:hover {
    background-color: transparent;
    border: 1px solid #e6923f;
    color: #e6923f !important;
}

.add-admin-btn:hover {
    background-color: transparent;
    border: 1px solid #bf6d1b;
    color: #e6923f !important;
}

.add-btn:focus {
    background-color: #bf6d1b;
    box-shadow: 0 0 0 .2rem rgba(230, 146, 63, 0.5);
    border-color: #e6923f;
}

.add-admin-btn:focus {
    background-color: #e6923f;
    box-shadow: 0 0 0 .2rem rgba(190, 125, 27, 0.5);
    border-color: #bf6d1b;
}

.users-list-btn-cont .btn-info:not(:disabled):not(.disabled).active, .btn-info:not(:disabled):not(.disabled):active, .show > .btn-info.dropdown-toggle {
    background-color: #bf6d1b;
    box-shadow: 0 0 0 .2rem rgba(230, 146, 63, 0.5);
    border: none;
    color: #fff !important;
}

.users-list-btn-cont .btn-dark:not(:disabled):not(.disabled).active, .btn-dark:not(:disabled):not(.disabled):active, .show > .btn-dark.dropdown-toggle {
    background-color: #e6923f;
    box-shadow: 0 0 0 .2rem rgba(190, 125, 27, 0.5);
    border: none;
    color: #fff !important;
}

.users-list-btn-cont .btn-info:not(:disabled):not(.disabled).active:focus, .btn-info:not(:disabled):not(.disabled):active:focus, .show > .btn-info.dropdown-toggle:focus {
    box-shadow: 0 0 0 .2rem rgba(230, 146, 63, 0.5);
    border: none;
}

.users-list-btn-cont .btn-dark:not(:disabled):not(.disabled).active:focus, .btn-dark:not(:disabled):not(.disabled):active:focus, .show > .btn-dark.dropdown-toggle:focus {
    box-shadow: 0 0 0 .2rem rgba(190, 125, 27, 0.5);
    border: none;
}

@media screen and (max-width: 576px) {
    .users-list-btn-cont {
        flex-direction: column;
        align-items: flex-start;
        gap: 12px;
    }
}


/* User List page Css end
    -------------------------------------------------- */

/* Common override Css start ( select2, filter button, datatable, pagination, datepicker, input[type="date"])
    -------------------------------------------------- */

.select2-container--default .select2-selection--multiple {
    border: 1px solid #f5d3af;
    
}

.select2-container--default .select2-selection--multiple .select2-selection__choice {
    background-color: #bf6d1b;
    border-color: #ecd6c3;
    color: #fff;
    font-weight: 500;
    padding: 0 10px;
    margin-top: .31rem;
}

.select2-container--default .select2-selection--multiple .select2-selection__choice__remove {
    color: #fff;
    font-size: 16px;
}

.select2-container--default .select2-selection--single {
    border-radius: 8px;
    border: 1px solid #f5d3af;
    padding: 8px 12px;
    font-size: 16px;
    color: #bf6d1b;
}

 .select2-container--default .select2-results__option{
        color: #bf6d1b;
    }


 .select2-container--default .select2-selection--single:focus {
        border-color: #e6923f;
        box-shadow: 0 0 0 .2rem rgba(230, 146, 63, 0.5);
    }

   .select2-container--default.select2-container--focus .select2-selection--multiple, .select2-container--default.select2-container--focus .select2-selection--single {
        border-color: #e6923f;
    }


 .select2-container--default.select2-container--open .select2-selection--single {
    border-color: #e6923f;
}

 .select2-container--default .select2-selection--single:hover {
    border-color: #e6923f;
}

 .select2-container--default .select2-selection--single .select2-selection__arrow b {
    border-color: #bf6d1b transparent transparent transparent;
}



 .select2-container--default.select2-container--open .select2-selection--single .select2-selection__arrow b {
    border-color: transparent transparent #bf6d1b transparent;
    border-width: 0 4px 5px 4px;
}


 .select2-container--default .select2-results__option--highlighted[aria-selected], .select2-container--default .select2-results__option--highlighted[aria-selected]:hover {
    background-color: #bf6d1b;
    color: #fff;
}

.select2-container--default .select2-results__option[aria-selected=true], .select2-container--default .select2-results__option[aria-selected=true]:hover{
    background-color: #ea9c4f;
    color: #fff;
   }

 .select2-container--default .select2-selection--single .select2-selection__rendered {
    color: #bf6d1b;
    font-weight: 600;
}

.select2-container--default .select2-dropdown .select2-search__field, .select2-container--default .select2-search--inline .select2-search__field {
    border: 1px solid #bf6d1b;
    color: #bf6d1b;
}


    .select2-container--default .select2-dropdown .select2-search__field:focus {
        border: 1px solid #e6923f;
        box-shadow: 0 0 0 .2rem #f5d3af;
        color: #bf6d1b;
    }
.filter-btn {
    background-color: #bf6d1b;
    border-radius: 6px;
    color: #fff;
    font-size: 16px;
    font-weight: 500;
    border: 1px solid #e6923f;
}

.filter-btn:hover {
    background-color: transparent;
    border: 1px solid #bf6d1b;
    color: #bf6d1b !important;
}


.filter-btn :focus {
    background-color: #bf6d1b;
    box-shadow: 0 0 0 .2rem rgba(190, 125, 27, 0.5);
    border-color: #bf6d1b;
}


.filter-btn:active{
    color: #fff !important;
}


.filter-btn, .btn-outline-primary:not(:disabled):not(.disabled).active, .btn-outline-primary:not(:disabled):not(.disabled):active, .show > .btn-outline-primary.dropdown-toggle {
    background-color: #e6923f;
    border-color: #e6923f;
}

 .btn-outline-primary.focus, .btn-outline-primary:focus {
    box-shadow: 0 0 0 .2rem #f5d3af;
    border: none;
}

.btn-outline-primary:not(:disabled):not(.disabled):active:focus {
    box-shadow: 0 0 0 .2rem #f5d3af;
    border: none;
    color: #fff !important;
}

/* Datatable Css */

 .dataTables_wrapper {
    padding: 12px;
    border-radius: 8px;
    background-color: #fffbf7;
    color: #bf6d1b;
}

 .dataTables_wrapper .dataTables_length select {
    border-radius: 6px;
    border: 1px solid #f5d3af;
    font-size: 16px;
    color: #bf6d1b;
}
    .dataTables_wrapper .dataTables_length select:hover {
        border-color: #e6923f;
        color: #bf6d1b;
    }

    .dataTables_wrapper .dataTables_length select:focus {
        border-color: #e6923f;
        box-shadow: 0 0 0 .2rem rgba(230, 146, 63, 0.5);
        color: #bf6d1b;
    }

    .dataTables_wrapper .dataTables_length select::placeholder {
        color: #bf6d1b;
    }

    .dataTables_wrapper .dataTables_length select option {
        color: #bf6d1b;
    }

    .dataTables_wrapper .dataTables_length select option:hover {
        background-color: #bf6d1b;
        color: #fff;
    }
        .dataTables_wrapper .dataTables_length select option:checked {
            background-color: #e6923f;
            color: #fff;
        }

    .dataTables_wrapper .dataTables_length select option:focus {
        background-color: #e6923f;
        color: #fff;
    }

  .dataTables_wrapper div.dataTables_filter input {
        border-radius: 6px;
        border: 1px solid #f5d3af;
        padding: 8px 12px;
        font-size: 16px;
        color: #bf6d1b;
    }



    .dataTables_wrapper div.dataTables_filter input:focus {
        border-color: #e6923f;
        box-shadow: 0 0 0 .2rem rgba(230, 146, 63, 0.5);
        color: #bf6d1b;
       
    }
    .dataTables_wrapper div.dataTables_filter input::placeholder {
        color: #bf6d1b;
    }

    .dataTables_wrapper div.dataTables_filter input:hover {
        border-color: #e6923f;
        color: #bf6d1b;
    }


.table-striped tbody tr:nth-of-type(odd) {
    background-color: #fff7ee;
}

.table-striped tbody tr:nth-of-type(even) {
    background-color: #fffbf7;
    }

.icon-btn {
    background-color: transparent;
    border: none;
    color: #e6923f;
    font-size: 18px;
}

.icon-btn:hover {
    color: #b35d07;
    box-shadow: inset 1px 1px 5px rgba(190, 125, 27, 0.5);
}

.icon-btn:focus {
    color: #bf6d1b;
    outline: none;
    box-shadow: inset 1px 1px 5px rgba(190, 125, 27, 0.5);
}

.icon-btn:active{
    color: #bf6d1b;
    box-shadow: inset 1px 1px 5px rgba(190, 125, 27, 0.5);
}

.icon-btn:disabled{
    color: #bf6d1b;
}

    
/* Datatable Pagination Css */
.dataTables_paginate .paginate_button {
    border-radius: 6px;
    border: none;
    font-size: 16px;
    color: #bf6d1b;
}

.dataTables_paginate .page-link{
    color: #bf6d1b;
}

.dataTables_paginate .paginate_button:hover {
    background-color: #e6923f;
    color: #fff;
}
   
    .dataTables_paginate .paginate_button.current {
        background-color: #e6923f;
        color: #fff;
    }

    .dataTables_paginate .paginate_button.current:hover {
        background-color: #bf6d1b;
        color: #fff;
    }

    .dataTables_paginate .paginate_button.current:focus {
        background-color: #bf6d1b;
        color: #fff;
    }

    .dataTables_paginate .paginate_button.current:active {
        background-color: #e6923f;
        color: #fff;
    }

    .dataTables_paginate .paginate_button:hover {
        background-color: #e6923f;
        color: #fff;
    }

    .dataTables_paginate .paginate_button:focus {
        background-color: #bf6d1b;
        color: #fff;
    }

.dataTables_paginate .page-item.active .page-link {
    background-color: #e6923f;
    color: #fff;
    border: none;
}

table.dataTable.dtr-inline.collapsed > tbody > tr > td.dtr-control:before {
    background-color: #e6923f !important;
}


/* Datepicker Css */

.ui-datepicker .ui-datepicker-header {
    background: #f5d3af;
    color: #bf6d1b;
}
.ui-datepicker table{
    background: #fffbf7;
    color: #bf6d1b;
    font-weight: 500;
}

.ui-datepicker .ui-datepicker-title select {
    color: #bf6d1b;
}

.ui-datepicker-next , .ui-datepicker-prev {
    color: #bf6d1b;
}


.ui-datepicker-next:hover, .ui-datepicker-prev:hover {
    color: #e6923f;
}

.ui-datepicker-next:focus, .ui-datepicker-prev:focus {
    color: #bf6d1b;
}

.ui-datepicker-next:active, .ui-datepicker-prev:active {
    color: #e6923f;
}



.ui-datepicker .ui-datepicker-prev, .ui-datepicker .ui-datepicker-next {
    color: #bf6d1b;
}

.ui-datepicker .ui-datepicker-prev:hover, .ui-datepicker .ui-datepicker-next:hover {
    color: #e6923f;
}

.ui-datepicker .ui-datepicker-prev:focus, .ui-datepicker .ui-datepicker-next:focus {
    color: #bf6d1b;
}

.ui-datepicker .ui-datepicker-prev:active, .ui-datepicker .ui-datepicker-next:active {
    color: #e6923f;
}

.ui-state-default, .ui-widget-content .ui-state-default{
    background: #fffbf7;
    color: #bf6d1b;
    border: 1px solid #f5d3af;
}

.ui-state-active, .ui-widget-content .ui-state-active {
    background: #e6923f;
    color: #fff;
    border: 1px solid #bf6d1b;
}

/* input[type="date"] Css */

input[type="date"] {
    appearance: none;
    -webkit-appearance: none;
    -moz-appearance: none;
    background-color: #fff;
    border: 1px solid #f5d3af;
    padding: 8px 12px;
    font-size: 16px;
    border-radius: 4px;
    transition: border-color 0.3s, box-shadow 0.3s;
    position: relative;
}

input[type="date"]:hover {
    border-color: #e6923f;
    box-shadow: inset 1px 1px 5px rgba(190, 125, 27, 0.5);
}

input[type="date"]:focus {
    border-color: #e6923f;
    box-shadow: 0 0 0 .2rem rgba(230, 146, 63, 0.5);
}

input[type="date"]::placeholder {
    color: #bf6d1b;
}

input[type="date"]:disabled, input[type="date"][readonly] {
    background-color: #ecd6c3;
    opacity: 0.9;
    color: #bf6d1b;
}

input[type="date"]::-webkit-calendar-picker-indicator {
    color: #bf6d1b !important;
    border-radius: 4px;
    padding: 8px;
    font-size: 16px;
    cursor: pointer;
}

@media screen and (max-width: 576px) {
    .dataTables_wrapper {
        padding: 10px 0;
    }

    div.dataTables_wrapper div.dataTables_filter input {
        margin-left: 0 !important;
        display: flex !important;
        width: 90% !important;
    }
}
   
/* Common override Css end ( select2, filter button, datatable, pagination, datepicker, input[type="date"])
            -------------------------------------------------- */


/* Create, Edit, Register Form Page Css Start 
-----------------------------------*/

.user-form-main-header {
    color: #e6923f;
    font-size: 2.4em;
    text-align: center;
    font-weight: 600;
    padding: 0;
    margin-bottom: 20px;
    font-style: italic;
}

.user-form-header {
    color: #bf6d1b;
    font-size: 1.75em;
    font-weight: 500;
    padding: 0;
    margin: 0;
}

.user-form-container{
    display: flex;
    justify-content: space-between;
    align-items: center;
    margin-bottom: 12px;
    padding: 12px;
    width: 100%;
    max-width: 100%;
}

    .user-form-container .form-control {
        border-radius: 6px;
        border: 1px solid #f5d3af;
        font-size: 16px;
        color: #bf6d1b;
    }


    .user-form-container .form-control:focus {
        border-color: #e6923f;
        box-shadow: 0 0 0 .2rem rgba(230, 146, 63, 0.5);
        color: #bf6d1b;
    }

    .user-form-container .form-control::placeholder {
        color: #bf6d1b;
    }

    .user-form-container .form-control:hover {
        border-color: #e6923f;
        color: #bf6d1b;
    }

    .user-form-container .form-control:disabled, .form-control[readonly]{
         background-color: #ecd6c3;
         opacity: 0.9;
         color: #bf6d1b;
    }

    .user-form-container .select2-container--default .select2-selection--multiple .select2-selection__choice {
        background-color: #bf6d1b;
        border-color: #ecd6c3;
        color: #fff;
        font-weight: 500;
        padding: 0 10px;
        margin-top: .31rem;
    }

    .user-form-container .select2-container--default .select2-selection--multiple .select2-selection__choice__remove {
        color: #fff;
        font-size: 16px;
    }

    .user-form-container .select2-container--default .select2-selection--multiple .select2-selection__choice__remove:hover {
        color: #bf6d1b;
    }

    .user-form-container .save-btn, .btn-primary:not(:disabled):not(.disabled).active, .btn-primary:not(:disabled):not(.disabled):active, .show > .btn-primary.dropdown-toggle {
        color: #fff !important;
        background-color: #b95b0d;
        border-color: #b95b0d61;
    }

    .user-form-container .save-btn:hover {
        color: #fff;
        background-color: #e6923f;
        border-color: #e6923f;
    }

        .user-form-container .save-btn:focus, .btn-primary.focus, .btn-primary:focus {
            color: #fff;
            background-color: #bf6d1b;
            border-color: #bf6d1b;
            box-shadow: 0 0 0 .2rem #f5d3af;
        }

        .user-form-container .save-btn:active, btn-primary:not(:disabled):not(.disabled).active:focus, .btn-primary:not(:disabled):not(.disabled):active:focus, .show > .btn-primary.dropdown-toggle:focus {
            color: #fff;
            background-color: #b95b0d;
            border-color: #b95b0d61;
            box-shadow: 0 0 0 .2rem #f5d3af;
        }

        .user-form-container .save-btn:disabled, .btn-primary:disabled, .btn-primary.disabled {
            color: #fff;
            background-color: #b95b0d;
            border-color: #b95b0d61;
        }

    .user-form-container .btn i {
        margin-right: 5px; 
    }



/* Create, Edit, Register Form Page Css End           
    -----------------------------------*/


/* User Details Page Css Start
            -------------------------------------------------- */

.user-form-top-section {
    display: flex;
    justify-content: space-between;
    align-items: center;
    margin: 12px 0 24px 0;
}

.user-form-filter-section{
    display: flex;
    justify-content: space-between;
    align-items: center;
    margin-bottom: 12px;
    width: 50%;
    max-width: 60%;
    gap: 12px;
}

@media screen and (max-width: 576px) {
    .user-form-top-section {
        flex-direction: column;
        align-items: flex-start;
        gap: 12px;
    }

    .user-form-filter-section{
      flex-direction: column;
      width: 100%;
      max-width: 100%;
      align-items: flex-start;
      gap: 12px;
    }
}

.user-details-container{
    display: flex;
    flex-direction: column;
    margin-bottom: 12px;
    padding: 12px;
    width: 100%;
    max-width: 100%;
    background-color: #fffbf7;
    border-radius: 8px;
    color: #bf6d1b;
    box-shadow: 1px 1px 2px 1px rgb(151 151 151 / 47%);
}

.user-details-container .edit-btn{
    background-color: #e6923f;
    border-color: #e6923f;
    border-radius: 8px;
    padding: 8px 16px;
    color: #fff;
    font-size: 16px;
    font-weight: 500;
    border: none;
}

.user-details-container .edit-btn:hover {
    background-color: transparent;
    border: 1px solid #e6923f;
    color: #e6923f !important;
}

.user-details-container .edit-btn:focus {
    background-color: #bf6d1b;
    box-shadow: 0 0 0 .2rem rgba(230, 146, 63, 0.5);
    border-color: #e6923f;
    color: #fff !important;
}

.user-details-container .edit-btn:active {
    background-color: #e6923f;
    border-color: #e6923f;
    box-shadow: inset 0 0.5rem 1rem rgba(0, 0, 0, 0.15);
}

.user-form-top-section .user-details-row{
    display: flex;
    justify-content: space-between;
    align-items: center;
    margin-bottom: 12px;
}

.user-form-top-section .back-btn {
    background-color: #bf6d1b;
    border-color: #bf6d1b;
    border-radius: 8px;
    padding: 8px 16px;
    color: #fff;
    font-size: 16px;
    font-weight: 500;
    border: 1px solid #bf6d1b;
}

.user-form-top-section .back-btn:hover {
    background-color: transparent;
    border: 1px solid #bf6d1b;
    color: #bf6d1b !important;
}

.user-form-top-section .back-btn:focus {
    background-color: #e6923f;
    box-shadow: 0 0 0 .2rem rgba(190, 125, 27, 0.5);
    border-color: #bf6d1b;
    color: #fff !important;
}

.user-form-top-section .back-btn:active {
    background-color: #bf6d1b;
    border-color: #bf6d1b;
    box-shadow: inset 0 0.5rem 1rem rgba(0, 0, 0, 0.15) !important;
}

.user-details-container .user-details-row .user-details-label{
    color: #bf6d1b;
    font-size: 16px;
    font-weight: 500;
}

.user-details-container .user-details-row .user-details-value{
    color: #bf6d1b;
    font-size: 16px;
    font-weight: 500;
}


/* User Details Page Css End
            -------------------------------------------------- */



/*
    Common Css for Popup Modals Start
    -----------------------------------*/
.modal-content {
    background-color: #fffbf7;
    color: #bf6d1b;
    border-radius: 8px;
    border: 1px solid #f5d3af;
    box-shadow: 1px 1px 2px 1px rgb(151 151 151 / 47%);
}
.modal-header {
    background-color: #ffefe0;
    color: #fff;
    border-bottom: 1px solid #f5d3af;
}

.modal-title {
    color : #bf6d1b;
    font-size: 1.3em;
    font-weight: 600;
}

.modal-body {
    background-color: #fffbf7;
    color: #bf6d1b;
    border-radius: 8px;
}

.modal-footer {
    background-color: #fffbf7;
    color: #bf6d1b;
    border-top: 1px solid #f5d3af;
    padding: 0;
    border-bottom-left-radius: 8px;
    border-bottom-right-radius: 8px;
}

.modal-footer .btn {
    border-radius: 8px;
    padding: 8px 16px;
    color: #fff;
    font-size: 16px;
    font-weight: 500;
    border: none;
}

    .modal-footer .btn-primary, .form-group .btn-primary {
        background-color: #e6923f;
        border: 1px solid #e6923f;
    }

    .modal-footer .btn-primary:hover, .form-group .btn-primary:hover {
        background-color: transparent;
        border: 1px solid #e6923f;
        color: #e6923f !important;
    }

    .modal-footer .btn-primary:focus, .form-group .btn-primary:focus {
        background-color: #bf6d1b;
        box-shadow: 0 0 0 .2rem rgba(230, 146, 63, 0.5);
        border-color: #e6923f;
    }

    .modal-footer .btn-primary:active, .form-group .btn-primary:active {
        background-color: #e6923f;
        border-color: #e6923f;
        box-shadow: inset 0 0.5rem 1rem rgba(0, 0, 0, 0.15);
    }

    .modal-footer .btn-secondary, .form-group .btn-secondary {
        background-color: #bf6d1b;
        border: 1px solid #bf6d1b;
    }

        .modal-footer .btn-secondary:hover, .form-group .btn-secondary:hover {
            background-color: transparent;
            border: 1px solid #bf6d1b;
            color: #bf6d1b !important;
        }

        .modal-footer .btn-secondary:focus, .form-group .btn-secondary:focus {
            background-color: #e6923f;
            box-shadow: 0 0 0 .2rem rgba(190, 125, 27, 0.5);
            border-color: #bf6d1b;
        }

        .modal-footer .btn-secondary:active, .form-group .btn-secondary:active {
            background-color: #bf6d1b;
            border-color: #bf6d1b;
            box-shadow: inset 0 0.5rem 1rem rgba(0, 0, 0, 0.15);
        }

.form-group .btn-default {
    background-color: transparent;
    border: 1px solid #bf6d1b;
    color: #bf6d1b;
}

.form-group .btn-default:hover{
    background-color: #bf6d1b;
    border-color: #bf6d1b;
    color: #fff;
}

.form-group .btn-default:focus{
    background-color: #bf6d1b;
    border-color: #bf6d1b;
    color: #fff;
}

.form-group .btn-default:active{
    background-color: #bf6d1b;
    border-color: #bf6d1b;
    color: #fff;
}


.modal-footer .btn-danger {
    background-color: #721e1e;
    border: 1px solid #721e1e;
}

.modal-footer .btn-danger:hover {
    background-color: transparent;
    border: 1px solid #721e1e;
    color: #721e1e !important;
}

.modal-footer .btn-danger:focus {
    background-color: transparent;
    box-shadow: 0 0 0 .2rem rgba(114, 30, 30, 0.5);
    border-color: #721e1e;
    color: #721e1e !important;
}

.modal-footer .btn-danger:active {
    background-color: #721e1e;
    border-color: #721e1e;
    box-shadow: inset 0 0.5rem 1rem rgba(0, 0, 0, 0.15);
    color: #fff ;
}

.modal-footer .btn-info {
    background-color: #bf6d1b;
    border: 1px solid #bf6d1b;
}

.modal-footer .btn-info:hover {
    background-color: transparent;
    border: 1px solid #bf6d1b;
    color: #bf6d1b !important;
}

.modal-footer .btn-info:focus {
    background-color: #e6923f;
    box-shadow: 0 0 0 .2rem rgba(190, 125, 27, 0.5);
    border-color: #bf6d1b;
}

.modal-footer .btn-info:active {
    background-color: #bf6d1b;
    border-color: #bf6d1b;
    box-shadow: inset 0 0.5rem 1rem rgba(0, 0, 0, 0.15);
}

.modal-footer .btn-dark {
    background-color: #721e1e;
    border: 1px solid #721e1e;
}

.modal-footer .btn-dark:hover {
    background-color: transparent;
    border: 1px solid #721e1e;
    color: #721e1e !important;
}

.modal-footer .btn-dark:focus {
    background-color: #bf6d1b;
    box-shadow: 0 0 0 .2rem rgba(114, 30, 30, 0.5);
    border-color: #721e1e;
}

.modal-footer .btn-dark:active {
    background-color: #721e1e;
    border-color: #721e1e;
    box-shadow: inset 0 0.5rem 1rem rgba(0, 0, 0, 0.15);
}

.modal-footer .btn-light {
    background-color: #f5e5d6;
    border: 1px solid #f5e5d6;
}

.modal-footer .btn-light:hover {
    background-color: transparent;
    border: 1px solid #f5e5d6;
    color: #f5e5d6 !important;
}

.modal-footer .btn-light:focus {
    background-color: #bf6d1b;
    box-shadow: 0 0 0 .2rem rgba(245, 229, 214, 0.5);
    border-color: #f5e5d6;
}

.modal-footer .btn-light:active {
    background-color: #f5e5d6;
    border-color: #f5e5d6;
    box-shadow: inset 0 0.5rem 1rem rgba(0, 0, 0, 0.15);
}


/* Common Css for Popup Modals End
    -----------------------------------*/



/* Common Css for Forms */
.form-container {
    width: 100%;
    padding: 12px;
    border-radius: 8px;
    background-color: #fffbf7;
    color: #bf6d1b;
    box-shadow: 1px 1px 2px 1px rgb(151 151 151 / 47%);
}


.form-control{
    border-radius: 6px;
    border: 1px solid #f5d3af;
    font-size: 16px;
    color: #bf6d1b;
}

.form-control:focus {
    border-color: #e6923f;
    box-shadow: 0 0 0 .2rem rgba(230, 146, 63, 0.5);
    color: #bf6d1b;
}

.form-control::placeholder {
    color: #bf6d1b;
}

.form-control:hover {
    border-color: #e6923f;
    color: #bf6d1b;
}

.form-control:disabled, .form-control[readonly]{
    background-color: #ecd6c3;
    opacity: 0.9;
    color: #bf6d1b;
}

.form-control:focus::placeholder {
    color: #bf6d1b;
}

.form-control:disabled::placeholder, .form-control[readonly]::placeholder{
    color: #bf6d1b;
}

input::file-selector-button {
    background-color: #bf6d1b;
    border-color: #e6923f;
    box-shadow: inset 0 1px 4px rgba(0, 0, 0, 0.075);
    border-radius: 6px;
    color: #fff;
    font-weight: 500;
}

/*
    Common Css for Forms End
    -----------------------------------*/


/* Common Css for Alerts Start
    -----------------------------------*/

.alert {
    border-radius: 8px;
    color: #bf6d1b;
    font-size: 16px;
    font-weight: 500;
}

.alert-primary {
    background-color: #e6923f;
    border-color: #e6923f;
}


/* Common Css for Alerts End
    ----------------------------------- */

/* File Page Css Start
    -----------------------------------*/

.files-container {
    display: flex;
    flex-wrap: wrap;
    gap: 15px;
}


.files-card {
    width: 200px;
    padding: 12px;
    border-radius: 12px;
    background-color: #fffbf7;
    color: #bf6d1b;
    box-shadow: 1px 1px 2px 1px rgb(151 151 151 / 47%);
    transition: transform 0.3s, box-shadow 0.3s;
    border: 2px solid #f0f0f0;
    text-align: center;
    max-width: 100%;
}

    .files-card:hover {
        transform: translateY(-5px);
        box-shadow: 0 8px 16px rgba(0,0,0,0.2);
    }

.file-icon {
    width: 100%;
    height: auto;
    margin: 0 auto;
}

.file-name {
    margin-top: 10px;
    font-weight: 500;
    color: #bf6d1b;
    width: 100%;
    text-overflow: ellipsis;
    overflow: hidden;
    white-space: nowrap;

}

.action-buttons {
    display: flex;
    justify-content: center;
    gap: 8px;
    margin-top: 10px;
}

    .action-buttons a {
        color: #555;
        transition: color 0.3s;
    }

        .action-buttons a:hover {
            color: #000;
        }

.file-order-number {
    width: 30px;
    height: 30px;
    top: -10px;
    right: -10px;
    background-color: red !important;
}

.file-order-number span {
    color: #fff;
    font-size: 16px;
    font-weight: 500;
}

.files-btn-cont .btn i{
    margin-right: 5px;
}

.shared-files-cont{
    display: flex;
    justify-content: space-between;
    align-items: center;
    margin-bottom: 12px;
    background-color: #fffbf7;
    padding: 12px;
    border-radius: 8px;
    color: #bf6d1b;
    box-shadow: 1px 1px 2px 1px rgb(151 151 151 / 47%);
    border: 2px solid #f0f0f0;
    overflow: auto;
}


@media screen and (max-width: 576px) {
    .files-container{
        justify-content: space-evenly;
    }
    .files-card {
        width: 100%;
    }
}


/* File Page Css End
    -----------------------------------*/



/* Student Portal Topics Screen Stylings Start
    -----------------------------------*/

.topics-list-header {
    color: #bf6d1b;
}

.topic-container {
    background-color: #f8f9fa;
    box-shadow: 0 0 10px rgba(0, 0, 0, 0.1);
   
}

    .topic-container:hover {
        transform: scale(1.05);
        box-shadow: 0 0 20px rgba(0, 0, 0, 0.2);
    }

.topic-name {
    color: #bf6d1b;
}

.topic-description-head, .curriculum-name-head {
    color: #bf6d1b;
}

.topic-description, .curriculum-name {
    color: #474936;
}

.topics-head-icon {
    background: linear-gradient(175deg, rgb(228 143 59) 0%, rgb(215 175 134) 93%, rgb(226 205 184) 99%) !important;
    color: #fff;
    box-shadow: inset 0 1px 4px rgba(0, 0, 0, 0.075);
}


.topics-icon {
    background-color: #f8f9fa;
    box-shadow: inset 0 1px 4px rgba(0, 0, 0, 0.075);
}


.topic-container p {
    background-color: #ffedcb;
    color: #bf6d1b;
}


    .topic-container p i {
        color: #bf6d1b;
    }

.popover{
    background-color: #fffbf7;
    color: #bf6d1b;
    border-radius: 8px;
    box-shadow: 1px 1px 2px 1px rgb(151 151 151 / 47%);
    border: none;
}

.popover-header{
    background-color: #ffedcb;
    color: #bf6d1b;
    font-weight: 500;
    border-bottom: 1px solid #f5d3af;
}

.popover-body{
    background-color: #fffbf7;
    color: #bf6d1b;
}

.popover .arrow::after {
    border-bottom-color: #fffbf7;
}

.popover .arrow::before {
    border-bottom-color: #ffedcb;
}

.popover .popover-header {
    border-bottom: 1px solid #f5d3af;
}


.custom-scroll-bar::-webkit-scrollbar-track {
    -webkit-box-shadow: inset 0 0 6px rgba(0,0,0,0.3);
    background-color: #F5F5F5;
    border-radius: 10px;
}

.custom-scroll-bar::-webkit-scrollbar {
    width: 8px;
    background-color: #F5F5F5;
}

.custom-scroll-bar::-webkit-scrollbar-thumb {
    border-radius: 10px;
    background: #e9bf95;
}


.no-topics-container {
    background: linear-gradient(175deg, rgb(241 195 150) 0%, rgb(242 224 206) 93%, rgb(226 205 184) 99%);
    box-shadow: inset 0 0 2rem rgb(246 222 199);
}

.no-topics-head-icon {
    background: #bf6d1b;
    color: #fff;
    box-shadow: inset 0 1px 4px rgba(0, 0, 0, 0.075);
}

.no-topics-list-header {
    color: #bf6d1b;
}

/* Student Portal Topics Screen Stylings End
    -----------------------------------*/


/* Student Portal Feedback Screen Stylings Start
    -----------------------------------*/

.comments-list-header {
    color: #bf6d1b;
}

.comments-container {
    background-color: #ffedcb;
    box-shadow: 0 0 10px rgba(0, 0, 0, 0.1);
}

    .comments-container:hover {
        transform: scale(1.05);
        box-shadow: 0 0 20px rgba(0, 0, 0, 0.2);
    }


.comment-box .comment-head {
    background: #bf6d1b;
    box-shadow: inset 0 1px 10px rgba(0, 0, 0, 0.075);
}

.comment-box:before, .comment-box:after {
    border-color: transparent #bf6d1b;
}

.comment-name {
    color: #fff;
}

.comment-content{
    color: #bf6d1b;

}

.no-feedbacks-container{
    background: linear-gradient(175deg, rgb(241 195 150) 0%, rgb(242 224 206) 93%, rgb(226 205 184) 99%);
    box-shadow: inset 0 0 2rem rgb(246 222 199);

}

.no-feedbacks-head-icon{
    background: #bf6d1b;
    color: #fff;
    box-shadow: inset 0 1px 4px rgba(0, 0, 0, 0.075);
}

.no-feedbacks-list-header{
    color: #bf6d1b;

}

.no-feedback-description {
    color: #474936;
}


/* Student Portal Feedback Screen Stylings End
    -----------------------------------*/




/* Student Portal Payment Details Screen Stylings Start
    -----------------------------------*/


.payment-detail-header {
    color: #bf6d1b;
    font-size: 1.7rem;
    font-weight: bold;
    padding: 0;
    margin-bottom: 30px;
}

.payment-details-tab-container .nav-item, payment-details-tab-container .payment-details-nav-item {
    color: #bf6d1b;
}


    .payment-details-tab-container .nav-item, payment-details-tab-container .payment-details-nav-item.active {
        color: #e6923f;
        
    }

.payment-details-tab-container .nav-item.show .nav-link, .payment-details-tab-container .nav-link.active {
    color: #e6923f;
    background: linear-gradient(175deg, rgb(241 195 150) 0%, rgb(242 224 206) 93%, rgb(226 205 184) 99%);
    box-shadow: inset 1px 1px 5px rgba(190, 125, 27, 0.5);
}

.payment-details-tab-container .nav-item .nav-link, payment-details-tab-container .payment-details-nav-item {
    color: #e6923f !important;
    font-weight: 500;
}

            .payment-details-tab-container .nav-link:hover, payment-details-tab-container .payment-details-nav-item:hover {
                color: #bf6d1b !important;
                box-shadow: inset 1px 1px 5px rgba(190, 125, 27, 0.5);
            }

            .payment-details-tab-container .nav-link:focus, payment-details-tab-container .payment-details-nav-item:focus {
                color: #bf6d1b !important;
                box-shadow: inset 1px 1px 5px rgba(190, 125, 27, 0.5);
            }

            .payment-details-tab-container .nav-link:active, payment-details-tab-container .payment-details-nav-item:active {
                color: #bf6d1b !important;
                box-shadow: inset 1px 1px 5px rgba(190, 125, 27, 0.5);
            }



.payment-details-table {
    background-color: #fffbf7;
    width: 100%;
    border-radius: 8px;
    color: #bf6d1b;
}

    .payment-details-table thead th {
        background: #f5d3af !important;
        color: #bf6d1b;
        font-weight: 600;
        box-shadow: inset 0 0 2rem rgba(190, 125, 27, 0.5) !important;
        border: none;
    }

    .payment-details-table th:last-child {
        border-radius: 0 8px 0 0;
        box-shadow: none;
    }

    .payment-details-table th:first-child {
        border-radius: 8px 0 0 0;
        box-shadow: none;
    }

.payment-details-table tbody tr:nth-of-type(odd) {
    background-color: #fffbf7;
    }

.payment-details-table tbody tr:nth-of-type(even) {
    background-color: #ffedcb;
    }

    .payment-details-table tbody tr:hover {
        background-color: #fff;
        color: #e6923f;
    }

.payment-details-table tbody tr:hover td {
    color: #bf6d1b;
    }
.table.dataTable td.dt-control:before {
    background-color: #ffc107;
}
/* Student Portal Payment Details Screen Stylings End
    -----------------------------------*/
/* Student Portal ShareFilePopup Screen Stylings Start
    ----------------------------------- */
@media screen and (max-width: 992px) {
    .dataTables_wrapper #ShareFilesList_filter input {
        display: block;
        margin-left: 0;
    }
}
@media screen and (max-width: 750px) {
    .responsive-details-table {
        display: block;
        width: 100%;
        overflow-x: auto;
    }

        .responsive-details-table table {
            width: 100%;
           /* display: block;*/
        }

        .responsive-details-table thead {
            display: none;
        }

        .responsive-details-table tbody tr {
            display: block;
            width: 100%;
            margin-bottom: 10px;
        }

        .responsive-details-table td {
            display: block;
            text-align: right;
            font-size: 14px;
            border-bottom: 1px solid #ddd;
        }

            .responsive-details-table td:before {
                content: attr(data-title);
                float: left;
                font-weight: bold;
            }

            .responsive-details-table td:last-child {
                border-bottom: 0;
            }

}