input::-webkit-outer-spin-button,
input::-webkit-inner-spin-button {
	-webkit-appearance: none;
	margin: 0;
}

.dataTables_filter {
	display: none;
}

/* Firefox */
input[type="number"] {
	-moz-appearance: textfield;
}

.nav-item.bg-white a.nav-link.active {
	color: white !important;
}

/* width */
::-webkit-scrollbar {
	width: 5px;
	height: 5px;
}

/* Track */
::-webkit-scrollbar-track {
	background: #f1f1f1;
}

/* Handle */
::-webkit-scrollbar-thumb {
	background: #888;
	border-radius: 10px;
}

/* Handle on hover */
::-webkit-scrollbar-thumb:hover {
	background: #555;
}

.hover-effect-text:hover {
	box-shadow: 0 0.25rem 1rem rgba(0,0,0,0.1);
}

.tooltip {
	z-index: 99999999;
}

.vh-50 {
	height: 50vh;
}

/*
	Extend bootstrap with grid
*/
.grid {
	display: grid;
	gap: 1rem;
}

/* Default Column Configuration */
.grid-cols-1 {
	grid-template-columns: repeat(1, 1fr);
}
.grid-cols-2 {
	grid-template-columns: repeat(2, 1fr);
}
.grid-cols-3 {
	grid-template-columns: repeat(3, 1fr);
}
.grid-cols-4 {
	grid-template-columns: repeat(4, 1fr);
}
.grid-cols-5 {
	grid-template-columns: repeat(5, 1fr);
}
.grid-cols-6 {
	grid-template-columns: repeat(6, 1fr);
}
.grid-cols-7 {
	grid-template-columns: repeat(7, 1fr);
}
.grid-cols-8 {
	grid-template-columns: repeat(8, 1fr);
}
.grid-cols-9 {
	grid-template-columns: repeat(9, 1fr);
}
.grid-cols-10 {
	grid-template-columns: repeat(10, 1fr);
}
.grid-cols-11 {
	grid-template-columns: repeat(11, 1fr);
}
.grid-cols-12 {
	grid-template-columns: repeat(12, 1fr);
}

.grid-rows-1 {
	grid-template-rows: repeat(1, 1fr);
}
.grid-rows-2 {
	grid-template-rows: repeat(2, 1fr);
}
.grid-rows-3 {
	grid-template-rows: repeat(3, 1fr);
}
.grid-rows-4 {
	grid-template-rows: repeat(4, 1fr);
}
.grid-rows-5 {
	grid-template-rows: repeat(5, 1fr);
}
.grid-rows-6 {
	grid-template-rows: repeat(6, 1fr);
}
.grid-rows-7 {
	grid-template-rows: repeat(7, 1fr);
}
.grid-rows-8 {
	grid-template-rows: repeat(8, 1fr);
}
.grid-rows-9 {
	grid-template-rows: repeat(9, 1fr);
}
.grid-rows-10 {
	grid-template-rows: repeat(10, 1fr);
}
.grid-rows-11 {
	grid-template-rows: repeat(11, 1fr);
}
.grid-rows-12 {
	grid-template-rows: repeat(12, 1fr);
}

.w-max-content {
	width: max-content;
}

