
@font-face { 
	font-family: 'Sfprod'; 
	src: url("../font/SFPRODISPLAYREGULAR.OTF"); 
	font-weight: normal;
    font-style: normal;
}

@font-face { 
	font-family: 'Sfprodbold'; 
	src: url("../font/SFPRODISPLAYBOLD.OTF"); 
	font-weight: bold;
    font-style: normal;
}

html,
body,
.wrapper {
  height: 100%;
    position: static;
    overflow: none!important;

}

body {
    font-family: Sfprod!important;
    background: #fff;
    font-size: 16px;
     
      overflow-x: hidden;
    overflow-y: auto;
}

h1, h2, h3, h4, h5, h6, .h1, .h2, .h3, .h4, .h5, .h6 {
  font-family: Sfprodbold!important;
}

.skin-blue .main-header .navbar {
    background-color: #ffffff!important;
}
.skin-blue .main-header .navbar .sidebar-toggle {
    color: #000!important;
}

.skin-blue .main-header .navbar .nav>li>a {
    color: #1b1919!important;
}


.skin-blue .main-header .navbar .nav>li>a:hover {
background: rgb(204 204 204 / 10%);
    color: #221f1f;
}

.skin-blue .main-header .logo {
    background-color: #fff!important;
    color: #fff;
    border-bottom: 0 solid transparent;
}

.skin-blue .sidebar-menu>li.header {
    color: #47484a!important;
    background: #ffffff!important;
}

.skin-blue .sidebar-menu>li>.treeview-menu {
    margin: 0 1px;
    background: #ffffff!important;
}

.skin-blue .sidebar a {
    color: #050505!important;
}

.skin-blue .sidebar-menu .treeview-menu>li>a {
   color: #0f1010!important;
    font-size: 14px;
}

.skin-blue .sidebar-menu .treeview-menu>li.active>a, 
.skin-blue .sidebar-menu .treeview-menu>li>a:hover {
    color: #181616;
    font-size: 14px;
}

.sidebar-menu .treeview-menu > li {
    margin: 0;
    border-bottom: 1px dotted #ccc!important;
    padding: 3px!important;
}

.skin-blue .sidebar-menu>li:last-child:hover>a {
	
}

.sidebar-menu > li:last-child i{
	color:#fff;
}
 
.sidebar-menu > li:last-child {
  background: #ed1414;
	color:#fff;
}

.sidebar-menu > li:first-child {
	text-align:center;
	background: #4367b0!important;
	color: #fff!important;
}


.sidebar-menu > li:last-child a
{
 	color:#fff!important;
}

.sidebar-menu > li:last-child > :hover a
{
  background: #ed1414;
	color:#fff;
}

.skin-blue .main-header li.user-header {
    background-color: #4367b0;
}

.sidebar-menu > li:last-child:hover {
  background: #ed1414;
}
.sidebar-menu > li.last-li:hover {
  background: #ed1414;
}

.sidebar-menu > li {
    position: relative;
    margin: 0;
    padding: 0;
    border-bottom: 1px dotted #ababab!important;
}


.skin-blue .sidebar-menu >li>.treeview-menu.menu-open{
	    background: #f2f2f2;
}

.sidebar-menu .treeview-menu {
    display: none;
    list-style: none;
    padding: 0;
    margin: 0;
    padding-left: 0px!important;
}

.treeview-menu .active {
    background: #e2e5ea!important;
    margin-left: 0px;
}


.skin-blue .sidebar-menu>li:hover>a,
.skin-blue .sidebar-menu>li.active>a,
.skin-blue .sidebar-menu>li.menu-open>a {
    color: #fff!important;
    background:#4068b0!important;
}


.skin-blue .wrapper, 
.skin-blue .main-sidebar, 
.skin-blue .left-side {
    background-color: #ffffff!important;
}


#block-formsstepsaddcourseprogressbar_2 ol {
	list-style: none;
    /* float: left; */
    background: #dcdced;
    display: inline-flex;
    /* padding: 10px; */
}
#block-formsstepsaddcourseprogressbar_2 li {
	    padding: 10px;
}


#block-formsstepsaddcourseprogressbar_2 li.active {
	background:#ccc;
}

#block-formsstepsaddcourseprogressbar_2 li a{
	 color:#000;
	 font-weight: bold;
    font-size: 12px;
    text-transform: uppercase;
}

#logo img {
  /*max-height: 40px;
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%,-50%);*/
}

