@import url("https://cdn.jsdelivr.net/npm/bootstrap-icons@1.10.5/font/bootstrap-icons.css");
@import url('https://fonts.googleapis.com/css2?family=Montserrat:ital,wght@0,200;0,300;0,400;0,500;0,600;0,700;0,900;1,200;1,300;1,400;1,500;1,600;1,700;1,900&family=Parisienne&display=swap');
/*@import url("../fonts/brown_ll/brown_ll.css");*/

:root,
[data-bs-theme=light] {
  --bs-blue: #0552E0;
  --bs-indigo: #6610f2;
  --bs-purple: #6f42c1;
  --bs-pink: #d63384;
  --bs-red: #dc3545;
  --bs-orange: #fd7e14;
  --bs-yellow: #ffc107;
  --bs-green: #198754;
  --bs-teal: #20c997;
  --bs-cyan: #1895f1;
  --bs-black: #000;
  --bs-white: #fff;
  --bs-gray: #6c757d;
  --bs-gray-dark: #343a40;
  --bs-gray-100: #f8f9fa;
  --bs-gray-200: #e9ecef;
  --bs-gray-300: #dee2e6;
  --bs-gray-400: #ced4da;
  --bs-gray-500: #adb5bd;
  --bs-gray-600: #6c757d;
  --bs-gray-700: #495057;
  --bs-gray-800: #343a40;
  --bs-gray-900: #212529;
  --bs-primary: #0552e0;
  --bs-secondary: #6c757d;
  --bs-success: #12d68c;
  --bs-info: #1895f1;
  --bs-warning: #ffab0c;
  --bs-danger: #c10f25;
  --bs-light: #f8f9fa;
  --bs-dark: #0e0e30;
  --bs-primary-rgb: 5, 82, 224;
  --bs-secondary-rgb: 108, 117, 125;
  --bs-success-rgb: 18, 214, 140;
  --bs-info-rgb: 24, 149, 241;
  --bs-warning-rgb: 255, 171, 12;
  --bs-danger-rgb: 193, 15, 37;
  --bs-light-rgb: 248, 249, 250;
  --bs-dark-rgb: 14, 14, 48;
  --bs-emphasis-rgb: 31, 215, 253;
  --bs-primary-text-emphasis: #0020cf;
  --bs-secondary-text-emphasis: #2b2f32;
  --bs-success-text-emphasis: #00ffaa;
  --bs-info-text-emphasis: #00bcff;
  --bs-warning-text-emphasis: #ffda00;
  --bs-danger-text-emphasis: #e1010a;
  --bs-light-text-emphasis: #495057;
  --bs-dark-text-emphasis: #000954;
  --bs-emphasis-text-emphasis: #07ffff;
  --bs-primary-bg-subtle: #cddaf9;
  --bs-secondary-bg-subtle: #e2e3e5;
  --bs-success-bg-subtle: #d0f7e8;
  --bs-info-bg-subtle: #bcebff;
  --bs-warning-bg-subtle: #fff5bc;
  --bs-danger-bg-subtle: #ffdad6;
  --bs-light-bg-subtle: #fcfcfd;
  --bs-dark-bg-subtle: #ced4da;
  --bs-emphasis-bg-subtle: #bcddeb;
  --bs-primary-border-subtle: #cddaf9;
  --bs-secondary-border-subtle: #c4c8cb;
  --bs-success-border-subtle: #d0f7e8;
  --bs-info-border-subtle: #bcebff;
  --bs-warning-border-subtle: #fff5bc;
  --bs-danger-border-subtle: #ffdad6;
  --bs-light-border-subtle: #e9ecef;
  --bs-dark-border-subtle: #adb5bd;
  --bs-emphasis-border-subtle: #bcddeb;
  --bs-white-rgb: 255, 255, 255;
  --bs-black-rgb: 0, 0, 0;
  --bs-font-sans-serif: 'Montserrat', sans-serif;
  --bs-font-monospace: SFMono-Regular, Menlo, Monaco, Consolas, "Liberation Mono", "Courier New", monospace;
  --bs-gradient: linear-gradient(180deg, rgba(255, 255, 255, 0.15), rgba(255, 255, 255, 0));
  --bs-body-font-family: var(--bs-font-sans-serif);
  --bs-body-font-size: .78rem;
  --bs-body-font-weight: 400;
  --bs-body-line-height: 1.5;
  --bs-body-color: #0E0E30;
  --bs-body-color-rgb: 33, 37, 41;
  --bs-body-bg: #fff;
  --bs-body-bg-rgb: 255, 255, 255;
  --bs-emphasis-color: #1fd7fd;
  --bs-emphasis-color-rgb: 31, 215, 253;
  --bs-secondary-color: rgba(33, 37, 41, 0.75);
  --bs-secondary-color-rgb: 33, 37, 41;
  --bs-secondary-bg: #e9ecef;
  --bs-secondary-bg-rgb: 233, 236, 239;
  --bs-tertiary-color: rgba(33, 37, 41, 0.5);
  --bs-tertiary-color-rgb: 33, 37, 41;
  --bs-tertiary-bg: #f8f9fa;
  --bs-tertiary-bg-rgb: 248, 249, 250;
  --bs-heading-color: inherit;
  --bs-link-color: #0552E0;
  --bs-link-color-rgb: 5, 82, 224;
  --bs-link-decoration: underline;
  --bs-link-hover-color: #0a58ca;
  --bs-link-hover-color-rgb: 10, 88, 202;
  --bs-code-color: #d63384;
  --bs-highlight-color: #212529;
  --bs-highlight-bg: #fff3cd;
  --bs-border-width: 1px;
  --bs-border-style: solid;
  --bs-border-color: #dee2e6;
  --bs-border-color-translucent: rgba(0, 0, 0, 0.175);
  --bs-border-radius: 0.375rem;
  --bs-border-radius-sm: 0.25rem;
  --bs-border-radius-lg: 0.5rem;
  --bs-border-radius-xl: 1rem;
  --bs-border-radius-xxl: 2rem;
  --bs-border-radius-2xl: var(--bs-border-radius-xxl);
  --bs-border-radius-pill: 50rem;
  --bs-box-shadow: 0 0.5rem 1rem rgba(0, 0, 0, 0.15);
  --bs-box-shadow-sm: 0 0.125rem 0.25rem rgba(0, 0, 0, 0.075);
  --bs-box-shadow-lg: 0 1rem 3rem rgba(0, 0, 0, 0.175);
  --bs-box-shadow-inset: inset 0 1px 2px rgba(0, 0, 0, 0.075);
  --bs-focus-ring-width: 0.25rem;
  --bs-focus-ring-opacity: 0.25;
  --bs-focus-ring-color: rgba(5, 82, 224, 0.25);
  --bs-form-valid-color: #12d68c;
  --bs-form-valid-border-color: #12d68c;
  --bs-form-invalid-color: #c10f25;
  --bs-form-invalid-border-color: #c10f25;
  /* MAPACHE */
  --mpch-text-small-md: .7rem;
  --mpch-text-small-xs: .62rem;
  --mpch-text-small-xxs: .5rem;
  --mpch-box-shadow: 0 .5rem 1rem -.38rem rgba(var(--bs-dark-rgb), 0.25);
}

