/*================================================================================
	Item Name: Vuexy - Vuejs, HTML & Laravel Admin Dashboard Template
	Version: 2.0
	Author: PIXINVENT
	Author URL: http://www.themeforest.net/user/pixinvent
================================================================================

NOTE:
------
PLACE HERE YOUR OWN SCSS CODES AND IF NEEDED, OVERRIDE THE STYLES FROM THE OTHER STYLESHEETS.
WE WILL RELEASE FUTURE UPDATES SO IN ORDER TO NOT OVERWRITE YOUR STYLES IT'S BETTER LIKE THIS.  */
.btn-spacing a {
	float: left;
	margin-right: 10px;
}

label.error{
	color: red !important;
}

.attendance-table > :not(caption) > * > * {
    padding: 0.60rem 0.2rem;
	font-size: 12px !important;	
	text-align: center;
	border-left-width: 1px;
}

/* Override Bootstrap tooltip styles */
.tooltip-inner {
    background-color: #fff !important; /* White background */
    color: #fff !important; /* Dark text */
    border: 1px solid #ddd; /* Light gray border */
    padding: 10px; /* Add some padding for readability */
    border-radius: 5px; /* Rounded corners */
    box-shadow: 0px 4px 8px rgba(0, 0, 0, 0.1); /* Subtle shadow */
}
.tooltip.bs-tooltip-top .tooltip-arrow::before,
.tooltip.bs-tooltip-bottom .tooltip-arrow::before,
.tooltip.bs-tooltip-left .tooltip-arrow::before,
.tooltip.bs-tooltip-right .tooltip-arrow::before {
    border-color: #fff !important; /* Arrow same as tooltip background */
}
.tasks-table { margin-top: 5px;}
.tasks-table thead th{font-size: 12px;}
.tasks-table tbody{font-size: 12px;}
.tasks-table > :not(caption) > * > * {padding: 8px 5px !important;}


.form-control[readonly]{
	background-color: unset;
}

/* Hide the Select2 dropdown arrow */
.select2-container--default .select2-selection--single .select2-selection__arrow {
    display: none; /* Hide the default arrow icon */
}