#logo .logo-lg,
#logo .logo-mini {
  position: relative;
  height: 50px;
}

.login-box .logo-lg > img {
  max-width: 50%;
}

@media (max-width: 767px) {
	#views-exposed-form-batch-search-page-1 .form--inline .form-item {
    display: inline-block;
    margin-right: 0.5em;
    width: 180px;
}
.main-header .navbar-custom-menu {
    float: right;
    position: absolute;
    top: 0;
    right: 0;
}
#views-exposed-form-batch-search-page-1 #edit-submit-batch-search, #views-exposed-form-batch-search-page-1 #edit-submit-batch-search--2 {
    width: 90px!important;
} 
	.nav-tabs-custom .col-xs-6 {
    width: 48%;
    margin: 0 3px!important;
    padding: 0;
}
.nav-tabs-custom > .tab-content {
    padding: 0px!important;
}
.nav-tabs-custom {
    min-height: auto!important;
}
.main-header #logo{display:none;}
  body.skin-black #logo,
  body.skin-black #logo:hover,
  body.skin-black-light #logo,
  body.skin-black-light #logo:hover {
    background-color: #fff;
    border-bottom: 1px solid #eee;
  }
#views-exposed-form-payment-history-crm-page-1
{
	padding-top:60px;
}
}

.login-page-header.logo .logo-lg {
  display: block;
}

.login-page-header.logo .logo-mini {
  display: none;
}

body .label {
  color: #333;
  font-size: 80%;
}

a.tabledrag-handle .handle {
  width: 24px;
  height: 24px;
}

.box>.box-header>h4 {
  margin: 0;
}

@media (max-width: 991px) {
  .content-header>h1.page-title {
    margin-top: 20px;
  }
}


.dialog-off-canvas-main-canvas {
  position: relative;
  height: 100%;
}

.main-header {
  z-index: 9999 !important;
	--bs-bg-opacity: 1;
    background-color: rgba(var(--bs-white-rgb), var(--bs-bg-opacity)) !important;
    box-shadow: 0 0.15rem 1.75rem 0 rgba(33, 40, 50, 0.15) !important;
    top: 2px;
}
.vertical-tabs {
	display:none;
}
.page-title{
	margin-bottom: 0;
	padding: .75rem 1.25rem;
	border-bottom: 0 solid rgba(0, 0, 0, .125);
	background-color: transparent;
	/* border-bottom: 1px solid #dce4ec !important; */
	font-size: 30px;
}
/***** Custom CSS ******/
.due-payment .bg-red{
  padding: 7px;
}
.small-box .inner {
  padding: 10px;
}
.small-box a { 
color:#fff;
}
/*
#node-course-details-add-course-step-1-form .field--widget-string-textfield, #node-course-details-add-course-step-1-form .field--type-float, #node-course-details-add-course-step-1-form .field--type-integer, #node-course-details-add-course-step-1-form .field--type-list-string{
	width:40%;
	float:left;
	margin-right:20px;
}*/
.tabledrag-toggle-weight-wrapper {
  display: none;
}
#node-course-details-add-course-step-1-form #edit-submit {
  width: 81%;
  margin-left: 15px;
  height: 40px;
  font-size: 20px;
}
.skin-black-light .sidebar-menu > li:hover > a, .skin-black-light .sidebar-menu > li.active > a {
  color: #fff;
  background: #3667b0;
}
.treeview-menu .active{
	background: #3667b0;
}
.skin-black-light .sidebar-menu .treeview-menu > li.active > a, .skin-black-light .sidebar-menu .treeview-menu > li > a:hover {
  color: #fff!important;
  background: #4367B0;
}
.skin-black-light .sidebar-menu > li:hover > a, .skin-black-light .sidebar-menu > li.active > a {
  color: #fff!important;
  background: #4367B0!important;
}
.field--type-file summary {
  background-color: #3667b0;
  color: #fff;
  padding: 10px;
  font-weight: bold;
}
.nav-tabs-custom {
	min-height: 600px;
}
.path-frontpage .content-wrapper {
		background-image: url(/sites/default/files/home-bg.jpg);
    width: 100%;
    height: 100%;
    background-color: #ffffff;
    background-position: center;
    background-repeat: no-repeat;
     background-size: cover;
}

.login-box, .register-box {
    width: 360px;
    margin: 7% auto;
    margin-top: 37px!important;
}