/* Small Devices (≥576px) */
@media (min-width: 576px) {
	.grid-sm-cols-1 {
		grid-template-columns: repeat(1, 1fr);
	}
	.grid-sm-cols-2 {
		grid-template-columns: repeat(2, 1fr);
	}
	.grid-sm-cols-3 {
		grid-template-columns: repeat(3, 1fr);
	}
	.grid-sm-cols-4 {
		grid-template-columns: repeat(4, 1fr);
	}
	.grid-sm-cols-5 {
		grid-template-columns: repeat(5, 1fr);
	}
	.grid-sm-cols-6 {
		grid-template-columns: repeat(6, 1fr);
	}
	.grid-sm-cols-7 {
		grid-template-columns: repeat(7, 1fr);
	}
	.grid-sm-cols-8 {
		grid-template-columns: repeat(8, 1fr);
	}
	.grid-sm-cols-9 {
		grid-template-columns: repeat(9, 1fr);
	}
	.grid-sm-cols-10 {
		grid-template-columns: repeat(10, 1fr);
	}
	.grid-sm-cols-11 {
		grid-template-columns: repeat(11, 1fr);
	}
	.grid-sm-cols-12 {
		grid-template-columns: repeat(12, 1fr);
	}
	.grid-sm-rows-1 {
		grid-template-rows: repeat(1, 1fr);
	}
	.grid-sm-rows-2 {
		grid-template-rows: repeat(2, 1fr);
	}
	.grid-sm-rows-3 {
		grid-template-rows: repeat(3, 1fr);
	}
	.grid-sm-rows-4 {
		grid-template-rows: repeat(4, 1fr);
	}
	.grid-sm-rows-5 {
		grid-template-rows: repeat(5, 1fr);
	}
	.grid-sm-rows-6 {
		grid-template-rows: repeat(6, 1fr);
	}
	.grid-sm-rows-7 {
		grid-template-rows: repeat(7, 1fr);
	}
	.grid-sm-rows-8 {
		grid-template-rows: repeat(8, 1fr);
	}
	.grid-sm-rows-9 {
		grid-template-rows: repeat(9, 1fr);
	}
	.grid-sm-rows-10 {
		grid-template-rows: repeat(10, 1fr);
	}
	.grid-sm-rows-11 {
		grid-template-rows: repeat(11, 1fr);
	}
	.grid-sm-rows-12 {
		grid-template-rows: repeat(12, 1fr);
	}
}

/* Medium Devices (≥768px) */
@media (min-width: 768px) {
	.permits-list-height {
		height: 50vh;
	}
	.w-md-auto {
		width: auto;
	}
	.w-md-25 {
		width: 25% !important;
	}
	.w-md-75 {
		width: 75% !important;
	}
	.grid-md-cols-1 {
		grid-template-columns: repeat(1, 1fr);
	}
	.grid-md-cols-2 {
		grid-template-columns: repeat(2, 1fr);
	}
	.grid-md-cols-3 {
		grid-template-columns: repeat(3, 1fr);
	}
	.grid-md-cols-4 {
		grid-template-columns: repeat(4, 1fr);
	}
	.grid-md-cols-5 {
		grid-template-columns: repeat(5, 1fr);
	}
	.grid-md-cols-6 {
		grid-template-columns: repeat(6, 1fr);
	}
	.grid-md-cols-7 {
		grid-template-columns: repeat(7, 1fr);
	}
	.grid-md-cols-8 {
		grid-template-columns: repeat(8, 1fr);
	}
	.grid-md-cols-9 {
		grid-template-columns: repeat(9, 1fr);
	}
	.grid-md-cols-10 {
		grid-template-columns: repeat(10, 1fr);
	}
	.grid-md-cols-11 {
		grid-template-columns: repeat(11, 1fr);
	}
	.grid-md-cols-12 {
		grid-template-columns: repeat(12, 1fr);
	}
	.grid-md-rows-1 {
		grid-template-rows: repeat(1, 1fr);
	}
	.grid-md-rows-2 {
		grid-template-rows: repeat(2, 1fr);
	}
	.grid-md-rows-3 {
		grid-template-rows: repeat(3, 1fr);
	}
	.grid-md-rows-4 {
		grid-template-rows: repeat(4, 1fr);
	}
	.grid-md-rows-5 {
		grid-template-rows: repeat(5, 1fr);
	}
	.grid-md-rows-6 {
		grid-template-rows: repeat(6, 1fr);
	}
	.grid-md-rows-7 {
		grid-template-rows: repeat(7, 1fr);
	}
	.grid-md-rows-8 {
		grid-template-rows: repeat(8, 1fr);
	}
	.grid-md-rows-9 {
		grid-template-rows: repeat(9, 1fr);
	}
	.grid-md-rows-10 {
		grid-template-rows: repeat(10, 1fr);
	}
	.grid-md-rows-11 {
		grid-template-rows: repeat(11, 1fr);
	}
	.grid-md-rows-12 {
		grid-template-rows: repeat(12, 1fr);
	}
}

