/* Hide scrollbar for Chrome, Safari and Opera */
body::-webkit-scrollbar {
    display: none;
}

.sub-btn{
	padding: 10px 40px;
	float: right;
}

.save-btn{
	padding: 10px 10px;
	float: right;
}

.export-btn{
	padding: 6px 30px;
	float: right;
}

.line-btn{
	padding: 10px 40px;
	float: right;
}

.plus_circle{
    background-color: #0d6efd;
    height: 35px;
    width: 35px;
    border-radius: 50%;
    color: #fff;
    font-size: 20px;
    display: flex;
    align-items: center;
    justify-content: center;
}

.app-page-title {
    padding: 10px 30px;
    margin: -34px -30px 0px;
    position: relative;
}

.clr_red{
    color: red;
}
.clr_red:hover{
    color: red;
}
.clr_grey{
    color: grey;
}
.clr_grey:hover{
    color: grey;
}
a{
	text-decoration: none;
}

ul#menu li a.active,
ul#menu li a:focus {
	font-weight: bold;
	color: #6c757d;
}
.active {
	font-weight: bold;
	color: #6c757d;
}

.preview-img{
	/* margin-top: -24px; */
	max-width:150px;
}

.preview-container {
	position: relative;
	/* display: inline-block; */
	display: none; /* Hide the container by default */
}

.delete-icon {
	position: absolute;
	top: -15px;
	right: -15px;
	cursor: pointer;
	color: red; /* Set the color of the delete icon to red */
}

 .rating {
	unicode-bidi: bidi-override;
	direction: rtl;
  }
  .rating > span {
	display: inline-block;
	position: relative;
	width: 1.1em;
	font-size: 25px;
  }
  .rating > span:hover:before,
  .rating > span:hover ~ span:before {
	 content: "\2605";
	 position: absolute;
	 color: orange;
	 font-size: 25px;
  }

  table {
	width: 100%;
	border-collapse: collapse;
}

.table-responsive {
	display: inline-block;
	width: 100%;
	overflow-x: auto;
}

.field_form{
    border: none;
    border-bottom: 1px solid #bfb3b3;
    border-radius: 0;
    /* padding: 0; */
    /* color: #bfb3b3; */
}
.field_form:focus {
    outline: none;
    box-shadow: none !important;
}

.table-body {
    flex: 1 1 auto;
    padding: 10px 10px;
}

.view-btn{
	cursor: pointer;
}

.toolbar {
    float:right;
}

div.dataTables_wrapper div.dataTables_filter input {
    margin-left: 0.5em;
    display: inline-block;
    width: auto;
}

.green_circle{
    background-color: green;
    height: 20px;
    width: 20px;
    border-radius: 50%;
	display: flex ;
	justify-content: center;
	align-items:center;
}
.red_circle{
    background-color: red;
    height: 20px;
    width: 20px;
    border-radius: 50%;
	display: flex ;
	justify-content: center;
	align-items:center;
}
.yellow_circle{
    background-color: orange;
    height: 20px;
    width: 20px;
    border-radius: 50%;
	display: flex ;
	justify-content: center;
	align-items:center;
}

.namenumberwidth{
	width: 990px;
	margin-left: 3px;
}

.swal-button {
    padding: 0.5rem 1rem !important;
    font-size: 0.875rem !important;
  }

/* .closed-sidebar.fixed-sidebar .app-main__outer {
    padding-left: 0px;
} */

/* .select2-container--bootstrap4 .select2-selection--multiple .select2-selection__choice {
    display: inline-table;
    color: #fff;
    padding: 5px 0.35em 5px 0.35em;
    margin-left: calc(calc(2.25rem + 2px)/5 - 1px);
    margin-top: 0;
    border-radius: 0.2rem;
    background-color: #0d6efd;
    border: 1px solid #0d6efd;
    cursor: default;
    vertical-align: top;
    text-align: center;
    overflow: hidden;
    max-width: 100%;
}

.select2-container--bootstrap4 .select2-results__option[aria-selected=true] {
    background-color: #0d6efd;
    color: #fff;
} */

/* ================================================== LIght Box -============================================================ */



/* ================================================= Light box End ========================================================== */



  /* ==================================================== Media Query ============================================================ */

@media (max-width: 767px) {
	
	.sub-btn{
		padding: 5px 30px;
		float: right;
	}

	.save-btn{
		padding: 10px 10px;
		float: right;
	}
	
	.line-btn{
		padding: 5px 30px;
		float: right;
	}

	.app-page-title {
		padding: 10px 30px;
		margin: -10px -30px 0px;
		position: relative;
	}

	/* .table-responsive {
		display: table;
		display: inline-block;
		overflow-x: auto;
	} */

	.rating {
		unicode-bidi: bidi-override;
		direction: rtl;
	}
	.rating > span {
	display: inline-block;
	position: relative;
	width: 1.1em;
	font-size: 20px;
	}
	.rating > span:hover:before,
	.rating > span:hover ~ span:before {
		content: "\2605";
		position: absolute;
		color: orange;
		font-size: 20px;
	}
	
	.col-sm-1 {
		position: relative;
		width: 100%;
		/* margin-left:0px; */
		padding-right: 0px;
		padding-left: 0px;
	}
	.col-sm-11 {
		position: relative;
		width: 1000px;
		padding-right: 0px;
		padding-left: 0px;
	}

	.col-sm-2,.col-sm {
		position: relative;
		width: 50%;
		padding-right: 0px;
		padding-left: 0px;
	}

}