.path-frontpage .nav-tabs-custom {
  min-height: auto;
}
.login-box, .register-box {
  width: 360px;
  margin: 0% auto;
}
.path-frontpage .dialog-off-canvas-main-canvas {
  overflow: hidden;
}
.path-frontpage .content-wrapper .content {
  background: rgba(0, 0, 0, 0.45);
  height: 100%;
}
.small-box a:hover, .small-box a:active, .small-box a:focus {
  outline: none;
  text-decoration: none;
  color: #fff;
}
.student-sec .page-title {
	margin-bottom:20px;
}
#create-user-form {
  background: #ece5e5;
  padding: 20px;
  width: 50%;
}

.nav-tabs-custom > .tab-content {
  border-top: 1px solid #fff;
}
#user-form .image-style-thumbnail {
  border-radius: 65px;
}
#user-form #edit-submit {
  width: 20%;
  margin-left: 35%;
}
#user-form .form-col2-section {
  border-left: 1px solid #ecf0f5;
  border-right: 1px solid #ecf0f5;
}
#node-batch-details-batch-step-2-form .form-item .description {
  display: none;
}
.login-logo, .register-logo {
  margin-bottom: 0px!important;
  background: #fff;
  padding-top: 20px;
}

#node-batch-details-batch-step-2-form .field--name-field-venue-details {
	width:25%;
	float:left;
	margin-right: 10px;
}
#node-batch-details-batch-step-2-form .field--name-field-document-files {
	width:30%;
	float:left;
	margin-right: 10px;
}
#node-batch-details-batch-step-2-form .field--name-field-audio-files {
	width:30%;
	float:left;
	margin-right: 10px;
}
#node-batch-details-batch-step-2-form .field--name-field-youtube-video-url{
	width:30%;
	float:left;
}
#edit-field-add-class-details-batch-wi-0-subform-field-youtube-video-url-wrapper .js-form-item {
  border: 1px solid #d1d1d1;
}
#edit-field-add-class-details-batch-wi-0-subform-field-youtube-video-url-wrapper #edit-field-add-class-details-batch-wi-0-subform-field-youtube-video-url-add-more {
  margin-left: 10px;
  margin-bottom: 10px;
}
#node-batch-details-batch-step-2-form .field--name-field-venue-details .js-form-type-textarea {
  margin-top: 7px;
}
#node-course-details-course-step-2-form #edit-title-wrapper, #node-course-details-course-step-2-form #edit-field-total-no-of-class-wrapper  {
  width: 20%;
  float: left;
  margin-right: 20px; 
}
#node-course-details-course-step-2-form #edit-actions {
  width: 100%;
  float: left;
  
}
#node-batch-details-batch-step-form #edit-actions{
	width:100%;
	float:left;
}
.path-add-course .nav-tabs-custom, .path-add-batch .nav-tabs-custom{
	display: inline-block;
}
.user-form .description {
	display:none;
}
#user-form #edit-delete {
	display:none;
}
.view-student-list img {
  width: 100%;
  max-width: 45px;
  height: auto;
  border-radius: 30px;
}
.assign-button {
  margin-top: 39px;
}
.small-box h3 {
    font-size: 22px!important;
}
.my-class-detail .ui-widget.ui-widget-content {
	width: 95%!important;
	left: 20px!important;
	top: 40%!important;
}
.my-class-detail .ui-dialog-title{
	display:none!important;
}
.my-class-detail .ui-dialog .ui-dialog-titlebar {
    padding: 1em 5em;
}
.views-element-container .view  table caption {
  background: #f39c12;
  padding-left: 10px;
  color: #fff;
}
.widget-user-image .img-circle {
  border-radius: 50%;
  height: 60px;
  padding: 5px;
}
.view-more-top {
  float: right;
}
.view-more-top a {
    color: #fff;
}
.view-more-top a:hover, .view-more-top a:active, .view-more-top a:focus {
  color: #ecf1f7;
}
.Blink {
  animation: blinker 1.5s cubic-bezier(.5, 0, 1, 1) infinite alternate;  
}
@keyframes blinker {  
  from { opacity: 1; }
  to { opacity: 0; }
}


.page-user-login .login-box #user-login-form a.re-pass{
	float:right;
}

.reset-your-password .login-box {
	width: 30%!important;
    margin-left: auto!important;
}