/* Large Devices (≥992px) */
@media (min-width: 992px) {
	.grid-lg-cols-1 {
		grid-template-columns: repeat(1, 1fr);
	}
	.grid-lg-cols-2 {
		grid-template-columns: repeat(2, 1fr);
	}
	.grid-lg-cols-3 {
		grid-template-columns: repeat(3, 1fr);
	}
	.grid-lg-cols-4 {
		grid-template-columns: repeat(4, 1fr);
	}
	.grid-lg-cols-5 {
		grid-template-columns: repeat(5, 1fr);
	}
	.grid-lg-cols-6 {
		grid-template-columns: repeat(6, 1fr);
	}
	.grid-lg-cols-7 {
		grid-template-columns: repeat(7, 1fr);
	}
	.grid-lg-cols-8 {
		grid-template-columns: repeat(8, 1fr);
	}
	.grid-lg-cols-9 {
		grid-template-columns: repeat(9, 1fr);
	}
	.grid-lg-cols-10 {
		grid-template-columns: repeat(10, 1fr);
	}
	.grid-lg-cols-11 {
		grid-template-columns: repeat(11, 1fr);
	}
	.grid-lg-cols-12 {
		grid-template-columns: repeat(12, 1fr);
	}
	.grid-lg-rows-1 {
		grid-template-rows: repeat(1, 1fr);
	}
	.grid-lg-rows-2 {
		grid-template-rows: repeat(2, 1fr);
	}
	.grid-lg-rows-3 {
		grid-template-rows: repeat(3, 1fr);
	}
	.grid-lg-rows-4 {
		grid-template-rows: repeat(4, 1fr);
	}
	.grid-lg-rows-5 {
		grid-template-rows: repeat(5, 1fr);
	}
	.grid-lg-rows-6 {
		grid-template-rows: repeat(6, 1fr);
	}
	.grid-lg-rows-7 {
		grid-template-rows: repeat(7, 1fr);
	}
	.grid-lg-rows-8 {
		grid-template-rows: repeat(8, 1fr);
	}
	.grid-lg-rows-9 {
		grid-template-rows: repeat(9, 1fr);
	}
	.grid-lg-rows-10 {
		grid-template-rows: repeat(10, 1fr);
	}
	.grid-lg-rows-11 {
		grid-template-rows: repeat(11, 1fr);
	}
	.grid-lg-rows-12 {
		grid-template-rows: repeat(12, 1fr);
	}
}

/* Extra Large Devices (≥1200px) */
@media (min-width: 1200px) {
	.grid-xl-cols-1 {
		grid-template-columns: repeat(1, 1fr);
	}
	.grid-xl-cols-2 {
		grid-template-columns: repeat(2, 1fr);
	}
	.grid-xl-cols-3 {
		grid-template-columns: repeat(3, 1fr);
	}
	.grid-xl-cols-4 {
		grid-template-columns: repeat(4, 1fr);
	}
	.grid-xl-cols-5 {
		grid-template-columns: repeat(5, 1fr);
	}
	.grid-xl-cols-6 {
		grid-template-columns: repeat(6, 1fr);
	}
	.grid-xl-cols-7 {
		grid-template-columns: repeat(7, 1fr);
	}
	.grid-xl-cols-8 {
		grid-template-columns: repeat(8, 1fr);
	}
	.grid-xl-cols-9 {
		grid-template-columns: repeat(9, 1fr);
	}
	.grid-xl-cols-10 {
		grid-template-columns: repeat(10, 1fr);
	}
	.grid-xl-cols-11 {
		grid-template-columns: repeat(11, 1fr);
	}
	.grid-xl-cols-12 {
		grid-template-columns: repeat(12, 1fr);
	}
	.grid-xl-rows-1 {
		grid-template-rows: repeat(1, 1fr);
	}
	.grid-xl-rows-2 {
		grid-template-rows: repeat(2, 1fr);
	}
	.grid-xl-rows-3 {
		grid-template-rows: repeat(3, 1fr);
	}
	.grid-xl-rows-4 {
		grid-template-rows: repeat(4, 1fr);
	}
	.grid-xl-rows-5 {
		grid-template-rows: repeat(5, 1fr);
	}
	.grid-xl-rows-6 {
		grid-template-rows: repeat(6, 1fr);
	}
	.grid-xl-rows-7 {
		grid-template-rows: repeat(7, 1fr);
	}
	.grid-xl-rows-8 {
		grid-template-rows: repeat(8, 1fr);
	}
	.grid-xl-rows-9 {
		grid-template-rows: repeat(9, 1fr);
	}
	.grid-xl-rows-10 {
		grid-template-rows: repeat(10, 1fr);
	}
	.grid-xl-rows-11 {
		grid-template-rows: repeat(11, 1fr);
	}
	.grid-xl-rows-12 {
		grid-template-rows: repeat(12, 1fr);
	}
}

