/*CUSTOM CSS*/

.dt-layout-row.dt-layout-table::-webkit-scrollbar {
    height: 12px !important; 
}
.dt-layout-cell.dt-layout-full::-webkit-scrollbar-thumb {
  background: #00FF00 !important; /* thumb color */
  border-radius: 6px;
}

.dt-layout-cell.dt-layout-full {
    width: 100%;
    overflow-x: auto;
    -webkit-overflow-scrolling: touch !important;
}

input:-webkit-autofill {
    background-color: transparent !important;
    -webkit-box-shadow: 0 0 0px 1000px transparent inset !important;
}

.bg-gradient-dark{
    background-image: linear-gradient(195deg, #B43A91 0%, #B43A91 100%);
}

.bg-gradient-dark:hover{
    background-image: linear-gradient(195deg, #E3642B 0%, #E3642B 100%);
}

.bg-gradient-secondary{
    background-image: linear-gradient(195deg, #E3642B 0%, #E3642B 100%);
}

.fc-button-group{
    display:none;
}

.fc .fc-button-primary{
    background-color: #B43A91;
    border-color: #B43A91;
}

.fc .fc-button:disabled{
    background-color: #E3642B;
    border-color: #E3642B;
    opacity: 1;
}

.fc .fc-button-primary:hover{
    background-color: #E3642B;
    border-color: #E3642B;
}

.fc .fc-button-primary:not(:disabled).fc-button-active, 
.fc .fc-button-primary:not(:disabled):active {
    background-color: #E3642B;
    border-color: #E3642B;
    outline: none;
}
.fc .fc-button-primary:not(:disabled).fc-button-active:focus, 
.fc .fc-button-primary:not(:disabled):active:focus, 
.fc .fc-button-primary:focus{
    box-shadow: unset;
}

.navbar-vertical .navbar-brand>img, 
.navbar-vertical .navbar-brand-img{
    height: auto;
    width: 100%;
    max-width: 56px;
}

.img-signin{
    width: 100%;
}

.bg-signin{
    background-image: linear-gradient(195deg, #363435 0%, #363435 100%);
}
.bg-singin-ovelay{
    background-image: linear-gradient(195deg, #363435 0%, #363435 100%);
}

.fc-h-event{
    background: #b43a91;
    border: #b43a91;
    cursor: pointer;
}

.fc-h-event:hover{
    background: #E3642B;
    border: #E3642B;
}

#eventModal {
    color: #000;
}

#eventModal .modal-footer .btn{
    transition: ease 0.3s all;
    background: #b43a91;
    border: #b43a91;
    cursor: pointer;
}

#eventModal .modal-footer .btn:hover{
    background: #E3642B;
    border: #E3642B;
}

#eventModal .modal-header{
    background: #E3642B;
    color: #fff;
}

#eventModal .modal-header .btn-close{
    transition: ease 0.3s all;
    opacity: 1;
}

#eventModal .modal-header .btn-close:hover{
    opacity: 0.5;
}

#eventModal .modal-header h5{
    color: #fff;
}

.fc-theme-standard .fc-popover-header {
    background: #E3642B;
    color: #fff;
}

.modal-body::-webkit-scrollbar-track {
      background: #f1f1f1 !important;
}

.modal-body::-webkit-scrollbar {
  width: 10px;
}

.modal-body::-webkit-scrollbar-thumb {
  background: #b43a91;
  border-radius: 10px;
}

.dt-search {
    margin-right: 16px;
}

.modal-header {
    background: #E3642B;
}

.modal-header h5{
    color: #fff;
}

input#end_date, input#start_date {
    width: 250px !important;
    padding: 8px 12px !important;
    font-size: 14px !important;
    color: #333 !important;
    background: #fff !important;
    border: 2px solid #b43a91 !important;
    border-radius: 6px !important;
    outline: none !important;
    transition: all 0.3s ease-in-out !important;
    box-shadow: 2px 2px 5px rgba(0, 0, 0, 0.1) !important;
}

div#dtrTable_info {
    padding: 15px;
    text-align: center;
}

#dtrTable_wrapper .dt-search {
    margin-bottom: 15px;
}

table#dtrTable tr th{
    text-align: center !important;
}
table#dtrTable tr td{
    text-align: center !important;
}