.login-box, .register-box {
  width: 300px!important;
  margin-left: auto!important; 
}
.invoice {
  margin: 10px 15px!important;
}
.user-register-form #edit-actions {
    float: left;
    margin-left: 40%;
}
.user-register-form {
    display: inline-table;
}
#term-condition-form input[type="checkbox"] {
	width: 40px;
	height: 30px;
}
#term-condition-form #edit-submit {
  margin: 0px;
}
.view-all-batch-students .views-field-nothing, .view-my-students .views-field-nothing {
  min-width: 150px;
}
.views-exposed-form {
	background: #d7e1f3;
	padding: 10px;
}
td .class-button {
  min-width: 190px;
}
/**** Start CSS - comment section ****/
.direct-chat-msg {
	margin-bottom: 10px;
	border-bottom: 1px solid #cdcdcd;
	padding-top: 10px;
	padding-bottom: 5px;
}
.student .direct-chat-img {
  float: right;
}
.direct-chat-warning .student > .direct-chat-text {
	background-color: #ffc107;
	border-color: #ffc107;
	color: #fff;
	font-size: 16px;
	padding: 8px;
}

.direct-chat-warning .student > .direct-chat-text::after, .direct-chat-warning .student > .direct-chat-text::before {
    border-left-color: #ffc107;
}
.student .direct-chat-text::after, .student .direct-chat-text::before {
    border-left-color: #d2d6de;
    border-right-color: transparent;
    left: 100%;
    right: auto;
}
.student .direct-chat-text {
  margin-left: 0;
  margin-right: 50px;
}

.card {
  /* box-shadow: 0 0 1px rgba(0,0,0,.125),0 1px 3px rgba(0,0,0,.2); */
  margin-bottom: 1rem;
}
.card {
  position: relative;
  display: -ms-flexbox;
  /* display: flex; */
  -ms-flex-direction: column;
  flex-direction: column;
  min-width: 0;
  word-wrap: break-word;
  /* background-color: #fff; */
  /* background-clip: border-box; */
  /* border: 0 solid rgba(0,0,0,.125); */
  /* border-radius: .25rem; */
}
.card-footer {
  padding: .75rem 1.25rem;
  background-color: rgba(0,0,0,.03);
  border-top: 0 solid rgba(0,0,0,.125);
}
.msg-box {
  width: 79%;
  float: left;
}
.msg-box #edit-message {
  height: 40px;
}
.msg-send {
	width: 10%;
	float: left;
	margin-top: 14px;
}
.overdue-aprv-form .msg-send{
	margin-top: 39px;
}
.msg-send  input {
  border-radius: 0 3px 3px 0;
}
.ui-widget.ui-widget-content {
  /* width: 440px !important; */
}

.margin-top-40 {
    margin-top: 39px;
}
#assign-crmfilter-form .form-item, #student-batchlist-form .form-item-crmlist, #student-batchlist-form .form-item-company {
    width: 200px;
    float: left;
    margin-right: 20px;
}
#assign-crmfilter-form .form-item-batch{
	width: 250px!important;
}
#assign-crmfilter-form .form-item-company, #assign-crmfilter-form .form-item-phone, #assign-crmfilter-form .form-item-participant{
	width: 170px;
}

.custom-search #views-exposed-form-batch-search-page-1 {
    float: right;
}
#views-exposed-form-batch-search-page-1 .form--inline .form-actions {
     display: inline;
}


#views-exposed-form-batch-search-page-1  .form--inline .form-item {
    display: inline-block;
    margin-right: 0.5em;
}

#views-exposed-form-batch-search-page-1 #edit-title, #views-exposed-form-batch-search-page-1 #edit-title--2 {
  height: 45px;
  font-size: 20px;
}
#views-exposed-form-batch-search-page-1  #edit-submit-batch-search, #views-exposed-form-batch-search-page-1 #edit-submit-batch-search--2 {
    height: 45px;
    width: 135px;
    margin-top: 3px;
}
.custom-search {
       width: 78%;
    display: inline-block;
}
.main-sidebar, .left-side {
  padding-top: 65px!important;
}
.main-header #logo {
  height: auto;
}
.views-field-field-adjust-shift-refund {
  width: 90px;
}
.views-field-field-active-status {
  width: 20px;
}
.direct-chat-msg .student{
	background: #f39c12;
	color: #fff;
}
/**** End CSS - comment section ****/
.card-body {
  -ms-flex: 1 1 auto;
  flex: 1 1 auto;
  min-height: 1px;
  padding: 1.25rem;
}
/*
#node-batch-details-batch-step-2-form  #edit-title-wrapper, #node-batch-details-batch-step-2-form #edit-field-course-wrapper, #node-batch-details-batch-step-2-form #edit-field-end-date-wrapper, #node-batch-details-batch-step-2-form #edit-field-start-date-wrapper, #node-batch-details-batch-step-2-form #edit-field-running-week-day-names-wrapper {
	width: 20%;
	float: left;
}
*/