/* Extra Extra Large Devices (≥1400px) */
@media (min-width: 1400px) {
	.grid-xxl-cols-1 {
		grid-template-columns: repeat(1, 1fr);
	}
	.grid-xxl-cols-2 {
		grid-template-columns: repeat(2, 1fr);
	}
	.grid-xxl-cols-3 {
		grid-template-columns: repeat(3, 1fr);
	}
	.grid-xxl-cols-4 {
		grid-template-columns: repeat(4, 1fr);
	}
	.grid-xxl-cols-5 {
		grid-template-columns: repeat(5, 1fr);
	}
	.grid-xxl-cols-6 {
		grid-template-columns: repeat(6, 1fr);
	}
	.grid-xxl-cols-7 {
		grid-template-columns: repeat(7, 1fr);
	}
	.grid-xxl-cols-8 {
		grid-template-columns: repeat(8, 1fr);
	}
	.grid-xxl-cols-9 {
		grid-template-columns: repeat(9, 1fr);
	}
	.grid-xxl-cols-10 {
		grid-template-columns: repeat(10, 1fr);
	}
	.grid-xxl-cols-11 {
		grid-template-columns: repeat(11, 1fr);
	}
	.grid-xxl-cols-12 {
		grid-template-columns: repeat(12, 1fr);
	}
	.grid-xxl-rows-1 {
		grid-template-rows: repeat(1, 1fr);
	}
	.grid-xxl-rows-2 {
		grid-template-rows: repeat(2, 1fr);
	}
	.grid-xxl-rows-3 {
		grid-template-rows: repeat(3, 1fr);
	}
	.grid-xxl-rows-4 {
		grid-template-rows: repeat(4, 1fr);
	}
	.grid-xxl-rows-5 {
		grid-template-rows: repeat(5, 1fr);
	}
	.grid-xxl-rows-6 {
		grid-template-rows: repeat(6, 1fr);
	}
	.grid-xxl-rows-7 {
		grid-template-rows: repeat(7, 1fr);
	}
	.grid-xxl-rows-8 {
		grid-template-rows: repeat(8, 1fr);
	}
	.grid-xxl-rows-9 {
		grid-template-rows: repeat(9, 1fr);
	}
	.grid-xxl-rows-10 {
		grid-template-rows: repeat(10, 1fr);
	}
	.grid-xxl-rows-11 {
		grid-template-rows: repeat(11, 1fr);
	}
	.grid-xxl-rows-12 {
		grid-template-rows: repeat(12, 1fr);
	}
}

/*
	Extend bootstrap with gaps
*/

/* Gap Utilities */
.gap-0 {
	gap: 0;
}
.gap-1 {
	gap: 0.25rem;
}
.gap-2 {
	gap: 0.5rem;
}
.gap-3 {
	gap: 1rem;
}
.gap-4 {
	gap: 1.5rem;
}
.gap-5 {
	gap: 3rem;
}