/* +++ CAMBIOS BS +++ */
.fw-lighter {font-weight: 200 !important;}
.form-check-input {width: 1.58rem; height: 1.58rem;}
.shadow {box-shadow: var(--mpch-box-shadow) !important;}
.nav-tabs .nav-link.active, 
.nav-tabs .nav-item.show .nav-link{color: var(--bs-primary); background-color: var(--bs-white); border-color: var(--bs-warning) var(--bs-warning) var(--bs-white); box-shadow: 0 -5px 12px -7px rgba(var(--bs-dark-rgb),.58);}
.form-control, .form-select{font-size: .80rem}
.btn-lg, .btn-group-lg > .btn{height: calc(3.5rem + calc(var(--bs-border-width) * 2)); min-height: calc(3.5rem + calc(var(--bs-border-width) * 2)); line-height: 1.25;}
.bg-emphasis {--bs-bg-opacity: 1; background-color: rgba(var(--bs-emphasis-rgb), var(--bs-bg-opacity)) !important;}
.btn:hover{/*background-image: var(--bs-btn-hover-bg-gradient);*/ box-shadow: var(--mpch-box-shadow);}

.btn-dark { --bs-btn-color: var(--bs-white); --bs-btn-bg: rgba(var(--bs-dark-rgb), .95); --bs-btn-border-color: var(--bs-dark); --bs-btn-hover-color: #fff; --bs-btn-hover-bg: var(--bs-dark-text-emphasis); --bs-btn-hover-border-color: var(--bs-dark-text-emphasis); --bs-btn-focus-shadow-rgb: 66, 70, 73; --bs-btn-active-color: #fff; --bs-btn-active-bg: var(--bs-dark-text-emphasis); --bs-btn-active-border-color: var(--bs-dark-text-emphasis); --bs-btn-active-shadow: inset 0 3px 5px rgba(0, 0, 0, 0.125); --bs-btn-disabled-color: #fff; --bs-btn-disabled-bg: rgba(var(--bs-dark-rgb),.3); --bs-btn-disabled-border-color: #212529;}
.btn-primary { --bs-btn-bg: var(--bs-primary); --bs-btn-bg-gradient: linear-gradient(-2.5deg, var(--bs-primary) 0%, var(--bs-primary) 80%); --bs-btn-border-color: var(--bs-primary); --bs-btn-hover-bg: var(--bs-primary-text-emphasis); --bs-btn-hover-bg-gradient: linear-gradient(-2.5deg, var(--bs-dark) -120%, var(--bs-primary) 80%); --bs-btn-hover-border-color: var(--bs-primary-text-emphasis); --bs-btn-active-bg: var(--bs-primary-text-emphasis); --bs-btn-active-border-color: var(--bs-primary-text-emphasis); --bs-btn-disabled-bg: var(--bs-primary); --bs-btn-disabled-border-color: var(--bs-primary); box-shadow: 0 0.5rem 1rem rgba(0, 0, 0, .0); transition: all .3s ease-in-out !important;}


/* +++ GENERALES +++ */
/*.wrapper {height: 100vh;z-index: 997; overflow-y: auto;}*/
.fw-black{font-weight: 900 !important;}
.small-md{font-size: .7rem !important;}
.small-xs{font-size: .62rem !important;}
.small-xxs{font-size: .5rem !important;}
.text-justify{text-align: justify;}
.lh-07{line-height: .7 !important}
.lh-08{line-height: .8 !important}
.lh-09{line-height: .9 !important}
.ls-1{letter-spacing: .25rem !important;}
.ls-2{letter-spacing: .5rem !important;}
.ls-3{letter-spacing: 1rem !important;}
.ls-4{letter-spacing: 1.5rem !important;}
.ls-5{letter-spacing: 3rem !important;}
.ls-sm-1{letter-spacing: .031rem !important;}
.ls-sm-2{letter-spacing: .063rem !important;}
.ls-sm-3{letter-spacing: .094rem !important;}
.ls-sm-4{letter-spacing: .125rem !important;}
.ls-sm-5{letter-spacing: .188rem !important;}
.ls-n1{letter-spacing: -.031rem !important;}
.ls-n2{letter-spacing: -.063rem !important;}
.ls-n3{letter-spacing: -.04rem !important;}
.ls-n4{letter-spacing: -.025rem !important;}
.ls-n5{letter-spacing: -.088rem !important;}
.mt-n1{margin-top: -0.25rem !important;}
.mt-n2{margin-top: -0.5rem !important;}
.mt-n3{margin-top: -1rem !important;}
.mt-n4{margin-top: -1.5rem !important;}
.mt-n5{margin-top: -3rem !important;}
i.bi.bi-md{font-size: 120%}
i.bi.bi-lg{font-size: 150%}
i.bi.bi-xl{font-size: 180%}
i.bi.bi-xxl{font-size: 200%}


/* +++ FORMS +++ */
/* Ocultar flechas en campo númerico */
input[type=number]::-webkit-inner-spin-button, 
input[type=number]::-webkit-outer-spin-button {-webkit-appearance: none;margin: 0;}
input[type=number] {-moz-appearance:textfield; }

#mpch-register .wrapper, 
#mpch-register-2 .wrapper{min-height: 88vh; padding-top: calc( var(--bs-border-radius-xxl)*3.85 ); background-image: url('../imgs/mapache-bg-1.jpg'); background-size: 88%; background-repeat: no-repeat; background-position: top right; background-attachment: fixed;}
#mpch-login .wrapper{min-height: 88vh; background-image: url('../imgs/mapache-bg-2.jpg'); background-size: 88%; background-repeat: no-repeat; background-position: top left; background-attachment: fixed;}
#mpch-login .login-wrapper{min-height: 100vh;}
.logo-mapache_h-svg {max-height: 5vh;}

/*[class*=" border-"].divider{--bs-border-opacity: .3 !important;}*/
.divider{ --bs-border-opacity: .25 !important;}
footer .logoGNP-footer{max-height: 14px}
footer .icono-box{width: 21px; height: 21px; min-width: 21px; border-radius: 100px}
footer .icono-box .bi::before, 
footer .icono-box [class*=" bi-"]::before{ vertical-align: -.175rem;}

.breadcrumb{--bs-breadcrumb-item-padding-x: .25rem; font-size: var(--mpch-text-small-xs);}
.breadcrumb-item span{padding: var(--bs-border-radius-sm) var(--bs-border-radius-lg); background-color: var(--bs-info-bg-subtle); border-radius: var(--bs-border-radius-2xl);}
.breadcrumb-item.active span{ color: var(--bs-white); background-color: var(--bs-primary); font-weight: 600;}
.breadcrumb-item.success span{ color: var(--bs-white); background-color: var(--bs-success); font-weight: 600; border-color: var(--bs-success);}

/* TABS */
#mpch-tab .btn{border-radius: 30px; margin-bottom: var(--bs-border-radius-sm);}
#mpch-tab .btn:not(.active);{border-radius: 100px;}
#mpch-tab .btn:hover, #mpch-tab .btn:focus{background-color: var(--bs-primary-text-emphasis);}
#mpch-tab .btn.disabled,#mpch-tab .btn:disabled{ background-color:var(--bs-dark-bg-subtle); color: var(--bs-dark);}
#mpch-tab .btn.active{border-radius: 30px 30px 0 0; margin-bottom: 0 !important; padding-bottom: calc(var(--bs-border-radius-xl) + 5px) !important; background-color: var(--bs-primary-text-emphasis);}

/*upload docs*/

.imagePreview{border-radius: var(--bs-border-radius-xl);background-image: url('../imgs/file-earmark-arrow-up-fill-movil.svg'); background-size: cover;background-position:center;background-repeat: no-repeat; display: flex; justify-content: center;}
.file-upload{display: flex;align-items: center;position: relative;}
.file-select {position: relative;overflow: hidden;display: flex;align-items: center;}
.file-select-name{margin-left: 15px;}
.file-select input[type=file] {position: absolute;left: 0;top: 0;opacity: 0;width: 100%;height: 100%;}
.file-remove{margin-left: 15px;position: absolute;right: 15px;top: 20px;}

@media (min-width: 576px) { ... }
@media (min-width: 768px) {
  #mpch-login .wrapper{min-height: 88vh;}
  #mpch-register .wrapper{min-height: 88vh;}
  #mpch-register-2 .wrapper{min-height: 88vh;}
  #mpch-login .login-wrapper{min-height: 88vh;}
  footer .contacto.flex-column, footer .sedes.flex-column {flex-direction: row !important;} 
}
@media (min-width: 992px) {
  #mpch-login .wrapper{background-image: url('../imgs/mapache-login-bg.jpg'); background-size: cover; background-repeat: no-repeat; background-position: bottom left; background-attachment: fixed;}
  #mpch-register .wrapper{background-image: url('../imgs/mapache-register-bg.jpg'); background-size: cover; background-repeat: no-repeat; background-position: bottom right; background-attachment: fixed;}
  #mpch-register-2 .wrapper{background-image: url('../imgs/mapache-register_2-bg.jpg'); background-size: cover; background-repeat: no-repeat; background-position: -180px 0; background-attachment: fixed;}
  #mpch-register .logo-mapache_h-svg {max-height: 38px;}
  footer .icono-box{width: 30px; height: 30px; min-width: 30px;}
}
@media (min-width: 1200px) { 
  #mpch-register-2 .wrapper{background-position: top right;}
  .breadcrumb-item span{padding: var(--bs-border-radius-lg) var(--bs-border-radius-xl);}
  .breadcrumb-item + .breadcrumb-item::before{padding-right: var(--bs-breadcrumb-item-padding-x);}
  .imagePreview{background-image: url('../imgs/file-earmark-arrow-up-fill.svg');}
}
@media (min-width: 1400px) { ... }


@media (max-width: 575.98px) {
  .formRegistro-box .datosUsuarios {border: 0 !important}
  .form-floating > .form-control, 
  .form-floating > .form-control-plaintext, 
  .form-floating > .form-select,
  .btn-lg, .btn-group-lg > .btn {height: calc(2.5rem + calc(var(--bs-border-width) * 2)); min-height: calc(2.5rem + calc(var(--bs-border-width) * 2)); line-height: 1.25;}
  .form-floating > .form-control, .form-floating > label{padding: .7rem}
  .form-floating > .form-select{padding-top: 1rem; padding-bottom: .25rem; background-position: right 0.75rem top 1.24rem;}
  .form-floating > .form-control:not(:placeholder-shown) ~ label, 
  .form-floating > .form-select:not(:placeholder-shown) ~ label{font-size: .65rem}
  footer .icono-box i.bi.h6{font-size: .7rem}
  footer .logo .small-xs{font-size: .5rem !important}

  #mpch-tab .btn:not(.active) i{margin: 0 !important;}
  #mpch-tab .btn:not(.active) p{display: none}
}
@media (max-width: 767.98px) { ... }
@media (max-width: 991.98px) { ... }
@media (max-width: 1199.98px) { ... }
@media (max-width: 1399.98px) { ... }


/* spin de ícono en modal */
.custom-spinner {
  animation: spin 2s linear infinite;
  height: 50px;
  width: 50px;
}

@keyframes spin {
  0% { transform: rotate(0deg); }
  100% { transform: rotate(360deg); }
}

.btn-flotante {
	font-size: 20px;
	text-transform: uppercase;
	font-weight: bold;
	color: #ffffff;
	border-radius: 50%;
	background-color: var(--bs-secondary);
	padding: 20px 23px;
	position: fixed;
	bottom: 40px;
	right: 40px;
	transition: all 300ms ease 0ms;
	box-shadow: 0px 8px 15px rgba(0, 0, 0, 0.1);
	z-index: 99;
}
.btn-flotante:hover {
	background-color: var(--bs-primary);
	box-shadow: 0px 15px 20px rgba(0, 0, 0, 0.3);
	transform: translateY(-7px);
}
@media only screen and (max-width: 600px) {
 	.btn-flotante {
		font-size: 14px;
		padding: 12px 20px;
		bottom: 20px;
		right: 20px;
	}
}