#views-exposed-form-payment-history-crm-page-1 .form--inline .form-actions {
    display: inline-block!important;
}

#views-exposed-form-payment-history-crm-page-1 .bef-exposed-form .form--inline > .form-item {
    display: inline-block!important;
}

table tr td {
	    font-size: 13px;
    font-weight: 500;
}

 .bef-exposed-form .form--inline > .form-item {
    display: inline-block!important;
		float:revert;
}

.content {
    min-height: 250px;
    padding: 1px;
    margin-right: auto;
    margin-left: auto;
    padding-left: 15px;
    padding-right: 15px;
}
table thead tr {
    background: #fff;
    color: #4068b0;
    font-weight: 700;
    font-size: 15px;
}
table th {
    font-weight: 600!important;
}

.table-bordered > thead > tr > th, 
.table-bordered > thead > tr > td {
    border-bottom-width: 2px;
    font-weight: bold;
}

.view-payment-history-crm .view-header .header-total-add {
    position: absolute;
    right: 5px;
    margin-top: 48px;
}
.view-payment-history-crm .view-header .header-total-text {
    float: right;
    background: #3867c1;
    padding: 10px;
    border-radius: 0px;
    color: #fff;
}
.btn-primary {
   /*  background-color: #3867c1!important;
    border-color: #3867c1!important; */
}
.form--inline .form-actions {
    clear: none;
    margin-top: 39px;
}
.page-drupal_help-dashboard_student .bg-aqua {
    background-color: #4068b0 !important;
}

.widget-user-2 .widget-user-desc {
   
		color:#fff;
}

.content .small-box.bg-blue .fa-credit-card:before,
.content .small-box.bg-green .fa.fa-edit:before,
.content .small-box.bg-red .fa-power-off:before,
.content .small-box.bg-aqua .fa-book:before {
     color: #fff;
}

 .widget-title-2 .widget-user-header {
       /* margin-left: 0px; */
    margin-top: 5px;
    /* margin-bottom: 5px; */
    /* font-size: 25px; */
    /* font-weight: 300; */
    color: #4068b0;
    padding: 12px;
    /* display: inline-table; */
    width: 100%;
}



.widget-title-2 .more{
		float: right;
    display: inline-block;
    margin-right: 4px;
    margin-top: -44px;
}

#views-exposed-form-batch-student-list-page-1 #edit-actions{
     margin-top: 125px;
}

.page-olsys-classbatchlist .nav > li > a:hover, 
.page-olsys-classbatchlist .nav > li > a:active, 
.page-olsys-classbatchlist .nav > li > a:focus {
    color: #444;
    background: #a9a2a2;
}


.page-barcodeattendance-barcode svg{
 /* margin-left:120px; */
} 

.page-barcodeattendance-barcode .title-week {
 display:none;
}

.page-barcodeattendance-barcode .tab-content>.active {
    display: block;
    width: 45%;
    margin-left:120px;
    text-align:center;
}

 
@media (max-width: 767px) { 
 .page-barcodeattendance-barcode .tab-content>.active {
    display: block;
    width: 100%;
    margin-left: 0px;
    text-align: center;
    padding: 10px;
 }
  
 .page-barcodeattendance-barcode svg {
       width: 350px;
  }
}

.page-view-tickets-page_3 .header-total-add,
.page-view-tickets-page_1 .header-total-add{
     height: 38px;
    float: right;
    padding: 10px;
}

 
/* 
i.fa {
    color: #1a50b1!important;
}
 
.active i.fa {
    color: #fff!important;
} */
.fa-angle-right:before {
    content: "\f105";
    color: #000;
}

.btn-warning {
    background-color: #3d9537!important;
    border-color: #3d9537!important;
    color:#fff!important;
}

.node-add-student-batch-add-batch-students-form .col-md-6 {
  width: 49%;
}

