/*Estilos botones personalizados*/
.btn-circle {
	border-radius: 100%;
	height: 2.5rem;
	width: 2.5rem;
	font-size: 1rem;
	display: inline-flex;
	align-items: center;
	justify-content: center;
}
.btn-circle.btn-sm,
.btn-group-sm > .btn-circle.btn {
	height: 1.8rem;
	width: 1.8rem;
	font-size: 0.75rem;
}
.btn-circle.btn-lg,
.btn-group-lg > .btn-circle.btn {
	height: 3.5rem;
	width: 3.5rem;
	font-size: 1.35rem;
}
.btn-silver {
	border-radius: 100% !important;
	background: gainsboro !important;
	border: 2px solid #5c5c5b !important;
	color: #5c5c5b !important;
	padding: 0.5rem !important;
}
.btn-purple {
	color: #fff !important;
	background-color: #7266ba !important;
	border-color: #7266ba !important;
}
.btn-purple:hover {
	color: #fff !important;
	background-color: #564aa3 !important;
	border-color: #564aa3 !important;
}
.btn-purple:focus,
.btn-purple.focus {
	box-shadow: 0 0 0 0.2rem rgba(58, 176, 195, 0.5) !important;
}
.btn-purple.disabled,
.btn-purple:disabled {
	color: #fff !important;
	background-color: #7266ba !important;
	border-color: #7266ba !important;
}
.btn-purple:not(:disabled):not(.disabled):active,
.btn-purple:not(:disabled):not(.disabled).active,
.show > .btn-purple.dropdown-toggle {
	color: #fff !important;
	background-color: #7266ba !important;
	border-color: #564aa3 !important;
}
.btn-purple:not(:disabled):not(.disabled):active:focus,
.btn-purple:not(:disabled):not(.disabled).active:focus,
.show > .btn-purple.dropdown-toggle:focus {
	box-shadow: 0 0 0 0.2rem rgba(114, 102, 186, 0.5) !important;
}
.btn-green {
	color: #fff !important;
	background-color: #37bc9b !important;
	border-color: #37bc9b !important;
}
.btn-green:hover {
	color: #fff !important;
	background-color: #2b957a !important;
	border-color: #2b957a !important;
}
.btn-green:focus,
.btn-green.focus {
	box-shadow: 0 0 0 0.2rem rgba(58, 176, 195, 0.5) !important;
}
.btn-green.disabled,
.btn-green:disabled {
	color: #fff !important;
	background-color: #37bc9b !important;
	border-color: #37bc9b !important;
}
.btn-green:not(:disabled):not(.disabled):active,
.btn-green:not(:disabled):not(.disabled).active,
.show > .btn-green.dropdown-toggle {
	color: #fff !important;
	background-color: #2b957a !important;
	border-color: #10707f !important;
}
.btn-green-aquarium {
	color: #fff !important;
	background-color: #21f591 !important;
	border-color: #18d67e !important;
}
.btn-green-aquarium:hover {
	color: #fff !important;
	background-color: #21f591 !important;
	border-color: #18d67e !important;
}
.btn-green-aquarium.disabled,
.btn-green-aquarium:disabled {
	color: #fff !important;
	background-color: #64edad !important;
	border-color: #54ce95 !important;
}
/*Estilos de tabla estilo purpura*/
.btn-green:not(:disabled):not(.disabled):active:focus,
.btn-green:not(:disabled):not(.disabled).active:focus,
.show > .btn-green.dropdown-toggle:focus {
	box-shadow: 0 0 0 0.2rem rgba(58, 176, 195, 0.5) !important;
}
.btn-outline-purple {
	color: #7266ba !important;
	border-color: #564aa3 !important;
}
.btn-outline-purple:hover {
	color: #fff !important;
	background-color: #7266ba !important;
	border-color: #564aa3 !important;
}
.btn-outline-purple:focus,
.btn-outline-purple.focus {
	box-shadow: 0 0 0 0.2rem rgba(114, 102, 186, 0.5) !important;
}
.btn-outline-purple.disabled,
.btn-outline-purple:disabled {
	color: #7266ba;
	background-color: transparent;
}
.btn-outline-purple:not(:disabled):not(.disabled):active,
.btn-outline-purple:not(:disabled):not(.disabled).active,
.show > .btn-outline-purple.dropdown-toggle {
	color: #fff;
	background-color: #7266ba;
	border-color: #564aa3;
}
.btn-outline-purple:not(:disabled):not(.disabled):active:focus,
.btn-outline-purple:not(:disabled):not(.disabled).active:focus,
.show > .btn-outline-purple.dropdown-toggle:focus {
	box-shadow: 0 0 0 0.2rem rgba(114, 102, 186, 0.5);
}
/* Top left text */
.top-left {
	position: absolute;
	top: 8px;
	left: 16px;
}
/* Top right text */
.top-right {
	position: absolute;
	top: 8px;
	right: 16px;
}
/* Bottom right text */
.bottom-right {
	position: absolute;
	bottom: 8px;
	right: 16px;
}
/* Centered text */
.centered {
	position: absolute;
	top: 50%;
	left: 50%;
	transform: translate(-50%, -50%);
}
.card-image .principalImage {
	position: absolute;
	display: block !important;
	margin: 0.8rem;
	background: rgba(255, 255, 255, 0.674);
	padding: 0.5rem;
	border-radius: 11px;
	color: #000000c7;
	backdrop-filter: blur(3px);
	-webkit-backdrop-filter: blur(3px);
}
.is-primary {
	border-color: #007bff !important;
	padding-right: calc(1.5em + 0.75rem) !important;
	background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 512 512'%3E%3Cpath fill='%23007bff' d='M504 256c0 137-111 248-248 248S8 393 8 256 119 8 256 8s248 111 248 248zM227.3 387.3l184-184c6.2-6.2 6.2-16.4 0-22.6l-22.6-22.6c-6.2-6.2-16.4-6.2-22.6 0L216 308.1l-70.1-70.1c-6.2-6.2-16.4-6.2-22.6 0l-22.6 22.6c-6.2 6.2-6.2 16.4 0 22.6l104 104c6.2 6.2 16.4 6.2 22.6 0z'/%3E%3C/svg%3E") !important;
	background-repeat: no-repeat !important;
	background-position: right calc(0.375em + 0.1875rem) center !important;
	background-size: calc(0.75em + 0.375rem) calc(0.75em + 0.375rem) !important;
}
.is-warning {
	border-color: #ffc107 !important;
	padding-right: calc(1.5em + 0.75rem) !important;
	background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 512 512'%3E%3Cpath fill='%23ffc107' d='M504 256c0 137-111 248-248 248S8 393 8 256 119 8 256 8s248 111 248 248zm-143.6-28.9L288 302.6V120c0-13.3-10.7-24-24-24h-16c-13.3 0-24 10.7-24 24v182.6l-72.4-75.5c-9.3-9.7-24.8-9.9-34.3-.4l-10.9 11c-9.4 9.4-9.4 24.6 0 33.9L239 404.3c9.4 9.4 24.6 9.4 33.9 0l132.7-132.7c9.4-9.4 9.4-24.6 0-33.9l-10.9-11c-9.5-9.5-25-9.3-34.3 .4z'/%3E%3C/svg%3E") !important;
	background-repeat: no-repeat !important;
	background-position: right calc(0.375em + 0.1875rem) center !important;
	background-size: calc(0.75em + 0.375rem) calc(0.75em + 0.375rem) !important;
}
.is-info {
	border-color: #17a2b8 !important;
	padding-right: calc(1.5em + 0.75rem) !important;
	background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 512 512'%3E%3Cpath fill='%2317a2b8' d='M8 256C8 119 119 8 256 8s248 111 248 248-111 248-248 248S8 393 8 256zm143.6 28.9l72.4-75.5V392c0 13.3 10.7 24 24 24h16c13.3 0 24-10.7 24-24V209.4l72.4 75.5c9.3 9.7 24.8 9.9 34.3 .4l10.9-11c9.4-9.4 9.4-24.6 0-33.9L273 107.7c-9.4-9.4-24.6-9.4-33.9 0L106.3 240.4c-9.4 9.4-9.4 24.6 0 33.9l10.9 11c9.6 9.5 25.1 9.3 34.4-.4z'/%3E%3C/svg%3E") !important;
	background-repeat: no-repeat !important;
	background-position: right calc(0.375em + 0.1875rem) center !important;
	background-size: calc(0.75em + 0.375rem) calc(0.75em + 0.375rem) !important;
}
.map-input-google:after {
	width: 40px;
	height: 40px;
	display: block;
	content: " ";
	position: absolute;
	top: 50%;
	left: 50%;
	margin: -40px 0 0 -11px;
	background: url("../assets/images/icons/marker.png") no-repeat;
	background-size: 40px 40px; /* Since I used the HiDPI marker version this compensates for the 2x size */
	pointer-events: none; /* This disables clicks on the marker. Not fully supported by all major browsers, though */
}
.bg-purple {
	background-color: #592d5f !important;
}
.btn-circle {
	border-radius: 100%;
	height: 2.5rem;
	width: 2.5rem;
	font-size: 1rem;
	display: inline-flex;
	align-items: center;
	justify-content: center;
}
.text-purple-mac {
	color: #592f5f !important;
}
.text-green-mac {
	color: rgb(221, 252, 250) !important;
}
.text-blue-mac {
	color: #009fe3;
}
.text-blue-dark {
	color: #366092 !important;
}
.text-green-sapg {
	color: #a9d08e !important;
}
.text-green-light-sapg {
	color: #e2efda !important;
}
.text-green-dark-sapg {
	color: #82a36b !important;
}
.text-primary {
	color: #5d9cec !important;
}
.text-primary-light {
	color: #8bb8f1 !important;
}
.text-primary-dark {
	color: #2f80e7 !important;
}
.text-success {
	color: #27c24c !important;
}
.text-success-light {
	color: #43d967 !important;
}
.text-success-dark {
	color: #1e983b !important;
}
.text-info {
	color: #23b7e5 !important;
}
.text-info-light {
	color: #51c6ea !important;
}
.text-info-dark {
	color: #1797be !important;
}
.text-warning {
	color: #ff902b !important;
}
.text-warning-light {
	color: #ffab5e !important;
}
.text-warning-dark {
	color: #f77600 !important;
}
.text-danger {
	color: #f05050 !important;
}
.text-danger-light {
	color: #f47f7f !important;
}
.text-danger-dark {
	color: #ec2121 !important;
}
.text-green {
	color: #37bc9b !important;
}
.text-green-light {
	color: #58ceb1 !important;
}
.text-green-dark {
	color: #2b957a !important;
}
.text-pink {
	color: #f532e5 !important;
}
.text-pink-light {
	color: #f763eb !important;
}
.text-pink-dark {
	color: #e90bd6 !important;
}
.text-purple {
	color: #7266ba !important;
}
.text-purple-light {
	color: #9289ca !important;
}
.text-purple-dark {
	color: #564aa3 !important;
}
.text-inverse {
	color: #131e26 !important;
}
.text-inverse-light {
	color: #243948 !important;
}
.text-inverse-dark {
	color: #020304 !important;
}
.text-yellow {
	color: #fad732 !important;
}
.text-yellow-light {
	color: #fbe164 !important;
}
.text-yellow-dark {
	color: #f3ca06 !important;
}
.text-white {
	color: #fff !important;
}
.text-gray-darker {
	color: #232735 !important;
}
.text-gray-dark {
	color: #3a3f51 !important;
}
.text-gray {
	color: #dde6e9 !important;
}
.text-gray-light {
	color: #e4eaec !important;
}
.text-gray-lighter {
	color: #edf1f2 !important;
}
.bg-green-mac {
	background-color: rgb(221, 252, 250) !important;
	color: #592f5f !important;
}
.bg-blue-mac {
	background-color: #009fe3 !important;
	color: #592f5f;
}
.bg-purple-mac {
	background-color: #592f5f !important;
	color: #ffff !important;
}
.bg-blue {
	background-color: #9bc2e6;
	color: #000 !important;
}
.bg-blue small {
	color: inherit;
}
.bg-blue-dark {
	background-color: #366092;
	color: #fff !important;
}
.bg-blue-dark small {
	color: inherit;
}
.bg-green-sapg {
	background-color: #a9d08e;
	color: #fff !important;
}
.bg-green-light-sapg {
	background-color: #e2efda;
	color: #000 !important;
}
.bg-green-dark-sapg {
	background-color: #82a36b;
	color: #fff !important;
}
.bg-green small {
	color: inherit;
}
.bg-primary {
	background-color: #5d9cec;
	color: #fff !important;
}
.bg-primary-light {
	background-color: #8bb8f1;
	color: #fff !important;
}
.bg-primary-dark {
	background-color: #2f80e7;
	color: #fff !important;
}
.bg-primary small {
	color: inherit;
}
.bg-success {
	background-color: #27c24c;
	color: #fff !important;
}
.bg-success-light {
	background-color: #43d967;
	color: #fff !important;
}
.bg-success-dark {
	background-color: #1e983b;
	color: #fff !important;
}
.bg-success small {
	color: inherit;
}
.bg-info {
	background-color: #23b7e5;
	color: #fff !important;
}
.bg-info-light {
	background-color: #51c6ea;
	color: #fff !important;
}
.bg-info-dark {
	background-color: #1797be;
	color: #fff !important;
}
.bg-info small {
	color: inherit;
}
.bg-warning {
	background-color: #ff902b !important;
	color: #fff !important;
}
.bg-warning-light {
	background-color: #ffab5e !important;
	color: #fff !important;
}
.bg-warning-dark {
	background-color: #f77600 !important;
	color: #fff !important;
}
.bg-warning-pastel {
	background-color: #fceec9 !important;
	color: #000;
}
.bg-warning small {
	color: inherit;
}
.bg-danger {
	background-color: #f05050;
	color: #fff !important;
}
.bg-danger-light {
	background-color: #f47f7f !important;
	color: #fff !important;
}
.bg-danger-dark {
	background-color: #ec2121;
	color: #fff !important;
}
.bg-danger-pastel {
	background-color: #f8ccc8 !important;
	color: #000;
}
.bg-danger small {
	color: inherit;
}
.bg-green {
	background-color: #37bc9b;
	color: #fff !important;
}
.bg-green-light {
	background-color: #58ceb1;
	color: #fff !important;
}
.bg-green-dark {
	background-color: #2b957a;
	color: #fff !important;
}
.bg-pink {
	background-color: #f532e5;
	color: #fff !important;
}
.bg-pink-light {
	background-color: #f763eb;
	color: #fff !important;
}
.bg-pink-dark {
	background-color: #e90bd6;
	color: #fff !important;
}
.bg-pink small {
	color: inherit;
}
.bg-purple {
	background-color: #7266ba;
	color: #fff !important;
}
.bg-purple-light {
	background-color: #9289ca !important;
	color: #fff !important;
}
.bg-purple-dark {
	background-color: #564aa3;
	color: #fff !important;
}
.bg-purple small {
	color: inherit;
}
.bg-inverse {
	background-color: #131e26;
	color: #fff !important;
}
.bg-inverse-light {
	background-color: #243948;
	color: #fff !important;
}
.bg-inverse-dark {
	background-color: #020304;
	color: #fff !important;
}
.bg-inverse small {
	color: inherit;
}
.bg-yellow {
	background-color: #fad732;
	color: #fff !important;
}
.bg-yellow-light {
	background-color: #fbe164;
	color: #fff !important;
}
.bg-yellow-dark {
	background-color: #f3ca06;
	color: #fff !important;
}
.bg-yellow small {
	color: inherit;
}
.bg-white {
	background-color: #fff;
	color: inherit !important;
}
.bg-gray-darker {
	background-color: #232735;
	color: #fff !important;
}
.bg-gray-dark {
	background-color: #3a3f51;
	color: #fff !important;
}
.bg-gray {
	background-color: #dde6e9;
	color: #656565 !important;
}
.bg-gray-light {
	background-color: #e4eaec;
	color: #656565 !important;
}
.bg-gray-lighter {
	background-color: #edf1f2;
	color: #656565 !important;
}
.bg-transparent {
	background-color: transparent !important;
}
.bg-cover {
	background-size: cover;
}
/*Estilos botones personalizados*/
.btn-purple {
	color: #fff !important;
	background-color: #7266ba !important;
	border-color: #7266ba !important;
}
.badge-purple {
	color: #fff;
	background-color: #7266ba;
}
a.badge-purple:hover,
a.badge-purple:focus {
	color: #fff;
	background-color: #9289ca;
}
a.badge-purple:focus,
a.badge-purple.focus {
	outline: 0;
	box-shadow: 0 0 0 0.2rem rgba(0, 123, 255, 0.5);
}
.bg-purple-gradient {
	background: #9289ca;
	background: -webkit-gradient(
		linear,
		left bottom,
		left top,
		color-stop(0, #9289ca),
		color-stop(1, #7266ba)
	);
	background: -ms-linear-gradient(bottom, #9289ca, #7266ba);
	background: -moz-linear-gradient(center bottom, #9289ca 0%, #564aa3 100%);
	background: -o-linear-gradient(#564aa3, #9289ca);
	color: #ffffff;
}
.images {
	width: 100%;
	flex-wrap: wrap;
	height: auto;
	position: relative;
	overflow-y: auto;
}
.card-image {
	overflow: hidden !important;
	position: relative !important;
	padding: 0.5rem !important;
}
.img-actions {
	position: absolute !important;
	right: 0.5rem !important;
	top: 0.5rem !important;
	margin: 0.5rem 0.5rem !important;
}
.counter {
	position: relative;
	top: -10px;
	right: 5px;
	z-index: 2;
	padding: 1px 9px;
	margin-right: -23px;
	font-size: 11px;
	color: #fff;
	background-color: #fe1212;
	border-radius: 10em;
	-webkit-box-shadow: 0 2px 5px 0 rgba(0, 0, 0, 0.16),
		0 2px 10px 0 rgba(0, 0, 0, 0.12);
	box-shadow: 0 2px 5px 0 rgba(0, 0, 0, 0.16),
		0 2px 10px 0 rgba(0, 0, 0, 0.12);
}
.counter.counter-sm {
	font-size: 8px;
}
.counter.counter-lg {
	font-size: 12px;
}
.img-wrapper {
	position: relative;
	text-align: center;
}
.img-responsive {
	height: auto;
}
.img-overlay {
	position: absolute;
	top: 10px;
	left: 0px;
	right: 0px;
}
.img-overlay:before {
	content: " ";
	display: block;
	/* adjust 'height' to position overlay content vertically */
	height: 50%;
}
.btn-icon {
	cursor: pointer;
}
.btn-icon-danger {
	color: #fd3550;
	border-color: #fd3550;
}
.btn-icon-danger:hover {
	color: #d10b1e;
	border-color: #b02a37;
}
.btn-icon-success {
	color: #15ca20;
	border-color: #15ca20;
}
.btn-icon-success:hover {
	color: #0eb018;
	border-color: #0eb018;
}
@media only screen and (max-width: 240px) {
	.modal .modal-body {
		max-height: 360px;
		overflow-y: auto;
	}
}

@media only screen and (max-width: 360px) {
	.modal .modal-body {
		max-height: 420px;
		overflow-y: auto;
	}
}

@media only screen and (max-width: 420px) {
	.modal .modal-body {
		max-height: 560px;
		overflow-y: auto;
	}
}

@media only screen and (max-width: 560px) {
	.modal .modal-body {
		max-height: 700px;
		overflow-y: auto;
	}
}

.formFirma {
	width: 100%;
	height: auto;
	position: relative;
}

.formFirma .cardFirma {
	width: 100%;
	position: relative !important;
	padding: 0.5rem !important;
}

.formFirma .cardFirma .classFirma {
	border-radius: 25px !important;
	object-fit: cover;
}

.formFirma .cardFirma .btn {
	position: inherit;
	z-index: 999999999;
	top: 5px;
	right: 0px;
}
#loading-screen {
	position: fixed;
	width: 100%;
	height: 100%;
	top: 0;
	left: 0;
	display: flex;
	justify-content: center;
	align-items: center;
	flex-direction: column;
	z-index: 9999;
	transition: opacity 0.3s ease;
	opacity: 0.9;
}

:root {
	--loader-bg: rgba(255, 255, 255, 0.9);
	--spinner-border: #3498db;
	--loader-text: #333;
}

@media (prefers-color-scheme: dark) {
	:root {
		--loader-bg: rgba(18, 18, 18, 0.9);
		--spinner-border: #ffffff;
		--loader-text: #ffffff;
	}
}

#loading-screen {
	background-color: var(--loader-bg);
	color: var(--loader-text);
}

.spinner {
	border: 8px solid rgba(0, 0, 0, 0.1);
	border-radius: 50%;
	border-top: 8px solid var(--spinner-border);
	width: 60px;
	height: 60px;
	animation: spin 1s linear infinite;
}

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

p#loader {
	margin-top: 15px;
	font-size: 18px;
	color: var(--loader-text);
}

.table-responsive-scroll {
	max-height: 250px;
	overflow-y: auto;
}

.table thead th {
	position: sticky;
	top: 0;
	z-index: 1;
}