.card input[type="submit"] {
    background-image: linear-gradient(195deg, #B43A91 0%, #B43A91 100%);
    border-radius: 0.375rem;
    color: #fff;
    border: 0;
    padding: 7px 20px;
}
#leave_filing_form .form-control {
    border-color: #B43A91  !important;
    border: 1px solid;
    padding: 10px;
}
.card input[type="submit"]:hover {
    background-image: linear-gradient(195deg, #E3642B 0%, #E3642B 100%); 
}

.dt-paging.paging_full_numbers {
    display: flex;
    gap: 5px;
    justify-content: center;
}
select#filings_type{
        background-color: #B43A91 !important; 
    color: white !important; 
    border: 2px solid #B43A91 !important;
    padding: 5px 10px !important;
    border-radius: 5px !important;
    font-size: 14px !important;
    cursor: pointer !important;
    transition: background-color 0.3s, border-color 0.3s !important;
}
.dt-length select, #filterForm select {
    background-color: #B43A91 !important; 
    color: white !important; 
    border: 2px solid #B43A91 !important;
    padding: 5px 10px !important;
    border-radius: 5px !important;
    font-size: 14px !important;
    cursor: pointer !important;
    transition: background-color 0.3s, border-color 0.3s !important;
}
.dt-length select{
    margin: 0 17px !important;
}
.dt-length select:focus,
.dt-length select:hover, #filterForm select:focus, #filterForm select:hover {
    outline: none !important;
    border-color: #E3642B !important;
    background-color: #E3642B !important;
}

#loginLogoutTable_length select, #logTypeFilter, #updateLogsTable_length select{
    background-color: #B43A91 !important; 
    color: white !important; 
    border: 2px solid #B43A91 !important;
    padding: 5px 10px !important;
    border-radius: 5px !important;
    font-size: 14px !important;
    cursor: pointer !important;
    margin: 0 17px !important;
    transition: background-color 0.3s, border-color 0.3s !important; 
}

#loginLogoutTable_length select:focus, 
#loginLogoutTable_length select:hover, #logTypeFilter:hover, #logTypeFilter:focus, #updateLogsTable_length select:focus, #updateLogsTable_length select:hover{
    background-color: #E3642B !important; 
    color: white !important; 
    border: 2px solid #E3642B !important;
    padding: 5px 10px !important;
    border-radius: 5px !important;
    font-size: 14px !important;
    cursor: pointer !important;
    margin: 0 17px !important;
    transition: background-color 0.3s, border-color 0.3s !important; 
}

.dt-paging nav {
    display: flex !important;
    gap: 6px !important;
    justify-content: center !important;
    align-items: center !important;
    padding: 10px 0 !important;
    margin: 0px 19px !important;
	flex-wrap: wrap;
}
div.dt-container .dt-paging .dt-paging-button:hover{
    
}
body div.dt-container .dt-paging .dt-paging-button {
    background: #B43A91 !important;
    color: white !important;
    border: none !important;
    padding: 8px 14px !important;
    font-size: 14px !important;
    font-weight: 600 !important;
    border-radius: 6px !important;
    cursor: pointer !important;
    transition: all 0.3s ease-in-out !important;
    box-shadow: 2px 2px 5px rgba(0, 0, 0, 0.1) !important;
}

div.dt-container .dt-paging .dt-paging-button:hover {
    background: #E3642B !important; /* Purple hover */
    transform: scale(1.1) !important;
}
body div.dt-container .dt-paging .dt-paging-button.current{
    background: #E3642B !important; /* Purple for active button */
    color: white !important;
    border: 2px solid #E3642B !important;
    transform: scale(1.15) !important;
}
body div.dt-container .dt-paging .dt-paging-button.current:hover{
    background: #B43A91 !important;
    border: 2px solid #E3642B !important;
    color: white !important;
    border: 2px solid #B43A91 !important;
      transform: scale(1.1) !important;
}
div.dt-container .dt-paging .dt-paging-button.disabled {
    background: #ccc !important;
    color: #666 !important;
    box-shadow: none !important;
}

.dt-paging-button:first-child,
.dt-paging-button:last-child,  {
    border-radius: 50% !important;
    width: 36px !important;
    height: 36px !important;
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    font-size: 16px !important;
}


/* Pagination container */
body .dataTables_wrapper .dataTables_paginate {
    display: flex !important;
    justify-content: center !important;
    align-items: center !important;
    gap: 8px !important;
    padding: 12px 0 !important;
}

/* Pagination buttons (numbers) */
body .dataTables_wrapper .dataTables_paginate .paginate_button {
    background: #B43A91 !important; /* Default color */
    color: #fff !important;
    border: none !important;
    padding: 8px 14px !important;
    font-size: 14px !important;
    font-weight: 600 !important;
    border-radius: 6px !important;
    cursor: pointer !important;
    transition: all 0.3s ease-in-out !important;
    text-decoration: none !important;
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    box-shadow: 2px 2px 5px rgba(0, 0, 0, 0.1) !important;
}