.page-drupal_help-dashboard_student .widget-title-2 .widget-user-header {
    /* margin-left: 0px; */
    margin-top: 0px;
    /* margin-bottom: 5px; */
    /* font-size: 25px; */
    /* font-weight: 300; */
    color: #4068b0;
    padding: 0px;
    /* display: inline-table; */
    width: 100%;
}

.page-drupal_help-dashboard_student #modal-st-up .modal {
    position: fixed;
    top: 49px;
}

#modal-st-up .modal-content {
      width: auto;
    top: 113px;
}

.page-drupal_help-dashboard_student #modal-st-up .modal-content.btn.btn-warning {
    background-color: #ffffff !important;
    border-color: #94b1e3 !important;
    color: #003078 !important;
    border-radius: 20px !important;
}


.offline-attendance-form .nav-tabs-custom  h3 {
    font-size: 21px;
    margin-top: 0px;
}

.offline-attendance-form .nav-tabs-custom .main-header.header-2{
 display:none;
}

.offline-attendance-form .nav-tabs-custom hr {
    margin-top: 20px;
    margin-bottom: 20px;
    border: 1px solid #ccc;
    border-top: 1px solid #eee;
 
}

.offline-attendance-form .nav-tabs-custom{
     padding: 10px;
    box-sizing: border-box;
    box-shadow: 0px 2px 7px 0px rgb(8 78 161 / 45%);
    border-radius: 10px;
    /* height: 153px; */
    overflow: hidden;
    background: #fff;
    transition: all .3s cubic-bezier(0,0,.5,1);
    
    background-color: #fff;
    border-radius: 10px;
    border-top: 5px solid #4367b0;
    display: flex;
    flex-direction: column;
    
}


.offline-attendance-form .nav-tabs-custom form input, 
.offline-attendance-form .nav-tabs-custom form select {
    background: #fff;
    border: 1px solid #bfbfbf;
    border-radius: 36px;
    color: #000;
    font-size: 16px;
    font-weight: 400;
    letter-spacing: .16px;
    margin-top: 5px;
    padding: 13px 24px;
    width: 100%;
}

.view-tech-batch-student-list .view-header{
 float: right;
    margin-top: 55px;
    display: inline-table;
    padding: 0px;
}

.add-user.page-user-admin_create .shwpd.pass-close{
 display:none;
}

/* Force the form wrapper to break out of standard narrow admin constraints */
.olsys-full-width-wrapper {
  width: 100%;
  max-width: 100%;
  background: #ffffff;
  border: 1px solid #e2e2e2;
  border-radius: 8px;
  box-shadow: 0 4px 12px rgba(0,0,0,0.05);
  padding: 30px;
  box-sizing: border-box;
  margin-bottom: 30px;
}

.olsys-upload-header {
  border-bottom: 2px solid #f0f0f0;
  padding-bottom: 15px;
  margin-bottom: 25px;
}

.olsys-upload-controls {
  display: flex;
  align-items: flex-end;
  gap: 20px;
  margin-bottom: 20px;
  flex-wrap: wrap;
}

/* Style the details block for the table */
.olsys-today-records-section {
  margin-top: 40px;
  border-top: 2px dashed #ccc;
  padding-top: 20px;
}

.olsys-column-toggles {
  background: #f4f7fa;
  padding: 15px;
  border-radius: 6px;
  margin-bottom: 20px;
}

.page-payment_manager-mapped_history_list fieldset #mapped-history-filter-form{
    background: #f5f5f5;
    display: inline-grid;
    margin: 0px;
}

.page-payment_manager-mapped_history_list #edit-display-columns-wrapper {
    overflow-x: auto;
    white-space: nowrap;
    padding: 10px;
    background: #e5e2e2;
    margin-bottom: 33px;
    display: inline-block;
    width: 1196px;
}

.page-payment_manager-mapped_history_list  .nav-tabs-custom{
  display: inline-grid!important;
}

#edit-filters  {
    margin: 0px;
    padding-right: 0px;
    padding-left: 0px;
    margin-bottom: 10px;
}
#edit-today-uploads-wrapper  {
       margin: 0px;
    padding-right: 0px;
    padding-left: 0px;
    margin-top: 51px;
    margin-bottom: 10px;
}
#edit-filters summary{
    background: #acc6f6;
    padding: 7px;
    margin: 0px;
    font-size: 16px;
    font-weight: bold;
}
#edit-today-uploads-wrapper summary{
    background: #acc6f6;
    padding: 7px;
    margin: 0px;
    font-size: 16px;
    font-weight: bold;
}