/* Small Devices (≥576px) */
@media (min-width: 576px) {
	.gap-sm-0 {
		gap: 0;
	}
	.gap-sm-1 {
		gap: 0.25rem;
	}
	.gap-sm-2 {
		gap: 0.5rem;
	}
	.gap-sm-3 {
		gap: 1rem;
	}
	.gap-sm-4 {
		gap: 1.5rem;
	}
	.gap-sm-5 {
		gap: 3rem;
	}
}

/* Medium Devices (≥768px) */
@media (min-width: 768px) {
	.gap-md-0 {
		gap: 0;
	}
	.gap-md-1 {
		gap: 0.25rem;
	}
	.gap-md-2 {
		gap: 0.5rem;
	}
	.gap-md-3 {
		gap: 1rem;
	}
	.gap-md-4 {
		gap: 1.5rem;
	}
	.gap-md-5 {
		gap: 3rem;
	}
}

/* Large Devices (≥992px) */
@media (min-width: 992px) {
	.gap-lg-0 {
		gap: 0;
	}
	.gap-lg-1 {
		gap: 0.25rem;
	}
	.gap-lg-2 {
		gap: 0.5rem;
	}
	.gap-lg-3 {
		gap: 1rem;
	}
	.gap-lg-4 {
		gap: 1.5rem;
	}
	.gap-lg-5 {
		gap: 3rem;
	}
}

/* Extra Large Devices (≥1200px) */
@media (min-width: 1200px) {
	.gap-xl-0 {
		gap: 0;
	}
	.gap-xl-1 {
		gap: 0.25rem;
	}
	.gap-xl-2 {
		gap: 0.5rem;
	}
	.gap-xl-3 {
		gap: 1rem;
	}
	.gap-xl-4 {
		gap: 1.5rem;
	}
	.gap-xl-5 {
		gap: 3rem;
	}
}

/* Extra Extra Large Devices (≥1400px) */
@media (min-width: 1400px) {
	.gap-xxl-0 {
		gap: 0;
	}
	.gap-xxl-1 {
		gap: 0.25rem;
	}
	.gap-xxl-2 {
		gap: 0.5rem;
	}
	.gap-xxl-3 {
		gap: 1rem;
	}
	.gap-xxl-4 {
		gap: 1.5rem;
	}
	.gap-xxl-5 {
		gap: 3rem;
	}
}

.paggination-custom {
	font-size: 12px !important;
	height: 28px !important;
}
.toasts-bottom-right {
	z-index: 999999;
}

/* ACTION BTN */
.float-actions {
	position: fixed;
	right: 30px;
	bottom: 30px;
}

.float-actions .float-actions-container {
	position: relative;
}

@keyframes displayNoneDelay {
	from {
		display: flex;
	}
	to {
		display: none;
	}
}

.float-actions .float-actions-items {
	display: none;
	position: absolute;
	bottom: 130%;
	right: -20px;
	flex-direction: column;
	gap: 10px;
}

.float-actions[data-active="true"] .float-actions-items {
	display: flex;
}

.float-actions[data-active="false"] .float-actions-items {
	animation: displayNoneDelay 300ms normal;
}

.float-action {
	display: flex;
	gap: 20px;
	align-items: center;
	justify-content: flex-end;
	transform: scale(0);
	transition-property: transform;
	transition-duration: 300ms;
}

@keyframes scaleDown {
	from {
		transform: scale(0);
	}
	to {
		transform: scale(1);
	}
}

.float-actions[data-active="true"] .float-actions-items .float-action {
	transform: scale(1);
	animation: scaleDown 300ms normal;
}

.float-action-trigger {
	all: unset;
	padding-block: 10px;
	padding-inline: 15px;
	border-radius: 9999px;
	color: white;
}

.float-action-description {
	margin: 0px;
	background-color: rgba(0, 0, 0, 0.712);
	color: white;
	padding: 5px;
	border-radius: 10px;
	width: max-content;
}