.modal-footer button.btn.btn-secondary {
    background-image: linear-gradient(195deg, #B43A91 0%, #B43A91 100%);
}
.modal-footer button.btn.btn-secondary:hover{
    background-image: linear-gradient(195deg, #E3642B 0%, #E3642B 100%);
}
/* Hover effect */
body .dataTables_wrapper .dataTables_paginate .paginate_button:hover {
    background: #E3642B !important;
    transform: scale(1.1) !important;
}

/* Active page button */
body .dataTables_wrapper .dataTables_paginate .paginate_button.current {
    background: #E3642B !important
    color: #fff !important;
    border: 2px solid #E3642B !important
    transform: scale(1.15) !important;
}

/* Active page hover effect */
body .dataTables_wrapper .dataTables_paginate .paginate_button.current:hover {
    transform: scale(1.2) !important;
    color: #fff !important; 
}

/* Disabled pagination buttons */
body .dataTables_wrapper .dataTables_paginate .paginate_button.disabled {
    background: #ccc !important;
    color: #666 !important;
    box-shadow: none !important;
    cursor: not-allowed !important;
}

/* Exclude styling for Previous and Next buttons */
body .dataTables_wrapper .dataTables_paginate .paginate_button.previous,
body .dataTables_wrapper .dataTables_paginate .paginate_button.next {
    background: transparent !important;
    color: inherit !important;
    border: none !important;
    box-shadow: none !important;
    transform: none !important;
    cursor: pointer !important;
    padding: 0 !important;
}

/* Prevent Next button hover from changing color */
body .dataTables_wrapper .dataTables_paginate .paginate_button.next:hover {
    color: inherit !important;
}

/* Adjust spacing between buttons */
body .dataTables_paginate .paginate_button {
    margin: 0 4px !important;
}



#loginLogoutTable_paginate{
    
}
div.dt-container .dt-paging button.dt-paging-button.next, div.dt-container .dt-paging button.dt-paging-button.last {
        background: #ccc !important;
    color: #666 !important;
    box-shadow: none !important;
}
#notFoundEmployee_info, #foundEmployee_info, #myTable_info{
    margin-left: 15px;
}

.dt-search .dt-input {
    width: 250px !important;
    padding: 8px 12px !important;
    font-size: 14px !important;
    color: #333 !important;
    background: #fff !important;
    border: 2px solid #B43A91 !important; 
    border-radius: 6px !important;
    outline: none !important;
    transition: all 0.3s ease-in-out !important;
    box-shadow: 2px 2px 5px rgba(0, 0, 0, 0.1) !important;
}

#loginLogoutTable_filter input[type="search"], #updateLogsTable_filter input[type="search"]{
        width: 250px !important;
    padding: 8px 12px !important;
    font-size: 14px !important;
    color: #333 !important;
    background: #fff !important;
    border: 2px solid #B43A91 !important; 
    border-radius: 6px !important;
    outline: none !important;
    transition: all 0.3s ease-in-out !important;
    box-shadow: 2px 2px 5px rgba(0, 0, 0, 0.1) !important;
}

.dt-search .dt-input:focus {
    border-color: #B43A91 !important;
    box-shadow: 0 0 5px rgba(180, 58, 145, 0.5) !important;
}

.dt-search .dt-input::placeholder {
    color: #999 !important;
    font-style: italic !important;
}



@media (max-width: 1209px){
    .dashboard-mt-top-mobile{
        margin-top: 10px;
    }
    .dashboard-remove-mb-bottom {
    margin-bottom: 0px !important;
    gap: 10px;
}
.news-event-gap{
    gap: 10px;
}
    .d-flex.flex-wrap.fw-bold.fs-6.mb-0.pe-2 {
    display: flex;
    justify-content: center;
    text-align: center;
}
.d-flex.flex-wrap.fw-bold.fs-6.mb-0.pe-2 a{
    margin: 5px !important;
}
#myTable td.align-middle.text-center a {
    margin: 5px;
}
    .main-content .container-fluid .row .col-6
{
    width: 100%;
}
.row {
    display: flex;
    flex-direction: column;
}
.row .col-4{
    width: 100%;
}
	.fc-header-toolbar.fc-toolbar.fc-toolbar-ltr {
    display: flex;
    flex-direction: column;
}
.fc-daygrid-body.fc-daygrid-body-balanced {
    width: 100% !important;
}
table.fc-col-header {
    width: 100% !important;
}
table.fc-scrollgrid-sync-table {
    width: 100% !important;
}
body{
    line-height: 1em;
}
form#filterForm {
    display: flex;
    flex-direction: column;
}
form#filterForm label{
    margin: 5px 0px;
}
.row .col-lg-6, .row .col-lg-3, .row .col-8 {
    width: 100%;
}
.row .d-flex.justify-content-between.align-items-start.flex-wrap.mb-2 {
    text-align: center;
    width: 100%;
    display: flex;
    flex-direction: column;
    align-content: center;
    margin-top: 20px;
}
.row .d-flex.flex-column {
    gap: 10px;
}
.row .d-flex.align-items-center.mb-2 {
    display: flex;
    justify-content: center;
}
.row .avatar.position-relative.shadow-sm {
    margin: auto;
    margin-top: 21px;
}
}
/*.fc .fc-daygrid-day.fc-day-today{*/
/*    background-color: #E3642B;*/
/*}*/
/*.fc .fc-daygrid-day.fc-day-today .fc-daygrid-day-top{*/
/*    color: #fff;*/
/*}*/