.payment-records .nav-tabs-custom ,
.upload-payments-csv .nav-tabs-custom ,
.mapped-students-history .nav-tabs-custom {
  display: inline-block!important;
}

.mapped-students-history .history-table-wrapper {
    padding-right: 0px;
    padding-left: 0px;
}
.mapped-students-history .table-responsive{
    padding-right: 0px;
    padding-left: 0px;
}

#today-uploads-table-wrapper table thead tr {
  background: #a0a0a0!important;
  color: #fff;
}

.upload-payments-csv .table-responsive thead tr ,
.payment-records .table-responsive thead tr ,
.mapped-students-history .table-responsive thead tr {
    background: #969696 !important;
    color: #fff;
}

.upload-payments-csv .js-form-item-files-csv-file {
    background: #e5e5e5;
    padding: 25px;
}
#payment-upload-form .description, 
#payment-upload-form #edit-csv-file--description {
    font-size: 15px;
    padding: 10px;
} 

#edit-today-uploads-wrapper fieldset{
    padding: 10px; 
    margin: 11px;
}

#payment-upload-form{
    background: #e5e5e5;
    padding: 14px;
}

.js-form-item-files-csv-file {
        background: #e5e5e5;
    padding: 12px;
}

#payment-upload-form .description,
#payment-upload-form #edit-csv-file--description {
    font-size: 14px;
    font-weight: bold;
    padding-top: 10px;
    color: #d62727;
}

.page-payment_manager-upload .nav-tabs-custom {
    margin-bottom: 20px;
    background: #fff;
    box-shadow: 0 1px 1px rgba(0, 0, 0, 0.1);
    border-radius: 3px;
    display: inline-block!important;
}

/* Example: Add some styling to the horizontal scrolling checkboxes */
#edit-display-columns-wrapper {
  margin-bottom: 20px;
  padding-bottom: 10px;
  border-bottom: 1px solid #ddd;
}

#edit-display-columns-wrapper .form-checkboxes {
  display: flex;
  flex-wrap: nowrap;
  gap: 15px;
}

#edit-display-columns-wrapper .form-item {
  margin-top: 0;
  margin-bottom: 0;
  white-space: nowrap;
}

/* Example: Styling the table wrapper */
#history-table-wrapper {
  margin-top: 20px;
  border: 1px solid #ccc;
  border-radius: 4px;
}

#history-table-wrapper table {
  margin-bottom: 0;
}


  .history-filter-box {
    background: #f8f9fa;
    padding: 20px;
    border-radius: 8px;
    border: 1px solid #e9ecef;
    box-shadow: 0 2px 4px rgba(0,0,0,0.02);
    margin-bottom: 25px;
  }
  .history-filter-box summary {
    font-size: 1.15em;
    font-weight: 600;
    color: #333;
    margin-bottom: 10px;
  }
  #mapped-history-filter-form .form-actions {
    display: flex;
    gap: 12px;
    margin-top: 15px;
    padding-top: 15px;
    border-top: 1px solid #dee2e6;
    width: 100%;
  }
  .btn-filter-custom {
    background-color: #0d6efd !important;
    color: #fff !important;
    border: none !important;
    padding: 8px 24px !important;
    border-radius: 5px !important;
    font-weight: 600 !important;
    box-shadow: 0 2px 4px rgba(13, 110, 253, 0.2);
    transition: all 0.2s ease-in-out;
  }
  .btn-filter-custom:hover {
    background-color: #0b5ed7 !important;
    transform: translateY(-1px);
  }
  .btn-clear-custom {
    background-color: #6c757d !important;
    color: #fff !important;
    border: none !important;
    padding: 8px 24px !important;
    border-radius: 5px !important;
    font-weight: 600 !important;
    box-shadow: 0 2px 4px rgba(108, 117, 125, 0.2);
    transition: all 0.2s ease-in-out;
  }
  .btn-clear-custom:hover {
    background-color: #5c636a !important;
    transform: translateY(-1px);
  }
  .btn-export-custom {
    background-color: #198754 !important;
    color: #fff !important;
    border: none !important;
    padding: 8px 24px !important;
    border-radius: 5px !important;
    font-weight: 600 !important;
    box-shadow: 0 2px 4px rgba(25, 135, 84, 0.2);
    transition: all 0.2s ease-in-out;
  }
  .btn-export-custom:hover {
    background-color: #157347 !important;
    transform: translateY(-1px);
  }