.float-action-btn {
	all: unset;
	padding-block: 1rem;
	padding-inline: 1rem;
	background: rgba(81, 119, 190, 0.5);
	color: rgba(255, 255, 255, 0.3);
	font-size: 50px;
	border-radius: 9999px;
	transform: rotate(0deg);
	box-shadow: 0px 0px 30px rgba(0, 0, 0, 0.406);
	transition: transform 0.3s ease, background 0.3s ease, color 0.3s ease, box-shadow 0.3s ease;

}
.float-action-btn:hover {
	background: rgba(81, 119, 190, 1);
	color: white;
	cursor: pointer;
}




.float-action-icons {
	position: relative;
	width: 47px;
	height: 50px;

	padding: 1rem;
	text-align: center;

	i {
		position: absolute;
		top: 50%;
		left: 50%;
		translate: -50% -50%;
		display: block;

		&.icon-default {
			transition: opacity 0.3s, transform 0.3s;
			transform: rotate(0deg) scale(1);
		}

		&.icon-hover {
			transition: opacity 0.3s, transform 0.3s;
			transform: rotate(-180deg) scale(0.5);
			opacity: 0;
		}
	}
}

.float-action-btn:focus {
	outline: none;
}

.float-action-btn:active {
	transform: scale(0.9);
}

.float-actions[data-active="true"] .float-action-btn {
	.icon-hover {
		transform: rotate(45deg) scale(1);
		opacity: 1;
	}
	.icon-default {
		transform: rotate(180deg) scale(0.5);
		opacity: 0;
	}
}
.float-actions[data-active="false"] .float-action-btn {
	.icon-default {
		transition: opacity 0.3s, transform 0.3s;
	}

	.icon-hover {
		transition: opacity 0.3s, transform 0.3s;
		transform: rotate(-180deg) scale(0.5);
		opacity: 0;
	}
}

.window-controller {
	position: fixed;
	bottom: 0px;
	left: 50%;
	transform: translateX(-50%);
}
/* Monitoring log */
.monitoring-log-container {
	width: 400px;
	height: 400px;
	background-color: white;
}

/* Chat messages */
.chat-message {
	display: flex;
	align-items: end;
	gap: 10px;
}
.chat-message[data-author="me"] {
	display: flex;
	flex-direction: row-reverse;
	align-items: end;
	gap: 10px;
}

.chat-image {
	border-radius: 9999px;
	aspect-ratio: 1 / 1;
	width: 30px;
	height: 30px;
}

.message-info {
	display: flex;
	flex-direction: column;
}
.chat-message[data-author="me"] .message-info {
	align-items: end;
}

.message-author {
	font-size: 12px;
	margin: 0;
}

.message-content {
	position: relative;
	background-color: #5177be;
	color: white;
	padding: 10px;
	border-radius: 10px 10px 10px 0px;
	width: fit-content;
}

.chat-message[data-author="me"] .message-content {
	background-color: #dbdbdb;
	color: black;
	border-radius: 10px 10px 0px 10px;
}

.message-content::before {
	content: "\25BA";
	font-size: 20px;
	color: #5177be;
	position: absolute;
	bottom: -13.5px;
	left: -10px;
	transform: rotate(150deg);
}

.chat-message[data-author="me"] .message-content::before {
	content: "\25BA";
	font-size: 20px;
	color: #dbdbdb;
	position: absolute;
	bottom: -13.5px;
	left: auto;
	right: -10px;
	transform: rotate(25deg);
}

.message-content p {
	font-size: 14px;
	margin: 0;
}

.message-details {
	font-size: 12px;
	margin: 0;
}

.off-canvas {
	min-width: 0px;
	display: flex;
	position: fixed;
	top: 0;
	bottom: 0;
	right: 100%;
	width: 100%;
	z-index: 9999;
	transition-property: right;
	transition-duration: 300ms;
}

.off-canvas[data-from="right"] {
	flex-direction: row-reverse;
	right: 0;
	left: 100%;
	width: 100%;
	z-index: 9999;
	transition-property: left;
	transition-duration: 300ms;
}

.off-canvas.show {
	right: 0%;
}

.off-canvas.show[data-from="right"] {
	left: 0%;
}

.off-canvas .off-canvas-content {
	padding: 1rem;
	width: 90%;
	height: 100vh;
	background-color: white;
	overflow-x: hidden;
}

.off-canvas .off-canvas-overlay {
	width: 10%;
	height: 100vh;
	background-color: transparent;
}

.customer_progress {
	width: 50%;
}

@media (min-width: 576px) {
	.off-canvas .off-canvas-content {
		width: 70%;
	}
	.off-canvas .off-canvas-overlay {
		width: 30%;
	}
}

@media (min-width: 768px) {
	.off-canvas .off-canvas-content {
		width: 60%;
	}
	.off-canvas .off-canvas-overlay {
		width: 40%;
	}
	.customer_progress {
		width: 20%;
	}
}
@media (min-width: 992px) {
	.off-canvas .off-canvas-content {
		width: 50%;
	}
	.off-canvas .off-canvas-overlay {
		width: 50%;
	}
}
@media (min-width: 1200px) {
	.off-canvas .off-canvas-content {
		width: 40%;
	}
	.off-canvas .off-canvas-overlay {
		width: 60%;
	}
}

.off-canvas.show .off-canvas-overlay {
	transition-property: background-color;
	transition-delay: 200ms;
	transition-duration: 300ms;
	background-color: rgba(0, 0, 0, 0.1);
}

/* Reminders */
.reminders {
	position: fixed;
	right: 0;
	bottom: 20%;
	width: 80%;
	max-height: 70vh;
	overflow-y: auto;
}

@media (min-width: 576px) {
	.reminders {
		width: 55%;
	}
}

@media (min-width: 768px) {
	.reminders {
		width: 45%;
	}
}
@media (min-width: 992px) {
	.reminders {
		width: 35%;
	}
}
@media (min-width: 1200px) {
	.reminders {
		width: 25%;
	}
}

@keyframes enter-right {
	from {
		transform: translateX(100%);
	}
	to {
		transform: translateX(0);
	}
}

.reminder-enter-animate {
	animation: enter-right 0.5s;
}

@keyframes left-right {
	from {
		transform: translateX(0);
	}
	to {
		transform: translateX(100%);
	}
}

.reminder-left-animate {
	animation: left-right 0.5s;
}

.loading-spinner {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background-color: rgba(255, 255, 255, 0.8);
    display: flex;
    justify-content: center;
    align-items: center;
    z-index: 1050;
}

.loading-spinner .spinner {
    width: 50px;
    height: 50px;
    border: 5px solid #ccc;
    border-top: 5px solid black;
    border-radius: 50%;
    animation: spin 1s linear infinite;
}

@keyframes spin {
    0% {
        transform: rotate(0deg);
    }
    100% {
        transform: rotate(360deg);
    }
}


.btn-close-cancel {
	background-color: #6C757D;
	border-color: #ddd;
	color: #ffffff;
  }

.card-background-accordion:hover {
	background-color: #dee2e6;
}


/* IMPORTANTE FIX Solución para el scroll del modal de refund */
#modal-add-refund.modal.show {
	padding-right: 5px !important;
}

#modal-add-refund .modal-dialog {
	max-height: 90vh !important;
	overflow-y: auto !important;
	margin: 1.75rem auto !important;
}

#modal-add-refund .modal-body {
	max-height: calc(90vh - 120px) !important;
	overflow-y: auto !important;
}

/* Asegurar que cuando el modal de refund esté abierto, el body tenga scroll */
body.modal-open:has(#modal-add-refund.show) {
	overflow: hidden !important;
	padding-right: 5px !important;
}


/* FIX MODAL PDF */
#modal-pdf-refund.show {
	padding-right: 5px !important;
}

#modal-pdf-refund .modal-dialog {
	max-height: 90vh !important;
	overflow-y: auto !important;
	margin: 1.75rem auto !important;
}

#modal-pdf-refund .modal-body {
	max-height: calc(90vh - 120px) !important;
	overflow-y: auto !important;
}

body.modal-open:has(#modal-pdf-refund.show) {
	overflow: hidden !important;
	padding-right: 5px !important;
}