/* ============================================= */
/* VARIABLES GLOBALES (Custom Properties)        */
/* ============================================= */
:root {
  /* Paleta de colores básicos */
  --blue: #007bff;
  --indigo: #6610f2;
  --purple: #6f42c1;
  --pink: #e83e8c;
  --red: #dc3545;
  --orange: #fd7e14;
  --yellow: #ffc107;
  --green: #28a745;
  --teal: #20c997;
  --cyan: #17a2b8;
  --white: #fff;
  --gray: #6c757d;
  --gray-dark: #343a40;
  
  /* Colores temáticos personalizados */
  --primary: #F9A392;    /* Color principal del tema */
  --secondary: #6EBBF6;  /* Color secundario */
  --success: #28a745;    /* Para indicar éxito */
  --info: #17a2b8;       /* Para información */
  --warning: #ffc107;    /* Para advertencias */
  --danger: #dc3545;     /* Para errores/peligro */
  --light: #FEF1EF;      /* Fondo claro */
  --dark: #211E1C;       /* Texto oscuro */
  
  /* Breakpoints para diseño responsivo */
  --breakpoint-xs: 0;      /* Extra small devices (teléfonos) */
  --breakpoint-sm: 576px;  /* Small devices (teléfonos grandes) */
  --breakpoint-md: 768px;  /* Medium devices (tablets) */
  --breakpoint-lg: 992px;  /* Large devices (desktops) */
  --breakpoint-xl: 1200px; /* Extra large devices (pantallas grandes) */
  
  /* Fuentes tipográficas */
  --font-family-sans-serif: "Poppins", sans-serif;       /* Fuente principal */
  --font-family-monospace: SFMono-Regular, Menlo, Monaco, Consolas, "Liberation Mono", "Courier New", monospace; /* Fuente para código */
}

/* ============================================= */
/* RESET Y NORMALIZACIÓN                         */
/* ============================================= */
/* Modelo de caja consistente para todos los elementos */
*,
*::before,
*::after {
  box-sizing: border-box; /* Padding y border incluidos en el ancho/alto */
}

/* Estilos base del documento HTML */
html {
  font-family: sans-serif; /* Fuente genérica como fallback */
  line-height: 1.15;       /* Interlineado base */
  -webkit-text-size-adjust: 100%; /* Evita ajuste automático de texto en iOS */
  -webkit-tap-highlight-color: rgba(0, 0, 0, 0); /* Elimina highlight azul en móviles */
}

/* Elementos semánticos HTML5 con display block por defecto */
article, aside, figcaption, figure, footer, header, hgroup, main, nav, section {
  display: block;
}

/* ============================================= */
/* ESTILOS BASE DEL CUERPO DEL DOCUMENTO         */
/* ============================================= */
body {
  margin: 0; /* Elimina márgenes por defecto */
  font-family: var(--font-family-sans-serif); /* Usa la fuente definida en variables */
  font-size: 1rem;          /* Tamaño base (16px normalmente) */
  font-weight: 400;         /* Grosor normal */
  line-height: 1.5;         /* Interlineado legible */
  color: #757575;           /* Color de texto gris medio */
  text-align: left;         /* Alineación por defecto */
  background-color: #fff;   /* Fondo blanco */
}

/* Mejoras de accesibilidad para elementos con foco */
[tabindex="-1"]:focus:not(:focus-visible) {
  outline: 0 !important; /* Elimina outline cuando no es visible (mejora accesibilidad) */
}

/* ============================================= */
/* ESTILOS PARA ELEMENTOS ESPECÍFICOS            */
/* ============================================= */
/* Separador horizontal */
hr {
  box-sizing: content-box; /* Compatibilidad con navegadores antiguos */
  height: 0;               /* Altura mínima */
  overflow: visible;       /* Permite que el borde sea visible */
}

/* Encabezados */
h1, h2, h3, h4, h5, h6 {
  margin-top: 0;           /* Elimina margen superior por defecto */
  margin-bottom: 0.5rem;   /* Espaciado inferior consistente */
}

/* Párrafos */
p {
  margin-top: 0;          /* Elimina margen superior por defecto */
  margin-bottom: 1rem;    /* Espaciado inferior estándar */
}

/* Abreviaturas */
abbr[title],
abbr[data-original-title] {
  text-decoration: underline dotted; /* Subrayado punteado para indicar tooltip */
  cursor: help;           /* Cambia cursor a "ayuda" */
  border-bottom: 0;       /* Elimina borde inferior en algunos navegadores */
  text-decoration-skip-ink: none; /* Mejor legibilidad en subrayados */
}

/* Direcciones/postal */
address {
  margin-bottom: 1rem;    /* Espaciado inferior */
  font-style: normal;     /* Elimina cursiva por defecto */
  line-height: inherit;   /* Hereda interlineado del padre */
}

/* Listas */
ol,
ul,
dl {
  margin-top: 0;          /* Elimina margen superior por defecto */
  margin-bottom: 1rem;    /* Espaciado inferior estándar */
}

/* Anidamiento de listas */
ol ol,
ul ul,
ol ul,
ul ol {
  margin-bottom: 0;       /* Evita doble espaciado en listas anidadas */
}

/* Términos en listas de definición */
dt {
  font-weight: 700;       /* Texto en negrita para términos */
}

/* Descripciones en listas de definición */
dd {
  margin-bottom: .5rem;   /* Espaciado inferior reducido */
  margin-left: 0;         /* Elimina sangría por defecto */
}

/* Citas/texto destacado */
blockquote {
  margin: 0 0 1rem;       /* Espaciado vertical y horizontal */
}

/* Texto en negrita/strong */
b,
strong {
  font-weight: bolder;    /* Peso de fuente más grueso */
}

/* Texto pequeño */
small {
  font-size: 80%;         /* Reduce tamaño al 80% */
}
/* ============================================= */
/* ESTILOS PARA SUPERÍNDICE Y SUBÍNDICE          */
/* ============================================= */
sub,
sup {
  position: relative;  /* Permite ajustar posición relativa a la línea base */
  font-size: 75%;      /* Reduce tamaño de fuente al 75% del texto normal */
  line-height: 0;      /* Elimina espacio adicional de línea */
  vertical-align: baseline; /* Alinea con la línea base del texto */
}

sub {
  bottom: -.25em;  /* Mueve subíndice ligeramente hacia abajo */
}

sup {
  top: -.5em;      /* Mueve superíndice más arriba que el subíndice */
}

/* ============================================= */
/* ESTILOS PARA ENLACES                          */
/* ============================================= */
a {
  color: #F9A392;           /* Color principal de enlaces (rosa claro) */
  text-decoration: none;    /* Elimina subrayado por defecto */
  background-color: transparent; /* Fondo transparente */
}

a:hover {
  color: #f56649;           /* Color más oscuro al pasar mouse */
  text-decoration: underline; /* Subrayado en hover */
}

/* Enlaces sin href ni clase (para casos especiales) */
a:not([href]):not([class]) {
  color: inherit;           /* Hereda color del elemento padre */
  text-decoration: none;    /* Sin subrayado */
}

a:not([href]):not([class]):hover {
  color: inherit;           /* Mantiene color heredado en hover */
  text-decoration: none;    /* Sin subrayado en hover */
}

/* ============================================= */
/* ESTILOS PARA CÓDIGO Y PREFORMATEADO           */
/* ============================================= */
pre,
code,
kbd,
samp {
  font-family: SFMono-Regular, Menlo, Monaco, Consolas, "Liberation Mono", "Courier New", monospace; /* Fuente monoespaciada */
  font-size: 1em;          /* Tamaño de fuente normal */
}

pre {
  margin-top: 0;           /* Elimina margen superior */
  margin-bottom: 1rem;     /* Margen inferior estándar */
  overflow: auto;          /* Añade scroll si el contenido es muy largo */
  -ms-overflow-style: scrollbar; /* Estilo de scroll para IE/Edge */
}

/* ============================================= */
/* ESTILOS PARA MEDIA Y TABLAS                   */
/* ============================================= */
figure {
  margin: 0 0 1rem;       /* Margen inferior estándar para figuras */
}

img {
  vertical-align: middle; /* Alineación vertical centrada */
  border-style: none;     /* Elimina borde por defecto en imágenes */
}

svg {
  overflow: hidden;       /* Oculta contenido que sobresalga */
  vertical-align: middle; /* Alineación vertical centrada */
}

table {
  border-collapse: collapse; /* Une bordes de celdas adyacentes */
}

caption {
  padding-top: 0.75rem;   /* Espaciado interno superior */
  padding-bottom: 0.75rem; /* Espaciado interno inferior */
  color: #6c757d;         /* Color gris para texto */
  text-align: left;       /* Alineación izquierda */
  caption-side: bottom;   /* Posición debajo de la tabla */
}

th {
  text-align: inherit;    /* Hereda alineación del contenedor */
  text-align: -webkit-match-parent; /* Soporte para Safari */
}

/* ============================================= */
/* ESTILOS PARA FORMULARIOS                      */
/* ============================================= */
label {
  display: inline-block;  /* Permite márgenes y alineación */
  margin-bottom: 0.5rem;  /* Espaciado inferior estándar */
}

button {
  border-radius: 0;       /* Elimina bordes redondeados por defecto */
}

button:focus {
  outline: 1px dotted;    /* Contorno para enfoque (accesibilidad) */
  outline: 5px auto -webkit-focus-ring-color; /* Estilo para navegadores WebKit */
}

/* Normalización de elementos de formulario */
input,
button,
select,
optgroup,
textarea {
  margin: 0;              /* Elimina márgenes por defecto */
  font-family: inherit;   /* Hereda fuente del padre */
  font-size: inherit;     /* Hereda tamaño de fuente */
  line-height: inherit;   /* Hereda interlineado */
}

button,
input {
  overflow: visible;      /* Evita recorte de contenido */
}

button,
select {
  text-transform: none;  /* Evita transformación de texto automática */
}

[role="button"] {
  cursor: pointer;       /* Cambia cursor a mano para elementos con rol de botón */
}

select {
  word-wrap: normal;     /* Evita salto de palabras largas */
}

/* Estilos para botones en diferentes navegadores */
button,
[type="button"],
[type="reset"],
[type="submit"] {
  -webkit-appearance: button; /* Restaura apariencia nativa en WebKit */
}

/* Cursor para botones no deshabilitados */
button:not(:disabled),
[type="button"]:not(:disabled),
[type="reset"]:not(:disabled),
[type="submit"]:not(:disabled) {
  cursor: pointer;       /* Cursor en forma de mano */
}

/* ============================================= */
/* ESTILOS ESPECÍFICOS PARA NAVEGADORES MOZILLA  */
/* ============================================= */
/* Elimina padding y bordes internos en botones de Firefox */
button::-moz-focus-inner,
[type="button"]::-moz-focus-inner,
[type="reset"]::-moz-focus-inner,
[type="submit"]::-moz-focus-inner {
  padding: 0;
  border-style: none;
}

/* ============================================= */
/* ESTILOS PARA ELEMENTOS DE FORMULARIO          */
/* ============================================= */
/* Radio buttons y checkboxes */
input[type="radio"],
input[type="checkbox"] {
  box-sizing: border-box; /* Modelo de caja consistente */
  padding: 0;            /* Elimina padding por defecto */
}

/* Áreas de texto */
textarea {
  overflow: auto;    /* Scroll solo cuando sea necesario */
  resize: vertical;  /* Permite solo redimensionamiento vertical */
}

/* Grupos de campos */
fieldset {
  min-width: 0;     /* Evita problemas de tamaño mínimo */
  padding: 0;       /* Elimina padding por defecto */
  margin: 0;        /* Elimina margen por defecto */
  border: 0;        /* Elimina borde por defecto */
}

/* Leyendas para fieldset */
legend {
  display: block;
  width: 100%;
  max-width: 100%;
  padding: 0;
  margin-bottom: .5rem;
  font-size: 1.5rem;
  line-height: inherit;
  color: inherit;
  white-space: normal;
}

/* Barra de progreso */
progress {
  vertical-align: baseline; /* Alineación consistente */
}

/* Inputs numéricos - Chrome/Safari */
[type="number"]::-webkit-inner-spin-button,
[type="number"]::-webkit-outer-spin-button {
  height: auto; /* Ajuste de altura para flechas */
}

/* Inputs de búsqueda */
[type="search"] {
  outline-offset: -2px;     /* Ajuste de foco */
  -webkit-appearance: none; /* Elimina estilos nativos */
}

[type="search"]::-webkit-search-decoration {
  -webkit-appearance: none; /* Elimina decoración en Chrome */
}

/* Botones de subida de archivos */
::-webkit-file-upload-button {
  font: inherit;           /* Hereda fuentes */
  -webkit-appearance: button; /* Estilo consistente */
}

/* Elemento output para resultados */
output {
  display: inline-block;
}

/* Resumen para detalles */
summary {
  display: list-item; /* Compatibilidad con navegadores */
  cursor: pointer;    /* Cursor tipo mano */
}

/* Elemento template (oculto por defecto) */
template {
  display: none;
}

/* Atributo hidden */
[hidden] {
  display: none !important;
}

/* ============================================= */
/* TIPOGRAFÍA Y TEXTOS                           */
/* ============================================= */
/* Encabezados y clases equivalentes */
h1, h2, h3, h4, h5, h6,
.h1, .h2, .h3, .h4, .h5, .h6 {
  margin-bottom: 0.5rem;
  font-weight: 500;
  line-height: 1.2;
  color: #211E1C;
}

/* Tamaños responsivos para encabezados */
h1, .h1 { font-size: 2.5rem; }
h2, .h2 { font-size: 2rem; }
h3, .h3 { font-size: 1.75rem; }
h4, .h4 { font-size: 1.5rem; }
h5, .h5 { font-size: 1.25rem; }
h6, .h6 { font-size: 1rem; }

/* Media queries para tamaños responsivos */
@media (max-width: 1200px) {
  h1, .h1 { font-size: calc(1.375rem + 1.5vw); }
  h2, .h2 { font-size: calc(1.325rem + 0.9vw); }
  h3, .h3 { font-size: calc(1.3rem + 0.6vw); }
  h4, .h4 { font-size: calc(1.275rem + 0.3vw); }
  legend { font-size: calc(1.275rem + 0.3vw); }
}

/* Texto destacado */
.lead {
  font-size: 1.25rem;
  font-weight: 300;
}

/* Clases display para textos grandes */
.display-1 { font-size: 6rem; }
.display-2 { font-size: 5.5rem; }
.display-3 { font-size: 4.5rem; }
.display-4 { font-size: 3.5rem; }

/* Media queries para displays responsivos */
@media (max-width: 1200px) {
  .display-1 { font-size: calc(1.725rem + 5.7vw); }
  .display-2 { font-size: calc(1.675rem + 5.1vw); }
  .display-3 { font-size: calc(1.575rem + 3.9vw); }
  .display-4 { font-size: calc(1.475rem + 2.7vw); }
}

/* Separador horizontal */
hr {
  margin-top: 1rem;
  margin-bottom: 1rem;
  border: 0;
  border-top: 1px solid rgba(0, 0, 0, 0.1);
}

/* Texto pequeño */
small, .small {
  font-size: 80%;
  font-weight: 400;
}

/* Texto resaltado */
mark, .mark {
  padding: 0.2em;
  background-color: #fcf8e3;
}

/* ============================================= */
/* LISTAS                                        */
/* ============================================= */
/* Listas sin viñetas */
.list-unstyled {
  padding-left: 0;
  list-style: none;
}

/* Listas en línea */
.list-inline {
  padding-left: 0;
  list-style: none;
}

.list-inline-item {
  display: inline-block;
}

.list-inline-item:not(:last-child) {
  margin-right: 0.5rem;
}

/* Abreviaturas estilizadas */
.initialism {
  font-size: 90%;
  text-transform: uppercase;
}

/* ============================================= */
/* CITAS Y BLOQUES DE TEXTO                      */
/* ============================================= */
.blockquote {
  margin-bottom: 1rem;
  font-size: 1.25rem;
}

.blockquote-footer {
  display: block;
  font-size: 80%;
  color: #6c757d;
}

.blockquote-footer::before {
  content: "\2014\00A0"; /* Guión largo y espacio */
}

/* ============================================= */
/* IMÁGENES Y MEDIA                              */
/* ============================================= */
/* Imágenes responsivas */
.img-fluid {
  max-width: 100%;
  height: auto;
}

/* Miniaturas de imágenes */
.img-thumbnail {
  padding: 0.25rem;
  background-color: #fff;
  border: 1px solid #dee2e6;
  max-width: 100%;
  height: auto;
}

/* Figuras con caption */
.figure {
  display: inline-block;
}

.figure-img {
  margin-bottom: 0.5rem;
  line-height: 1;
}

.figure-caption {
  font-size: 90%;
  color: #6c757d;
}

/* ============================================= */
/* CÓDIGO Y PREFORMATEADO                        */
/* ============================================= */
code {
  font-size: 87.5%;
  color: #e83e8c;
  word-wrap: break-word;
}

a > code {
  color: inherit;
}

/* Teclas/keyboard */
kbd {
  padding: 0.2rem 0.4rem;
  font-size: 87.5%;
  color: #fff;
  background-color: #212529;
}

kbd kbd {
  padding: 0;
  font-size: 100%;
  font-weight: 700;
}

/* Bloques de código */
pre {
  display: block;
  font-size: 87.5%;
  color: #212529;
}

pre code {
  font-size: inherit;
  color: inherit;
  word-break: normal;
}

.pre-scrollable {
  max-height: 340px;
  overflow-y: scroll;
}

/* ============================================= */
/* SISTEMA DE GRID (LAYOUT)                      */
/* ============================================= */
/* Contenedores responsivos */
.container,
.container-fluid,
.container-sm,
.container-md,
.container-lg,
.container-xl {
  width: 100%;
  padding-right: 15px;
  padding-left: 15px;
  margin-right: auto;
  margin-left: auto;
}

/* Media queries para contenedores */
@media (min-width: 576px) { .container, .container-sm { max-width: 540px; } }
@media (min-width: 768px) { .container, .container-sm, .container-md { max-width: 720px; } }
@media (min-width: 992px) { .container, .container-sm, .container-md, .container-lg { max-width: 960px; } }
@media (min-width: 1200px) { .container, .container-sm, .container-md, .container-lg, .container-xl { max-width: 1140px; } }

/* Sistema de filas y columnas */
.row {
  display: flex;
  flex-wrap: wrap;
  margin-right: -15px;
  margin-left: -15px;
}

/* Columnas sin gutter */
.no-gutters {
  margin-right: 0;
  margin-left: 0;
}

.no-gutters > .col,
.no-gutters > [class*="col-"] {
  padding-right: 0;
  padding-left: 0;
}

/* Clases base para columnas */
.col-1, .col-2, .col-3, .col-4, .col-5, .col-6, .col-7, .col-8, .col-9, .col-10, .col-11, .col-12, .col,
.col-auto, .col-sm-1, .col-sm-2, .col-sm-3, .col-sm-4, .col-sm-5, .col-sm-6, .col-sm-7, .col-sm-8, .col-sm-9, .col-sm-10, .col-sm-11, .col-sm-12, .col-sm,
.col-sm-auto, .col-md-1, .col-md-2, .col-md-3, .col-md-4, .col-md-5, .col-md-6, .col-md-7, .col-md-8, .col-md-9, .col-md-10, .col-md-11, .col-md-12, .col-md,
.col-md-auto, .col-lg-1, .col-lg-2, .col-lg-3, .col-lg-4, .col-lg-5, .col-lg-6, .col-lg-7, .col-lg-8, .col-lg-9, .col-lg-10, .col-lg-11, .col-lg-12, .col-lg,
.col-lg-auto, .col-xl-1, .col-xl-2, .col-xl-3, .col-xl-4, .col-xl-5, .col-xl-6, .col-xl-7, .col-xl-8, .col-xl-9, .col-xl-10, .col-xl-11, .col-xl-12, .col-xl,
.col-xl-auto {
  position: relative;
  width: 100%;
  padding-right: 15px;
  padding-left: 15px;
}

/* Columnas flexibles */
.col {
  flex-basis: 0;
  flex-grow: 1;
  max-width: 100%;
}

/* Sistema de columnas por cantidad */
.row-cols-1 > * { flex: 0 0 100%; max-width: 100%; }
.row-cols-2 > * { flex: 0 0 50%; max-width: 50%; }
.row-cols-3 > * { flex: 0 0 33.33333%; max-width: 33.33333%; }
.row-cols-4 > * { flex: 0 0 25%; max-width: 25%; }
.row-cols-5 > * { flex: 0 0 20%; max-width: 20%; }
.row-cols-6 > * { flex: 0 0 16.66667%; max-width: 16.66667%; }

/* Columnas específicas */
.col-auto { flex: 0 0 auto; width: auto; max-width: 100%; }
.col-1 { flex: 0 0 8.33333%; max-width: 8.33333%; }
.col-2 { flex: 0 0 16.66667%; max-width: 16.66667%; }
.col-3 { flex: 0 0 25%; max-width: 25%; }
.col-4 { flex: 0 0 33.33333%; max-width: 33.33333%; }
.col-5 { flex: 0 0 41.66667%; max-width: 41.66667%; }
.col-6 { flex: 0 0 50%; max-width: 50%; }
.col-7 { flex: 0 0 58.33333%; max-width: 58.33333%; }
.col-8 { flex: 0 0 66.66667%; max-width: 66.66667%; }
.col-9 { flex: 0 0 75%; max-width: 75%; }
.col-10 { flex: 0 0 83.33333%; max-width: 83.33333%; }
.col-11 { flex: 0 0 91.66667%; max-width: 91.66667%; }
.col-12 { flex: 0 0 100%; max-width: 100%; }

/* ============================================= */
/* CLASES DE ORDEN PARA FLEXBOX                   */
/* ============================================= */
/* Controla el orden de visualización de elementos flex */
.order-first {
  order: -1; /* Coloca el elemento al principio */
}

.order-last {
  order: 13; /* Coloca el elemento al final (asumiendo máximo 12 columnas) */
}

.order-0 {
  order: 0; /* Orden por defecto */
}

.order-1 { order: 1; } /* Diferentes niveles de orden */
.order-2 { order: 2; }
.order-3 { order: 3; }
.order-4 { order: 4; }
.order-5 { order: 5; }
.order-6 { order: 6; }
.order-7 { order: 7; }
.order-8 { order: 8; }
.order-9 { order: 9; }
.order-10 { order: 10; }
.order-11 { order: 11; }
.order-12 { order: 12; }

/* ============================================= */
/* OFFSETS PARA COLUMNAS                         */
/* ============================================= */
/* Desplaza columnas a la derecha */
.offset-1 {
  margin-left: 8.33333%; /* 1 columna de desplazamiento */
}

.offset-2 {
  margin-left: 16.66667%; /* 2 columnas */
}

.offset-3 { margin-left: 25%; } /* 3 columnas */
.offset-4 { margin-left: 33.33333%; }
.offset-5 { margin-left: 41.66667%; }
.offset-6 { margin-left: 50%; }
.offset-7 { margin-left: 58.33333%; }
.offset-8 { margin-left: 66.66667%; }
.offset-9 { margin-left: 75%; }
.offset-10 { margin-left: 83.33333%; }
.offset-11 { margin-left: 91.66667%; }

/* ============================================= */
/* RESPONSIVE - PANTALLAS PEQUEÑAS (≥576px)      */
/* ============================================= */
@media (min-width: 576px) {
  /* Columnas flexibles genéricas */
  .col-sm {
    flex-basis: 0;
    flex-grow: 1;
    max-width: 100%;
  }
  
  /* Sistema de columnas por cantidad */
  .row-cols-sm-1 > * { flex: 0 0 100%; max-width: 100%; }
  .row-cols-sm-2 > * { flex: 0 0 50%; max-width: 50%; }
  .row-cols-sm-3 > * { flex: 0 0 33.33333%; max-width: 33.33333%; }
  .row-cols-sm-4 > * { flex: 0 0 25%; max-width: 25%; }
  .row-cols-sm-5 > * { flex: 0 0 20%; max-width: 20%; }
  .row-cols-sm-6 > * { flex: 0 0 16.66667%; max-width: 16.66667%; }
  
  /* Columnas específicas */
  .col-sm-auto { flex: 0 0 auto; width: auto; max-width: 100%; }
  .col-sm-1 { flex: 0 0 8.33333%; max-width: 8.33333%; }
  .col-sm-2 { flex: 0 0 16.66667%; max-width: 16.66667%; }
  .col-sm-3 { flex: 0 0 25%; max-width: 25%; }
  .col-sm-4 { flex: 0 0 33.33333%; max-width: 33.33333%; }
  .col-sm-5 { flex: 0 0 41.66667%; max-width: 41.66667%; }
  .col-sm-6 { flex: 0 0 50%; max-width: 50%; }
  .col-sm-7 { flex: 0 0 58.33333%; max-width: 58.33333%; }
  .col-sm-8 { flex: 0 0 66.66667%; max-width: 66.66667%; }
  .col-sm-9 { flex: 0 0 75%; max-width: 75%; }
  .col-sm-10 { flex: 0 0 83.33333%; max-width: 83.33333%; }
  .col-sm-11 { flex: 0 0 91.66667%; max-width: 91.66667%; }
  .col-sm-12 { flex: 0 0 100%; max-width: 100%; }
  
  /* Órdenes responsive */
  .order-sm-first { order: -1; }
  .order-sm-last { order: 13; }
  .order-sm-0 { order: 0; }
  .order-sm-1 { order: 1; }
  .order-sm-2 { order: 2; }
  .order-sm-3 { order: 3; }
  .order-sm-4 { order: 4; }
  .order-sm-5 { order: 5; }
  .order-sm-6 { order: 6; }
  .order-sm-7 { order: 7; }
  .order-sm-8 { order: 8; }
  .order-sm-9 { order: 9; }
  .order-sm-10 { order: 10; }
  .order-sm-11 { order: 11; }
  .order-sm-12 { order: 12; }
  
  /* Offsets responsive */
  .offset-sm-0 { margin-left: 0; }
  .offset-sm-1 { margin-left: 8.33333%; }
  .offset-sm-2 { margin-left: 16.66667%; }
  .offset-sm-3 { margin-left: 25%; }
  .offset-sm-4 { margin-left: 33.33333%; }
  .offset-sm-5 { margin-left: 41.66667%; }
  .offset-sm-6 { margin-left: 50%; }
  .offset-sm-7 { margin-left: 58.33333%; }
  .offset-sm-8 { margin-left: 66.66667%; }
  .offset-sm-9 { margin-left: 75%; }
  .offset-sm-10 { margin-left: 83.33333%; }
  .offset-sm-11 { margin-left: 91.66667%; }
}

/* ============================================= */
/* RESPONSIVE - PANTALLAS MEDIANAS (≥768px)      */
/* ============================================= */
@media (min-width: 768px) {
  /* Columnas flexibles genéricas */
  .col-md {
    flex-basis: 0;
    flex-grow: 1;
    max-width: 100%;
  }
  
  /* Sistema de columnas por cantidad */
  .row-cols-md-1 > * { flex: 0 0 100%; max-width: 100%; }
  .row-cols-md-2 > * { flex: 0 0 50%; max-width: 50%; }
  .row-cols-md-3 > * { flex: 0 0 33.33333%; max-width: 33.33333%; }
  .row-cols-md-4 > * { flex: 0 0 25%; max-width: 25%; }
  .row-cols-md-5 > * { flex: 0 0 20%; max-width: 20%; }
  .row-cols-md-6 > * { flex: 0 0 16.66667%; max-width: 16.66667%; }
  
  /* Columnas específicas */
  .col-md-auto { flex: 0 0 auto; width: auto; max-width: 100%; }
  .col-md-1 { flex: 0 0 8.33333%; max-width: 8.33333%; }
  .col-md-2 { flex: 0 0 16.66667%; max-width: 16.66667%; }
  .col-md-3 { flex: 0 0 25%; max-width: 25%; }
  .col-md-4 { flex: 0 0 33.33333%; max-width: 33.33333%; }
  .col-md-5 { flex: 0 0 41.66667%; max-width: 41.66667%; }
  .col-md-6 { flex: 0 0 50%; max-width: 50%; }
  .col-md-7 { flex: 0 0 58.33333%; max-width: 58.33333%; }
  .col-md-8 { flex: 0 0 66.66667%; max-width: 66.66667%; }
  .col-md-9 { flex: 0 0 75%; max-width: 75%; }
  .col-md-10 { flex: 0 0 83.33333%; max-width: 83.33333%; }
  .col-md-11 { flex: 0 0 91.66667%; max-width: 91.66667%; }
  .col-md-12 { flex: 0 0 100%; max-width: 100%; }
  
  /* Órdenes responsive */
  .order-md-first { order: -1; }
  .order-md-last { order: 13; }
  .order-md-0 { order: 0; }
  .order-md-1 { order: 1; }
  .order-md-2 { order: 2; }
  .order-md-3 { order: 3; }
  .order-md-4 { order: 4; }
  .order-md-5 { order: 5; }
  .order-md-6 { order: 6; }
  .order-md-7 { order: 7; }
  .order-md-8 { order: 8; }
  .order-md-9 { order: 9; }
  .order-md-10 { order: 10; }
  .order-md-11 { order: 11; }
  .order-md-12 { order: 12; }
  
  /* Offsets responsive */
  .offset-md-0 { margin-left: 0; }
  .offset-md-1 { margin-left: 8.33333%; }
  .offset-md-2 { margin-left: 16.66667%; }
  .offset-md-3 { margin-left: 25%; }
  .offset-md-4 { margin-left: 33.33333%; }
  .offset-md-5 { margin-left: 41.66667%; }
  .offset-md-6 { margin-left: 50%; }
  .offset-md-7 { margin-left: 58.33333%; }
  .offset-md-8 { margin-left: 66.66667%; }
  .offset-md-9 { margin-left: 75%; }
  .offset-md-10 { margin-left: 83.33333%; }
  .offset-md-11 { margin-left: 91.66667%; }
}
/* Media query para pantallas grandes (≥992px) */
@media (min-width: 992px) {
  /* 
   * COLUMNAS FLEXIBLES
   * .col-lg - Columna que crece automáticamente para ocupar espacio disponible
   */
  .col-lg {
    flex-basis: 0;        /* Ancho inicial 0 */
    flex-grow: 1;         /* Permite que crezca */
    max-width: 100%;      /* Ancho máximo */
  }

  /* 
   * CONTROL DE COLUMNAS POR FILA
   * Define cuántas columnas mostrar en una fila
   */
  .row-cols-lg-1 > * { flex: 0 0 100%; max-width: 100%; }        /* 1 columna/fila */
  .row-cols-lg-2 > * { flex: 0 0 50%; max-width: 50%; }          /* 2 columnas/fila */
  .row-cols-lg-3 > * { flex: 0 0 33.33333%; max-width: 33.33333%; } /* 3 columnas/fila */
  .row-cols-lg-4 > * { flex: 0 0 25%; max-width: 25%; }          /* 4 columnas/fila */
  .row-cols-lg-5 > * { flex: 0 0 20%; max-width: 20%; }          /* 5 columnas/fila */
  .row-cols-lg-6 > * { flex: 0 0 16.66667%; max-width: 16.66667%; } /* 6 columnas/fila */

  /* 
   * COLUMNA AUTOMÁTICA
   * .col-lg-auto - Columna que toma el ancho según su contenido
   */
  .col-lg-auto {
    flex: 0 0 auto;       /* No crece ni se encoge */
    width: auto;          /* Ancho natural */
    max-width: 100%;      /* Límite máximo */
  }

  /* 
   * COLUMNAS ESPECÍFICAS
   * Sistema de 12 columnas con porcentajes precisos
   */
  .col-lg-1 { flex: 0 0 8.33333%; max-width: 8.33333%; }   /* 1/12 del ancho */
  .col-lg-2 { flex: 0 0 16.66667%; max-width: 16.66667%; } /* 2/12 del ancho */
  .col-lg-3 { flex: 0 0 25%; max-width: 25%; }             /* 3/12 (1/4) del ancho */
  .col-lg-4 { flex: 0 0 33.33333%; max-width: 33.33333%; } /* 4/12 (1/3) del ancho */
  /* ... continuan hasta col-lg-12 (100%) */

  /* 
   * ORDENAMIENTO
   * Permite cambiar el orden visual de elementos
   */
  .order-lg-first { order: -1; }  /* Primer lugar */
  .order-lg-last { order: 13; }   /* Último lugar */
  .order-lg-0 { order: 0; }       /* Orden por defecto */
  /* ... continuan hasta order-lg-12 */

  /* 
   * DESPLAZAMIENTOS (OFFSETS)
   * Mueve columnas a la derecha dejando espacio
   */
  .offset-lg-0 { margin-left: 0; }            /* Sin desplazamiento */
  .offset-lg-1 { margin-left: 8.33333%; }     /* Desplaza 1 columna */
  .offset-lg-2 { margin-left: 16.66667%; }    /* Desplaza 2 columnas */
  /* ... continuan hasta offset-lg-11 */
}

/* Media query para pantallas extra grandes (≥1200px) */
@media (min-width: 1200px) {
  /*
   * MISMA ESTRUCTURA QUE PARA lg PERO CON PREFIJO xl
   * Se aplican las mismas clases pero en breakpoint mayor
   */
  .col-xl {
    flex-basis: 0;
    flex-grow: 1;
    max-width: 100%;
}
  }
  .col-xl-2 {
    flex: 0 0 16.66667%;
    max-width: 16.66667%;
  }
  .col-xl-3 {
    flex: 0 0 25%;
    max-width: 25%;
  }
  .col-xl-4 {
    flex: 0 0 33.33333%;
    max-width: 33.33333%;
  }
  .col-xl-5 {
    flex: 0 0 41.66667%;
    max-width: 41.66667%;
  }
  .col-xl-6 {
    flex: 0 0 50%;
    max-width: 50%;
  }
  .col-xl-7 {
    flex: 0 0 58.33333%;
    max-width: 58.33333%;
  }
  .col-xl-8 {
    flex: 0 0 66.66667%;
    max-width: 66.66667%;
  }
  .col-xl-9 {
    flex: 0 0 75%;
    max-width: 75%;
  }
  .col-xl-10 {
    flex: 0 0 83.33333%;
    max-width: 83.33333%;
  }
  .col-xl-11 {
    flex: 0 0 91.66667%;
    max-width: 91.66667%;
  }
  .col-xl-12 {
    flex: 0 0 100%;
    max-width: 100%;
  }
 /* 
 * CLASES DE ORDEN PARA PANTALLAS EXTRA GRANDES (≥1200px)
 * Controlan el orden visual de los elementos en el contenedor flex
 */
.order-xl-first {
  order: -1;  /* Coloca el elemento en primer lugar (antes que los demás) */
}
.order-xl-last {
  order: 13;  /* Coloca el elemento en último lugar (después de order-12) */
}
.order-xl-0 {
  order: 0;   /* Orden por defecto (posición normal en el flujo) */
}
.order-xl-1 {
  order: 1;   /* Posición 1 en el ordenamiento */
}
.order-xl-2 {
  order: 2;   /* Posición 2 en el ordenamiento */
  }
  .order-xl-3 {
    order: 3;
  }
  .order-xl-4 {
    order: 4;
  }
  .order-xl-5 {
    order: 5;
  }
  .order-xl-6 {
    order: 6;
  }
  .order-xl-7 {
    order: 7;
  }
  .order-xl-8 {
    order: 8;
  }
  .order-xl-9 {
    order: 9;
  }
  .order-xl-10 {
    order: 10;
  }
  .order-xl-11 {
    order: 11;
  }
  .order-xl-12 {
    order: 12;  /* Posición 12 en el ordenamiento */
  }
  
  /* 
   * CLASES DE DESPLAZAMIENTO (OFFSET) PARA PANTALLAS EXTRA GRANDES
   * Mueven las columnas hacia la derecha dejando espacio a la izquierda
   */
  .offset-xl-0 {
    margin-left: 0;            /* Sin desplazamiento - posición normal */
  }
  .offset-xl-1 {
    margin-left: 8.33333%;     /* Desplaza 1 columna del grid (1/12) */
  }
  .offset-xl-2 {
    margin-left: 16.66667%;    /* Desplaza 2 columnas del grid (2/12) */
  }
  .offset-xl-3 {
    margin-left: 25%;          /* Desplaza 3 columnas del grid (3/12) */
  }
  .offset-xl-4 {
    margin-left: 33.33333%;
  }
  .offset-xl-5 {
    margin-left: 41.66667%;
  }
  .offset-xl-6 {
    margin-left: 50%;
  }
  .offset-xl-7 {
    margin-left: 58.33333%;
  }
  .offset-xl-8 {
    margin-left: 66.66667%;
  }
  .offset-xl-9 {
    margin-left: 75%;
  }
  .offset-xl-10 {
    margin-left: 83.33333%;
  }
  .offset-xl-11 {
    margin-left: 91.66667%;
  }


/* Estilo base para todas las tablas */
.table {
  width: 100%;                /* Ocupa el 100% del ancho disponible */
  margin-bottom: 1rem;        /* Margen inferior de 1 rem (16px) */
  color: #757575;             /* Color de texto gris medio */
}

/* Estilo para celdas (th y td) */
.table th,
.table td {
  padding: 0.75rem;           /* Espaciado interno de 12px */
  vertical-align: top;        /* Alineación vertical superior */
  border-top: 1px solid #dee2e6; /* Borde superior gris claro */
}

/* Estilo para encabezados de tabla */
.table thead th {
  vertical-align: bottom;     /* Alineación vertical inferior */
  border-bottom: 2px solid #dee2e6; /* Borde inferior más grueso */
}

/* Separador entre cuerpos de tabla */
.table tbody + tbody {
  border-top: 2px solid #dee2e6; /* Borde superior grueso entre tbody */
}

/* Tabla pequeña (menos padding) */
.table-sm th,
.table-sm td {
  padding: 0.3rem;           /* Espaciado interno reducido */
}

/* Tabla con bordes */
.table-bordered {
  border: 1px solid #dee2e6; /* Borde exterior */
}
.table-bordered th,
.table-bordered td {
  border: 1px solid #dee2e6; /* Bordes en todas las celdas */
}
.table-bordered thead th,
.table-bordered thead td {
  border-bottom-width: 2px;  /* Borde inferior más grueso en encabezados */
}

/* Tabla sin bordes */
.table-borderless th,
.table-borderless td,
.table-borderless thead th,
.table-borderless tbody + tbody {
  border: 0;                 /* Elimina todos los bordes */
}

/* Tabla con franjas (zebra striping) */
.table-striped tbody tr:nth-of-type(odd) {
  background-color: rgba(0, 0, 0, 0.05); /* Fondo gris claro para filas impares */
}

/* Efecto hover para filas */
.table-hover tbody tr:hover {
  color: #757575;
  background-color: rgba(0, 0, 0, 0.075); /* Fondo ligeramente más oscuro al pasar mouse */
}

/* ============================================= */
/* VARIANTES DE COLOR PARA TABLAS                */
/* ============================================= */

/* Estilo primary (tono rosa claro) */
.table-primary,
.table-primary > th,
.table-primary > td {
  background-color: #fde5e0; /* Fondo rosa muy claro */
}
.table-primary th,
.table-primary td,
.table-primary thead th {
  border-color: #fccfc6;     /* Bordes rosa claro */
}

/* Estilo secondary (tono azul claro) */
.table-secondary,
.table-secondary > th,
.table-secondary > td {
  background-color: #d6ecfc; /* Fondo azul claro */
}
/* ... (otros estilos de variantes siguen el mismo patrón) */

/* ============================================= */
/* ESTILOS ESPECIALES PARA ENCABEZADOS           */
/* ============================================= */

/* Encabezado oscuro */
.table .thead-dark th {
  color: #fff;               /* Texto blanco */
  background-color: #343a40; /* Fondo oscuro */
  border-color: #454d55;     /* Bordes más oscuros */
}

/* Encabezado claro */
.table .thead-light th {
  color: #495057;            /* Texto gris oscuro */
  background-color: #e9ecef; /* Fondo gris claro */
  border-color: #dee2e6;     /* Bordes grises */
}

/* ============================================= */
/* TABLA OSCURA (modo oscuro)                    */
/* ============================================= */
.table-dark {
  color: #fff;               /* Texto blanco */
  background-color: #343a40; /* Fondo oscuro */
}
.table-dark th,
.table-dark td {
  border-color: #454d55;     /* Bordes más oscuros */
}

/* Efectos especiales para tabla oscura */
.table-dark.table-striped tbody tr:nth-of-type(odd) {
  background-color: rgba(255, 255, 255, 0.05); /* Franjas oscuras */
}
.table-dark.table-hover tbody tr:hover {
  background-color: rgba(255, 255, 255, 0.075); /* Hover oscuro */
}

/* ============================================= */
/* RESPONSIVIDAD PARA DISPOSITIVOS PEQUEÑOS      */
/* ============================================= */
@media (max-width: 575.98px) {
  .table-responsive-sm {
    display: block;
    width: 100%;
    overflow-x: auto;        /* Permite scroll horizontal */
    -webkit-overflow-scrolling: touch; /* Scroll suave en iOS */
  }
  .table-responsive-sm > .table-bordered {
    border: 0;               /* Elimina bordes en modo responsive */
  }
}

/* ============================================= */
/* TABLAS RESPONSIVAS - MEDIUM (≥768px) */
/* ============================================= */
@media (max-width: 767.98px) {
  .table-responsive-md {
    display: block; /* Cambia a bloque para permitir scroll horizontal */
    width: 100%; /* Ocupa todo el ancho disponible */
    overflow-x: auto; /* Habilita scroll horizontal cuando sea necesario */
    -webkit-overflow-scrolling: touch; /* Mejora el scroll en dispositivos iOS */
  }
  .table-responsive-md > .table-bordered {
    border: 0; /* Elimina bordes en tablas responsivas */
  }
}

/* ============================================= */
/* TABLAS RESPONSIVAS - LARGE (≥992px) */
/* ============================================= */
@media (max-width: 991.98px) {
  .table-responsive-lg {
    display: block;
    width: 100%;
    overflow-x: auto;
    -webkit-overflow-scrolling: touch;
  }
  .table-responsive-lg > .table-bordered {
    border: 0;
  }
}

/* ============================================= */
/* TABLAS RESPONSIVAS - XL (≥1200px) */
/* ============================================= */
@media (max-width: 1199.98px) {
  .table-responsive-xl {
    display: block;
    width: 100%;
    overflow-x: auto;
    -webkit-overflow-scrolling: touch;
  }
  .table-responsive-xl > .table-bordered {
    border: 0;
  }
}

/* ============================================= */
/* TABLA RESPONSIVA GENERAL */
/* ============================================= */
.table-responsive {
  display: block;
  width: 100%;
  overflow-x: auto;
  -webkit-overflow-scrolling: touch;
}

.table-responsive > .table-bordered {
  border: 0;
}

/* ============================================= */
/* ESTILOS BASE PARA CONTROLES DE FORMULARIO */
/* ============================================= */
.form-control {
  display: block; /* Hace que el control ocupe toda la línea */
  width: 100%; /* Ancho completo del contenedor */
  height: calc(1.5em + 0.75rem + 2px); /* Altura calculada dinámicamente */
  padding: 0.375rem 0.75rem; /* Relleno interno */
  font-size: 1rem; /* Tamaño de fuente base */
  font-weight: 400; /* Grosor de fuente normal */
  line-height: 1.5; /* Interlineado */
  color: #495057; /* Color de texto gris oscuro */
  background-color: #fff; /* Fondo blanco */
  background-clip: padding-box; /* Contiene el fondo dentro del padding */
  border: 1px solid #ced4da; /* Borde gris claro */
  border-radius: 0; /* Sin esquinas redondeadas */
  transition: border-color 0.15s ease-in-out, box-shadow 0.15s ease-in-out; /* Transición suave */
}

/* ============================================= */
/* ACCESIBILIDAD - REDUCCIÓN DE MOVIMIENTO */
/* ============================================= */
@media (prefers-reduced-motion: reduce) {
  .form-control {
    transition: none; /* Elimina transiciones para usuarios sensibles */
  }
}

/* ============================================= */
/* COMPATIBILIDAD CON NAVEGADORES */
/* ============================================= */
.form-control::-ms-expand { /* Estilo para IE */
  background-color: transparent;
  border: 0;
}

.form-control:-moz-focusring { /* Estilo para Firefox */
  color: transparent;
  text-shadow: 0 0 0 #495057;
}

/* ============================================= */
/* ESTADO DE FOCO (CUANDO SE SELECCIONA EL CAMPO) */
/* ============================================= */
.form-control:focus {
  color: #495057;
  background-color: #fff;
  border-color: white; /* Borde blanco */
  outline: 0; /* Elimina el outline por defecto */
  box-shadow: 0 0 0 0.2rem rgba(249, 163, 146, 0.25); /* Sombra rosa clara */
}

/* ============================================= */
/* ESTILO PARA TEXTO DE PLACEHOLDER */
/* ============================================= */
.form-control::placeholder {
  color: #6c757d; /* Color gris medio */
  opacity: 1; /* Asegura visibilidad */
}

/* ============================================= */
/* ESTADOS DESHABILITADO Y SOLO LECTURA */
/* ============================================= */
.form-control:disabled, .form-control[readonly] {
  background-color: #e9ecef; /* Fondo gris claro */
  opacity: 1; /* Asegura visibilidad */
}

/* ============================================= */
/* ============================================= */
/* ESTILO PARA SELECT EN FOCO (IE) */
/* ============================================= */
select.form-control:focus::-ms-value {
  color: #495057;
  background-color: #fff;
}

/* ============================================= */
/* CONTROLES DE ARCHIVO Y RANGO */
/* ============================================= */
.form-control-file,
.form-control-range {
  display: block;
  width: 100%;
}

/* ============================================= */
/* ETIQUETAS DE FORMULARIO */
/* ============================================= */
.col-form-label {
  padding-top: calc(0.375rem + 1px); /* Alineación vertical perfecta */
  padding-bottom: calc(0.375rem + 1px);
  margin-bottom: 0; /* Sin margen inferior */
  font-size: inherit; /* Hereda tamaño de fuente */
  line-height: 1.5; /* Interlineado estándar */
}

/* ETIQUETA GRANDE */
.col-form-label-lg {
  padding-top: calc(0.5rem + 1px);
  padding-bottom: calc(0.5rem + 1px);
  font-size: 1.25rem; /* Texto más grande */
  line-height: 1.5;
}

/* ETIQUETA PEQUEÑA */
.col-form-label-sm {
  padding-top: calc(0.25rem + 1px);
  padding-bottom: calc(0.25rem + 1px);
  font-size: 0.875rem; /* Texto más pequeño */
  line-height: 1.5;
}

/* ============================================= */
/* TEXTO PLANO EN FORMULARIOS */
/* ============================================= */
.form-control-plaintext {
  display: block;
  width: 100%;
  padding: 0.375rem 0; /* Solo padding vertical */
  margin-bottom: 0;
  font-size: 1rem;
  line-height: 1.5;
  color: #757575; /* Color gris medio */
  background-color: transparent; /* Sin fondo */
  border: solid transparent; /* Borde invisible */
  border-width: 1px 0; /* Mantiene estructura pero invisible */
}

/* AJUSTES PARA TAMAÑOS PEQUEÑO Y GRANDE */
.form-control-plaintext.form-control-sm, 
.form-control-plaintext.form-control-lg {
  padding-right: 0;
  padding-left: 0;
}

/* ============================================= */
/* VARIANTES DE TAMAÑO PARA CONTROLES */
/* ============================================= */

/* CONTROL PEQUEÑO */
.form-control-sm {
  height: calc(1.5em + 0.5rem + 2px); /* Altura reducida */
  padding: 0.25rem 0.5rem; /* Relleno reducido */
  font-size: 0.875rem; /* Texto más pequeño */
  line-height: 1.5;
}

/* CONTROL GRANDE */
.form-control-lg {
  height: calc(1.5em + 1rem + 2px); /* Altura aumentada */
  padding: 0.5rem 1rem; /* Relleno aumentado */
  font-size: 1.25rem; /* Texto más grande */
  line-height: 1.5;
}

/* ============================================= */
/* ESTILOS PARA SELECT MULTIPLE/TAMAÑO           */
/* ============================================= */
select.form-control[size], 
select.form-control[multiple] {
  height: auto; /* Altura automática para selects múltiples */
}

/* ============================================= */
/* TEXTAREA - ALTURA AUTOMÁTICA                  */
/* ============================================= */
textarea.form-control {
  height: auto; /* Permite que el textarea crezca con el contenido */
}

/* ============================================= */
/* GRUPOS DE FORMULARIOS                         */
/* ============================================= */
.form-group {
  margin-bottom: 1rem; /* Espaciado entre grupos de formularios */
}

/* ============================================= */
/* TEXTO DE AYUDA EN FORMULARIOS                 */
/* ============================================= */
.form-text {
  display: block; /* Muestra en bloque para ocupar línea completa */
  margin-top: 0.25rem; /* Pequeño margen superior */
}

/* ============================================= */
/* FILAS DE FORMULARIO COMPACTAS                 */
/* ============================================= */
.form-row {
  display: flex; /* Usa flexbox para alineación */
  flex-wrap: wrap; /* Permite envolver elementos */
  margin-right: -5px; /* Compensa el padding interno */
  margin-left: -5px;
}

.form-row > .col,
.form-row > [class*="col-"] {
  padding-right: 5px; /* Espaciado interno reducido */
  padding-left: 5px;
}

/* ============================================= */
/* CHECKBOXES Y RADIO BUTTONS                    */
/* ============================================= */
.form-check {
  position: relative; /* Para posicionamiento absoluto de inputs */
  display: block; /* Comportamiento de bloque */
  padding-left: 1.25rem; /* Espacio para el input */
}

.form-check-input {
  position: absolute; /* Posicionamiento preciso */
  margin-top: 0.3rem; /* Alineación vertical */
  margin-left: -1.25rem; /* Sale del flujo normal */
}

/* Estilo para etiquetas deshabilitadas */
.form-check-input[disabled] ~ .form-check-label,
.form-check-input:disabled ~ .form-check-label {
  color: #6c757d; /* Color gris para estado deshabilitado */
}

.form-check-label {
  margin-bottom: 0; /* Elimina margen inferior */
}

/* ============================================= */
/* CHECKBOXES/RADIOS EN LÍNEA                    */
/* ============================================= */
.form-check-inline {
  display: inline-flex; /* Muestra en línea con flexbox */
  align-items: center; /* Centra verticalmente */
  padding-left: 0; /* Elimina padding izquierdo */
  margin-right: 0.75rem; /* Espaciado entre elementos */
}

.form-check-inline .form-check-input {
  position: static; /* Vuelve al flujo normal */
  margin-top: 0;
  margin-right: 0.3125rem; /* Espaciado a la derecha */
  margin-left: 0;
}

/* ============================================= */
/* VALIDACIÓN - MENSAJES POSITIVOS               */
/* ============================================= */
.valid-feedback {
  display: none; /* Oculto por defecto */
  width: 100%; /* Ancho completo */
  margin-top: 0.25rem; /* Pequeño margen superior */
  font-size: 80%; /* Texto más pequeño */
  color: #28a745; /* Color verde */
}

.valid-tooltip {
  position: absolute; /* Posicionamiento absoluto */
  top: 100%; /* Debajo del elemento */
  left: 0;
  z-index: 5; /* Por encima de otros elementos */
  display: none; /* Oculto por defecto */
  max-width: 100%; /* Ancho máximo */
  padding: 0.25rem 0.5rem; /* Relleno interno */
  font-size: 0.875rem; /* Tamaño de texto */
  color: #fff; /* Texto blanco */
  background-color: rgba(40, 167, 69, 0.9); /* Fondo verde con transparencia */
}

/* Muestra feedback cuando es válido */
.was-validated :valid ~ .valid-feedback,
.was-validated :valid ~ .valid-tooltip,
.is-valid ~ .valid-feedback,
.is-valid ~ .valid-tooltip {
  display: block;
}

/* Estilo para controles válidos */
.was-validated .form-control:valid, 
.form-control.is-valid {
  border-color: #28a745; /* Borde verde */
  padding-right: calc(1.5em + 0.75rem); /* Espacio para ícono */
  /* Ícono de check SVG */
  background-image: url("data:image/svg+xml,%3csvg...");
  background-repeat: no-repeat;
  background-position: right calc(0.375em + 0.1875rem) center;
  background-size: calc(0.75em + 0.375rem) calc(0.75em + 0.375rem);
}

/* Efecto focus para controles válidos */
.was-validated .form-control:valid:focus, 
.form-control.is-valid:focus {
  border-color: #28a745;
  box-shadow: 0 0 0 0.2rem rgba(40, 167, 69, 0.25); /* Sombra verde */
}

/* ============================================= */
/* VALIDACIÓN - MENSAJES NEGATIVOS               */
/* ============================================= */
.invalid-feedback {
  display: none; /* Oculto por defecto */
  width: 100%;
  margin-top: 0.25rem;
  font-size: 80%;
  color: #dc3545; /* Color rojo */
}

.invalid-tooltip {
  position: absolute;
  top: 100%;
  left: 0;
  z-index: 5;
  display: none;
  max-width: 100%;
  padding: 0.25rem 0.5rem;
  font-size: 0.875rem;
  color: #fff;
  background-color: rgba(220, 53, 69, 0.9); /* Fondo rojo con transparencia */
}

/* Muestra feedback cuando es inválido */
.was-validated :invalid ~ .invalid-feedback,
.was-validated :invalid ~ .invalid-tooltip,
.is-invalid ~ .invalid-feedback,
.is-invalid ~ .invalid-tooltip {
  display: block;
}

/* Estilo para controles inválidos */
.was-validated .form-control:invalid, 
.form-control.is-invalid {
  border-color: #dc3545; /* Borde rojo */
  padding-right: calc(1.5em + 0.75rem); /* Espacio para ícono */
  /* Ícono de error SVG */
  background-image: url("data:image/svg+xml,%3csvg...");
  background-repeat: no-repeat;
  background-position: right calc(0.375em + 0.1875rem) center;
  background-size: calc(0.75em + 0.375rem) calc(0.75em + 0.375rem);
}

/* Efecto focus para controles inválidos */
.was-validated .form-control:invalid:focus, 
.form-control.is-invalid:focus {
  border-color: #dc3545;
  box-shadow: 0 0 0 0.2rem rgba(220, 53, 69, 0.25); /* Sombra roja */
}

/* Contenedor principal para formularios en línea */
.form-inline {
  display: flex;            /* Activa el modelo de caja flexible */
  flex-flow: row wrap;      /* Elementos en fila con wrap (ajustan en varias líneas si no caben) */
  align-items: center;      /* Centra verticalmente todos los elementos hijos */
}

/* Casillas de verificación/radio en formularios en línea (versión móvil) */
.form-inline .form-check {
  width: 100%;             /* Ocupa todo el ancho en dispositivos pequeños */
}

/* Media query para pantallas medianas (≥576px) */
@media (min-width: 576px) {
  /* Estilos para etiquetas */
  .form-inline label {
    display: flex;          /* Usa flexbox para mejor alineación */
    align-items: center;    /* Centra verticalmente */
    justify-content: center; /* Centra horizontalmente */
    margin-bottom: 0;       /* Elimina margen inferior */
  }
  
  /* Grupos de formulario */
  .form-inline .form-group {
    display: flex;          /* Layout flexible */
    flex: 0 0 auto;        /* No crece ni se reduce - tamaño natural */
    flex-flow: row wrap;    /* Elementos en fila con wrap */
    align-items: center;    /* Centrado vertical */
    margin-bottom: 0;       /* Sin margen inferior */
  }
  
  /* Campos de formulario estándar */
  .form-inline .form-control {
    display: inline-block;  /* Muestra en línea */
    width: auto;           /* Ancho según contenido */
    vertical-align: middle; /* Alineación vertical media */
  }
  
  /* Texto plano en formularios */
  .form-inline .form-control-plaintext {
    display: inline-block;  /* Muestra en línea */
  }
  
  /* Grupos de inputs y selects personalizados */
  .form-inline .input-group,
  .form-inline .custom-select {
    width: auto;           /* Ancho automático */
  }
  
  /* Casillas de verificación/radio (versión desktop) */
  .form-inline .form-check {
    display: flex;          /* Flexbox para alineación */
    align-items: center;    /* Centrado vertical */
    justify-content: center; /* Centrado horizontal */
    width: auto;           /* Ancho según contenido */
    padding-left: 0;       /* Elimina padding izquierdo */
  }
  
  /* Inputs de casillas de verificación/radio */
  .form-inline .form-check-input {
    position: relative;     /* Posicionamiento relativo */
    flex-shrink: 0;        /* Evita que se reduzca */
    margin-top: 0;         /* Elimina margen superior */
    margin-right: 0.25rem; /* Margen derecho pequeño */
    margin-left: 0;        /* Sin margen izquierdo */
  }
  
  /* Controles personalizados (custom checkboxes/radios) */
  .form-inline .custom-control {
    align-items: center;    /* Centrado vertical */
    justify-content: center; /* Centrado horizontal */
  }
  
  /* Etiquetas de controles personalizados */
  .form-inline .custom-control-label {
    margin-bottom: 0;      /* Elimina margen inferior */
  }
}
/* ============ ESTILO BASE PARA TODOS LOS BOTONES ============ */
.btn {
  display: inline-block;      /* Hace que el botón ocupe solo su espacio necesario */
  font-weight: 400;          /* Texto normal (no negrita) */
  color: #757575;            /* Color de texto gris medio */
  text-align: center;        /* Centra el texto horizontalmente */
  vertical-align: middle;    /* Alinea verticalmente con elementos adyacentes */
  user-select: none;         /* Evita que el texto del botón sea seleccionable */
  background-color: transparent; /* Fondo transparente por defecto */
  border: 1px solid transparent; /* Borde transparente por defecto */
  padding: 0.375rem 0.75rem; /* Relleno interno (6px arriba/abajo, 12px izquierda/derecha) */
  font-size: 1rem;           /* Tamaño de fuente base (16px normalmente) */
  line-height: 1.5;          /* Espaciado entre líneas */
  border-radius: 0;          /* Elimina bordes redondeados */
  /* Transiciones suaves para efectos visuales */
  transition: color 0.15s ease-in-out, 
              background-color 0.15s ease-in-out, 
              border-color 0.15s ease-in-out, 
              box-shadow 0.15s ease-in-out;
}

/* ============ ACCESIBILIDAD - REDUCCIÓN DE MOVIMIENTO ============ */
@media (prefers-reduced-motion: reduce) {
  .btn {
    transition: none;       /* Elimina animaciones para usuarios sensibles */
  }
}

/* ============ ESTADOS INTERACTIVOS ============ */
.btn:hover {
  color: #757575;           /* Color de texto al pasar el mouse */
  text-decoration: none;    /* Elimina subrayado en botones que son enlaces */
}

.btn:focus, .btn.focus {
  outline: 0;               /* Elimina el contorno por defecto del navegador */
  /* Sombra exterior rosa clara para indicar foco (accesibilidad) */
  box-shadow: 0 0 0 0.2rem rgba(249, 163, 146, 0.25);
}

.btn.disabled, .btn:disabled {
  opacity: 0.65;            /* Reduce opacidad para indicar estado inactivo */
}

.btn:not(:disabled):not(.disabled) {
  cursor: pointer;         /* Cambia el cursor a "mano" al pasar sobre botones activos */
}

/* Deshabilita eventos en enlaces con estilo de botón deshabilitados */
a.btn.disabled,
fieldset:disabled a.btn {
  pointer-events: none;    /* Impide cualquier interacción */
}

/* ============ VARIANTE PRIMARIA (COLOR ROSA) ============ */
.btn-primary {
  color: #212529;            /* Texto oscuro para mejor contraste */
  background-color: #F9A392; /* Fondo color rosa claro */
  border-color: #F9A392;     /* Borde del mismo color que el fondo */
}

.btn-primary:hover {
  color: #212529;           /* Mantiene texto oscuro */
  background-color: #f7846e; /* Fondo rosa más intenso al pasar mouse */
  border-color: #f67a62;    /* Borde ligeramente más oscuro */
}

.btn-primary:focus, .btn-primary.focus {
  color: #212529;
  background-color: #f7846e; /* Igual que hover para consistencia */
  border-color: #f67a62;
  /* Sombra más intensa para estado focus */
  box-shadow: 0 0 0 0.2rem rgba(217, 144, 130, 0.5);
}

.btn-primary.disabled, .btn-primary:disabled {
  color: #212529;
  /* Mantiene colores normales pero con opacidad reducida */
  background-color: #F9A392;
  border-color: #F9A392;
}

/* Estilo para botón presionado o activo */
.btn-primary:not(:disabled):not(.disabled):active, 
.btn-primary:not(:disabled):not(.disabled).active,
.show > .btn-primary.dropdown-toggle {
  color: #212529;
  background-color: #f67a62; /* Color más oscuro que en hover */
  border-color: #f67056;     /* Borde más oscuro aún */
}

/* Estilo focus cuando el botón está activo */
.btn-primary:not(:disabled):not(.disabled):active:focus, 
.btn-primary:not(:disabled):not(.disabled).active:focus,
.show > .btn-primary.dropdown-toggle:focus {
  box-shadow: 0 0 0 0.2rem rgba(217, 144, 130, 0.5);
}

/* ============ VARIANTE SECUNDARIA (COLOR AZUL) ============ */
.btn-secondary {
  color: #212529;            /* Texto oscuro */
  background-color: #6EBBF6; /* Fondo azul claro */
  border-color: #6EBBF6;     /* Borde azul claro */
}

.btn-secondary:hover {
  color: #fff;              /* Cambia texto a blanco en hover */
  background-color: #4aaaf4; /* Azul más intenso */
  border-color: #3ea4f3;    /* Borde más oscuro */
}

.btn-secondary:focus, .btn-secondary.focus {
  color: #fff;
  background-color: #4aaaf4;
  border-color: #3ea4f3;
  /* Sombra azul para estado focus */
  box-shadow: 0 0 0 0.2rem rgba(98, 165, 215, 0.5);
}

.btn-secondary.disabled, .btn-secondary:disabled {
  color: #212529;
  background-color: #6EBBF6;
  border-color: #6EBBF6;
}

.btn-secondary:not(:disabled):not(.disabled):active, 
.btn-secondary:not(:disabled):not(.disabled).active,
.show > .btn-secondary.dropdown-toggle {
  color: #fff;
  background-color: #3ea4f3; /* Azul más oscuro que en hover */
  border-color: #329ff2;     /* Borde más oscuro */
}

.btn-secondary:not(:disabled):not(.disabled):active:focus, 
.btn-secondary:not(:disabled):not(.disabled).active:focus,
.show > .btn-secondary.dropdown-toggle:focus {
  box-shadow: 0 0 0 0.2rem rgba(98, 165, 215, 0.5);
}

/* ============ VARIANTE SUCCESS (COLOR VERDE) ============ */
.btn-success {
  color: #fff;               /* Texto blanco para mejor contraste */
  background-color: #28a745; /* Fondo verde */
  border-color: #28a745;     /* Borde verde */
}

.btn-success:hover {
  color: #fff;
  background-color: #218838; /* Verde más oscuro */
  border-color: #1e7e34;     /* Borde más oscuro */
}

/* ===== ESTILOS PARA BOTONES - VARIANTES Y ESTADOS ===== */

/* ----------------------------- */
/* BOTÓN SUCCESS (VERDE - ÉXITO) */
/* ----------------------------- */
.btn-success {
  color: #fff;                     /* Texto blanco */
  background-color: #28a745;       /* Fondo verde */
  border-color: #28a745;           /* Borde verde */
}

/* Estado focus (teclado o click) */
.btn-success:focus, .btn-success.focus {
  background-color: #218838;       /* Verde un poco más oscuro */
  border-color: #1e7e34;           /* Borde más oscuro */
  box-shadow: 0 0 0 0.2rem rgba(72, 180, 97, 0.5); /* Sombra exterior verde */
}

/* Estado deshabilitado */
.btn-success.disabled, .btn-success:disabled {
  opacity: 0.65;                   /* Transparencia para indicar inactividad */
}

/* Estado activo/presionado */
.btn-success:not(:disabled):not(.disabled):active,
.btn-success:not(:disabled):not(.disabled).active,
.show > .btn-success.dropdown-toggle {
  background-color: #1e7e34;       /* Verde más oscuro */
  border-color: #1c7430;           /* Borde más oscuro */
}

/* Sombra para focus en estado activo */
.btn-success:not(:disabled):not(.disabled):active:focus,
.btn-success:not(:disabled):not(.disabled).active:focus,
.show > .btn-success.dropdown-toggle:focus {
  box-shadow: 0 0 0 0.2rem rgba(72, 180, 97, 0.5);
}

/* ----------------------------- */
/* BOTÓN INFO (AZUL - INFORMACIÓN) */
/* ----------------------------- */
.btn-info {
  color: #fff;
  background-color: #17a2b8;       /* Azul turquesa */
  border-color: #17a2b8;
}

.btn-info:hover {
  background-color: #138496;       /* Azul más oscuro al pasar mouse */
  border-color: #117a8b;
}

.btn-info:focus, .btn-info.focus {
  box-shadow: 0 0 0 0.2rem rgba(58, 176, 195, 0.5); /* Sombra azul */
}

.btn-info:not(:disabled):not(.disabled):active,
.btn-info:not(:disabled):not(.disabled).active,
.show > .btn-info.dropdown-toggle {
  background-color: #117a8b;       /* Azul más oscuro al presionar */
  border-color: #10707f;
}

/* ----------------------------- */
/* BOTÓN WARNING (AMARILLO - ADVERTENCIA) */
/* ----------------------------- */
.btn-warning {
  color: #212529;                  /* Texto oscuro para mejor contraste */
  background-color: #ffc107;       /* Amarillo */
  border-color: #ffc107;
}

.btn-warning:hover {
  background-color: #e0a800;       /* Amarillo oscuro */
  border-color: #d39e00;
}

.btn-warning:focus, .btn-warning.focus {
  box-shadow: 0 0 0 0.2rem rgba(222, 170, 12, 0.5); /* Sombra amarilla */
}

.btn-warning:not(:disabled):not(.disabled):active,
.btn-warning:not(:disabled):not(.disabled).active,
.show > .btn-warning.dropdown-toggle {
  background-color: #d39e00;       /* Amarillo más oscuro */
  border-color: #c69500;
}

/* ----------------------------- */
/* BOTÓN DANGER (ROJO - PELIGRO/ERROR) */
/* ----------------------------- */
.btn-danger {
  color: #fff;
  background-color: #dc3545;       /* Rojo */
  border-color: #dc3545;
}

/* Estados hover, focus y active siguen el mismo patrón que los botones anteriores */
/* con variaciones en los tonos de rojo para cada estado */

/* Estilos para el botón de tipo "danger" (peligro) */
/* Efecto al pasar el cursor por encima */
.btn-danger:hover {
  color: #fff;
  background-color: #c82333;
  border-color: #bd2130;
}

/* Estilos al enfocar el botón de peligro */
.btn-danger:focus, .btn-danger.focus {
  color: #fff;
  background-color: #c82333;
  border-color: #bd2130;
  box-shadow: 0 0 0 0.2rem rgba(225, 83, 97, 0.5);
}

/* Estilos para estado deshabilitado del botón de peligro */
.btn-danger.disabled, .btn-danger:disabled {
  color: #fff;
  background-color: #dc3545;
  border-color: #dc3545;
}

/* Estilos para el estado activo del botón de peligro */
.btn-danger:not(:disabled):not(.disabled):active, .btn-danger:not(:disabled):not(.disabled).active,
.show > .btn-danger.dropdown-toggle {
  color: #fff;
  background-color: #bd2130;
  border-color: #b21f2d;
}

/* Estilos de enfoque para el estado activo del botón de peligro */
.btn-danger:not(:disabled):not(.disabled):active:focus, .btn-danger:not(:disabled):not(.disabled).active:focus,
.show > .btn-danger.dropdown-toggle:focus {
  box-shadow: 0 0 0 0.2rem rgba(225, 83, 97, 0.5);
}

/* Estilos para el botón de tipo "light" (claro) */
.btn-light {
  color: #212529;
  background-color: #FEF1EF;
  border-color: #FEF1EF;
}

/* Efecto al pasar el cursor por encima del botón claro */
.btn-light:hover {
  color: #212529;
  background-color: #fcd2cb;
  border-color: #fbc7bf;
}

/* Estilos al enfocar el botón claro */
.btn-light:focus, .btn-light.focus {
  color: #212529;
  background-color: #fcd2cb;
  border-color: #fbc7bf;
  box-shadow: 0 0 0 0.2rem rgba(221, 210, 209, 0.5);
}

/* Estilos para estado deshabilitado del botón claro */
.btn-light.disabled, .btn-light:disabled {
  color: #212529;
  background-color: #FEF1EF;
  border-color: #FEF1EF;
}

/* Estilos para el estado activo del botón claro */
.btn-light:not(:disabled):not(.disabled):active, .btn-light:not(:disabled):not(.disabled).active,
.show > .btn-light.dropdown-toggle {
  color: #212529;
  background-color: #fbc7bf;
  border-color: #fabdb3;
}

/* Estilos de enfoque para el estado activo del botón claro */
.btn-light:not(:disabled):not(.disabled):active:focus, .btn-light:not(:disabled):not(.disabled).active:focus,
.show > .btn-light.dropdown-toggle:focus {
  box-shadow: 0 0 0 0.2rem rgba(221, 210, 209, 0.5);
}

/* Estilos para el botón de tipo "dark" (oscuro) */
.btn-dark {
  color: #fff;
  background-color: #211E1C;
  border-color: #211E1C;
}

/* Efecto al pasar el cursor por encima del botón oscuro */
.btn-dark:hover {
  color: #fff;
  background-color: #0c0b0a;
  border-color: #050505;
}

/* Estilos al enfocar el botón oscuro */
.btn-dark:focus, .btn-dark.focus {
  color: #fff;
  background-color: #0c0b0a;
  border-color: #050505;
  box-shadow: 0 0 0 0.2rem rgba(66, 64, 62, 0.5);
}

/* Estilos para estado deshabilitado del botón oscuro */
.btn-dark.disabled, .btn-dark:disabled {
  color: #fff;
  background-color: #211E1C;
  border-color: #211E1C;
}

/* Estilos para el estado activo del botón oscuro */
.btn-dark:not(:disabled):not(.disabled):active, .btn-dark:not(:disabled):not(.disabled).active,
.show > .btn-dark.dropdown-toggle {
  color: #fff;
  background-color: #050505;
  border-color: black;
}

/* Estilos de enfoque para el estado activo del botón oscuro */
.btn-dark:not(:disabled):not(.disabled):active:focus, .btn-dark:not(:disabled):not(.disabled).active:focus,
.show > .btn-dark.dropdown-toggle:focus {
  box-shadow: 0 0 0 0.2rem rgba(66, 64, 62, 0.5);
}

/* Estilos para botón con contorno de tipo "primary" (primario) */
.btn-outline-primary {
  color: #F9A392;
  border-color: #F9A392;
}

/* Efecto al pasar el cursor por encima del botón con contorno primario */
.btn-outline-primary:hover {
  color: #212529;
  background-color: #F9A392;
  border-color: #F9A392;
}

/* Estilos al enfocar el botón con contorno primario */
.btn-outline-primary:focus, .btn-outline-primary.focus {
  box-shadow: 0 0 0 0.2rem rgba(249, 163, 146, 0.5);
}

/* Estilos para estado deshabilitado del botón con contorno primario */
.btn-outline-primary.disabled, .btn-outline-primary:disabled {
  color: #F9A392;
  background-color: transparent;
}

/* Estilos para el estado activo del botón con contorno primario */
.btn-outline-primary:not(:disabled):not(.disabled):active, .btn-outline-primary:not(:disabled):not(.disabled).active,
.show > .btn-outline-primary.dropdown-toggle {
  color: #212529;
  background-color: #F9A392;
  border-color: #F9A392;
}

/* Estilos de enfoque para el estado activo del botón con contorno primario */
.btn-outline-primary:not(:disabled):not(.disabled):active:focus, .btn-outline-primary:not(:disabled):not(.disabled).active:focus,
.show > .btn-outline-primary.dropdown-toggle:focus {
  box-shadow: 0 0 0 0.2rem rgba(249, 163, 146, 0.5);
}

/* Estilos para botón con contorno de tipo "secondary" (secundario) */
.btn-outline-secondary {
  color: #6EBBF6;
  border-color: #6EBBF6;
}

/* Efecto al pasar el cursor por encima del botón con contorno secundario */
.btn-outline-secondary:hover {
  color: #212529;
  background-color: #6EBBF6;
  border-color: #6EBBF6;
}

/* Estilos al enfocar el botón con contorno secundario */
.btn-outline-secondary:focus, .btn-outline-secondary.focus {
  box-shadow: 0 0 0 0.2rem rgba(110, 187, 246, 0.5);
}

/* Estilos para estado deshabilitado del botón con contorno secundario */
.btn-outline-secondary.disabled, .btn-outline-secondary:disabled {
  color: #6EBBF6;
  background-color: transparent;
}

/* Estilos para el estado activo del botón con contorno secundario */
.btn-outline-secondary:not(:disabled):not(.disabled):active, .btn-outline-secondary:not(:disabled):not(.disabled).active,
.show > .btn-outline-secondary.dropdown-toggle {
  color: #212529;
  background-color: #6EBBF6;
  border-color: #6EBBF6;
}

/* Estilos de enfoque para el estado activo del botón con contorno secundario */
.btn-outline-secondary:not(:disabled):not(.disabled):active:focus, .btn-outline-secondary:not(:disabled):not(.disabled).active:focus,
.show > .btn-outline-secondary.dropdown-toggle:focus {
  box-shadow: 0 0 0 0.2rem rgba(110, 187, 246, 0.5);
}

/* Estilos para botón con contorno de tipo "success" (éxito) */
.btn-outline-success {
  color: #28a745;
  border-color: #28a745;
}

/* Efecto al pasar el cursor por encima del botón con contorno de éxito */
.btn-outline-success:hover {
  color: #fff;
  background-color: #28a745;
  border-color: #28a745;
}

/* Estilos al enfocar el botón con contorno de éxito */
.btn-outline-success:focus, .btn-outline-success.focus {
  box-shadow: 0 0 0 0.2rem rgba(40, 167, 69, 0.5);
}

/* Estilos para estado deshabilitado del botón con contorno de éxito */
.btn-outline-success.disabled, .btn-outline-success:disabled {
  color: #28a745;
  background-color: transparent;
}

/* Estilos para el estado activo del botón con contorno de éxito */
.btn-outline-success:not(:disabled):not(.disabled):active, .btn-outline-success:not(:disabled):not(.disabled).active,
.show > .btn-outline-success.dropdown-toggle {
  color: #fff;
  background-color: #28a745;
  border-color: #28a745;
}

/* Estilos de enfoque para el estado activo del botón con contorno de éxito */
.btn-outline-success:not(:disabled):not(.disabled):active:focus, .btn-outline-success:not(:disabled):not(.disabled).active:focus,
.show > .btn-outline-success.dropdown-toggle:focus {
  box-shadow: 0 0 0 0.2rem rgba(40, 167, 69, 0.5);
}

/* Estilos para botón con contorno de tipo "info" (información) */
.btn-outline-info {
  color: #17a2b8;
  border-color: #17a2b8;
}

/* Efecto al pasar el cursor por encima del botón con contorno de información */
.btn-outline-info:hover {
  color: #fff;
  background-color: #17a2b8;
  border-color: #17a2b8;
}

/* Estilos al enfocar el botón con contorno de información */
.btn-outline-info:focus, .btn-outline-info.focus {
  box-shadow: 0 0 0 0.2rem rgba(23, 162, 184, 0.5);
}

/* Estilos para estado deshabilitado del botón con contorno de información */
.btn-outline-info.disabled, .btn-outline-info:disabled {
  color: #17a2b8;
  background-color: transparent;
}

/* Estilos para el estado activo del botón con contorno de información */
.btn-outline-info:not(:disabled):not(.disabled):active, .btn-outline-info:not(:disabled):not(.disabled).active,
.show > .btn-outline-info.dropdown-toggle {
  color: #fff;
  background-color: #17a2b8;
  border-color: #17a2b8;
}

/* Estilos de enfoque para el estado activo del botón con contorno de información */
.btn-outline-info:not(:disabled):not(.disabled):active:focus, .btn-outline-info:not(:disabled):not(.disabled).active:focus,
.show > .btn-outline-info.dropdown-toggle:focus {
  box-shadow: 0 0 0 0.2rem rgba(23, 162, 184, 0.5);
}

/* Estilos para botón con contorno de tipo "warning" (advertencia) */
.btn-outline-warning {
  color: #ffc107;
  border-color: #ffc107;
}

/* Efecto al pasar el cursor por encima del botón con contorno de advertencia */
.btn-outline-warning:hover {
  color: #212529;
  background-color: #ffc107;
  border-color: #ffc107;
}

/* Estilos al enfocar el botón con contorno de advertencia */
.btn-outline-warning:focus, .btn-outline-warning.focus {
  box-shadow: 0 0 0 0.2rem rgba(255, 193, 7, 0.5);
}

/* Estilos para estado deshabilitado del botón con contorno de advertencia */
.btn-outline-warning.disabled, .btn-outline-warning:disabled {
  color: #ffc107;
  background-color: transparent;
}

/* Estilos para el estado activo del botón con contorno de advertencia */
.btn-outline-warning:not(:disabled):not(.disabled):active, .btn-outline-warning:not(:disabled):not(.disabled).active,
.show > .btn-outline-warning.dropdown-toggle {
  color: #212529;
  background-color: #ffc107;
  border-color: #ffc107;
}

/* Estilos de enfoque para el estado activo del botón con contorno de advertencia */
.btn-outline-warning:not(:disabled):not(.disabled):active:focus, .btn-outline-warning:not(:disabled):not(.disabled).active:focus,
.show > .btn-outline-warning.dropdown-toggle:focus {
  box-shadow: 0 0 0 0.2rem rgba(255, 193, 7, 0.5);
}

/* Estilos para botón con contorno de tipo "danger" (peligro) */
.btn-outline-danger {
  color: #dc3545;
  border-color: #dc3545;
}

/* Efecto al pasar el cursor por encima del botón con contorno de peligro */
.btn-outline-danger:hover {
  color: #fff;
  background-color: #dc3545;
  border-color: #dc3545;
}

/* Estilos al enfocar el botón con contorno de peligro */
.btn-outline-danger:focus, .btn-outline-danger.focus {
  box-shadow: 0 0 0 0.2rem rgba(220, 53, 69, 0.5);
}

/* Estilos para estado deshabilitado del botón con contorno de peligro */
.btn-outline-danger.disabled, .btn-outline-danger:disabled {
  color: #dc3545;
  background-color: transparent;
}

/* Estilos para el estado activo del botón con contorno de peligro */
.btn-outline-danger:not(:disabled):not(.disabled):active, .btn-outline-danger:not(:disabled):not(.disabled).active,
.show > .btn-outline-danger.dropdown-toggle {
  color: #fff;
  background-color: #dc3545;
  border-color: #dc3545;
}

/* Estilos de enfoque para el estado activo del botón con contorno de peligro */
.btn-outline-danger:not(:disabled):not(.disabled):active:focus, .btn-outline-danger:not(:disabled):not(.disabled).active:focus,
.show > .btn-outline-danger.dropdown-toggle:focus {
  box-shadow: 0 0 0 0.2rem rgba(220, 53, 69, 0.5);
}

/* Estilos para botón con contorno de tipo "light" (claro) */
.btn-outline-light {
  color: #FEF1EF;
  border-color: #FEF1EF;
}

/* Efecto al pasar el cursor por encima del botón con contorno claro */
.btn-outline-light:hover {
  color: #212529;
  background-color: #FEF1EF;
  border-color: #FEF1EF;
}

/* Estilos al enfocar el botón con contorno claro */
.btn-outline-light:focus, .btn-outline-light.focus {
  box-shadow: 0 0 0 0.2rem rgba(254, 241, 239, 0.5);
}

/* Estilos para estado deshabilitado del botón con contorno claro */
.btn-outline-light.disabled, .btn-outline-light:disabled {
  color: #FEF1EF;
  background-color: transparent;
}

/* Estilos para el estado activo del botón con contorno claro */
.btn-outline-light:not(:disabled):not(.disabled):active, .btn-outline-light:not(:disabled):not(.disabled).active,
.show > .btn-outline-light.dropdown-toggle {
  color: #212529;
  background-color: #FEF1EF;
  border-color: #FEF1EF;
}

/* Estilos de enfoque para el estado activo del botón con contorno claro */
.btn-outline-light:not(:disabled):not(.disabled):active:focus, .btn-outline-light:not(:disabled):not(.disabled).active:focus,
.show > .btn-outline-light.dropdown-toggle:focus {
  box-shadow: 0 0 0 0.2rem rgba(254, 241, 239, 0.5);
}

/* Estilos para botón con contorno de tipo "dark" (oscuro) */
.btn-outline-dark {
  color: #211E1C;
  border-color: #211E1C;
}

/* Efecto al pasar el cursor por encima del botón con contorno oscuro */
.btn-outline-dark:hover {
  color: #fff;
  background-color: #211E1C;
  border-color: #211E1C;
}

/* Estilos al enfocar el botón con contorno oscuro */
.btn-outline-dark:focus, .btn-outline-dark.focus {
  box-shadow: 0 0 0 0.2rem rgba(33, 30, 28, 0.5);
}

/* Estilos para estado deshabilitado del botón con contorno oscuro */
.btn-outline-dark.disabled, .btn-outline-dark:disabled {
  color: #211E1C;
  background-color: transparent;
}

/* Estilos para el estado activo del botón con contorno oscuro */
.btn-outline-dark:not(:disabled):not(.disabled):active, .btn-outline-dark:not(:disabled):not(.disabled).active,
.show > .btn-outline-dark.dropdown-toggle {
  color: #fff;
  background-color: #211E1C;
  border-color: #211E1C;
}

/* Estilos de enfoque para el estado activo del botón con contorno oscuro */
.btn-outline-dark:not(:disabled):not(.disabled):active:focus, .btn-outline-dark:not(:disabled):not(.disabled).active:focus,
.show > .btn-outline-dark.dropdown-toggle:focus {
  box-shadow: 0 0 0 0.2rem rgba(33, 30, 28, 0.5);
}

/* Estilos para botón de tipo enlace (link) */
.btn-link {
  font-weight: 400;
  color: #F9A392;
  text-decoration: none;
}

/* Efecto al pasar el cursor por encima del botón tipo enlace */
.btn-link:hover {
  color: #f56649;
  text-decoration: underline;
}

/* Estilos al enfocar el botón tipo enlace */
.btn-link:focus, .btn-link.focus {
  text-decoration: underline;
}

/* Estilos para estado deshabilitado del botón tipo enlace */
.btn-link:disabled, .btn-link.disabled {
  color: #6c757d;
  pointer-events: none;
}

/* Estilos para botón grande (lg) */
.btn-lg, .btn-group-lg > .btn {
  padding: 0.5rem 1rem;
  font-size: 1.25rem;
  line-height: 1.5;
  border-radius: 0;
}

/* Estilos para botón pequeño (sm) */
.btn-sm, .btn-group-sm > .btn {
  padding: 0.25rem 0.5rem;
  font-size: 0.875rem;
  line-height: 1.5;
  border-radius: 0;
}

/* Estilos para botón que ocupa todo el ancho disponible */
.btn-block {
  display: block;
  width: 100%;
}

/* Margen superior entre botones de bloque */
.btn-block + .btn-block {
  margin-top: 0.5rem;
}

/* Aplicación de ancho completo para inputs con apariencia de botón */
input[type="submit"].btn-block,
input[type="reset"].btn-block,
input[type="button"].btn-block {
  width: 100%;
}

/* Animación de desvanecimiento (fade) */
.fade {
  transition: opacity 0.15s linear;
}

/* Desactivar animaciones para usuarios que prefieren movimiento reducido */
@media (prefers-reduced-motion: reduce) {
  .fade {
    transition: none;
  }
}

/* Estado invisible para elementos con clase fade */
.fade:not(.show) {
  opacity: 0;
}

/* Ocultar elementos colapsables que no tienen la clase show */
.collapse:not(.show) {
  display: none;
}

/* Animación para elementos que están siendo colapsados o expandidos */
.collapsing {
  position: relative;
  height: 0;
  overflow: hidden;
  transition: height 0.35s ease;
}

/* Desactivar animaciones de colapso para usuarios que prefieren movimiento reducido */
@media (prefers-reduced-motion: reduce) {
  .collapsing {
    transition: none;
  }
}

/* Estilos base para menús desplegables en diferentes direcciones */
.dropup,
.dropright,
.dropdown,
.dropleft {
  position: relative;
}

/* Estilos para el botón que activa el menú desplegable */
.dropdown-toggle {
  white-space: nowrap;
}

/* Flecha indicadora para el botón desplegable (hacia abajo) */
.dropdown-toggle::after {
  display: inline-block;
  margin-left: 0.255em;
  vertical-align: 0.255em;
  content: "";
  border-top: 0.3em solid;
  border-right: 0.3em solid transparent;
  border-bottom: 0;
  border-left: 0.3em solid transparent;
}

/* Eliminación del margen izquierdo cuando no hay contenido visible */
.dropdown-toggle:empty::after {
  margin-left: 0;
}

/* Estilos para el menú desplegable */
.dropdown-menu {
  position: absolute;
  top: 100%;
  left: 0;
  z-index: 1000;
  display: none;
  float: left;
  min-width: 10rem;
  padding: 0.5rem 0;
  margin: 0.125rem 0 0;
  font-size: 1rem;
  color: #757575;
  text-align: left;
  list-style: none;
  background-color: #fff;
  background-clip: padding-box;
  border: 1px solid rgba(0, 0, 0, 0.15);
}

/* Posicionamiento del menú desplegable (a la izquierda) */
.dropdown-menu-left {
  right: auto;
  left: 0;
}

/* Posicionamiento del menú desplegable (a la derecha) */
.dropdown-menu-right {
  right: 0;
  left: auto;
}

/* Posicionamiento responsive para pantallas pequeñas (sm) */
@media (min-width: 576px) {
  .dropdown-menu-sm-left {
    right: auto;
    left: 0;
  }
  .dropdown-menu-sm-right {
    right: 0;
    left: auto;
  }
}

/* Posicionamiento responsive para pantallas medianas (md) */
@media (min-width: 768px) {
  .dropdown-menu-md-left {
    right: auto;
    left: 0;
  }
  .dropdown-menu-md-right {
    right: 0;
    left: auto;
  }
}

/* Posicionamiento responsive para pantallas grandes (lg) */
@media (min-width: 992px) {
  .dropdown-menu-lg-left {
    right: auto;
    left: 0;
  }
  .dropdown-menu-lg-right {
    right: 0;
    left: auto;
  }
}

/* Posicionamiento responsive para pantallas extra grandes (xl) */
@media (min-width: 1200px) {
  .dropdown-menu-xl-left {
    right: auto;
    left: 0;
  }
  .dropdown-menu-xl-right {
    right: 0;
    left: auto;
  }
}

/* Estilos para menú desplegable hacia arriba */
.dropup .dropdown-menu {
  top: auto;
  bottom: 100%;
  margin-top: 0;
  margin-bottom: 0.125rem;
}

/* Flecha indicadora para botón de menú hacia arriba */
.dropup .dropdown-toggle::after {
  display: inline-block;
  margin-left: 0.255em;
  vertical-align: 0.255em;
  content: "";
  border-top: 0;
  border-right: 0.3em solid transparent;
  border-bottom: 0.3em solid;
  border-left: 0.3em solid transparent;
}

/* Eliminación del margen izquierdo cuando no hay contenido visible en menú hacia arriba */
.dropup .dropdown-toggle:empty::after {
  margin-left: 0;
}

/* Estilos para menú desplegable hacia la derecha */
.dropright .dropdown-menu {
  top: 0;
  right: auto;
  left: 100%;
  margin-top: 0;
  margin-left: 0.125rem;
}

/* Flecha indicadora para botón de menú hacia la derecha */
.dropright .dropdown-toggle::after {
  display: inline-block;
  margin-left: 0.255em;
  vertical-align: 0.255em;
  content: "";
  border-top: 0.3em solid transparent;
  border-right: 0;
  border-bottom: 0.3em solid transparent;
  border-left: 0.3em solid;
}

/* Eliminación del margen izquierdo cuando no hay contenido visible en menú hacia la derecha */
.dropright .dropdown-toggle:empty::after {
  margin-left: 0;
}

/* Ajuste vertical de la flecha para menú hacia la derecha */
.dropright .dropdown-toggle::after {
  vertical-align: 0;
}

/* Estilos para menú desplegable hacia la izquierda */
.dropleft .dropdown-menu {
  top: 0;
  right: 100%;
  left: auto;
  margin-top: 0;
  margin-right: 0.125rem;
}

/* Preparación para flecha indicadora para botón de menú hacia la izquierda */
.dropleft .dropdown-toggle::after {
  display: inline-block;
  margin-left: 0.255em;
  vertical-align: 0.255em;
  content: "";
}

/* Ocultar flecha after para menú hacia la izquierda */
.dropleft .dropdown-toggle::after {
  display: none;
}

/* Flecha indicadora before para botón de menú hacia la izquierda */
.dropleft .dropdown-toggle::before {
  display: inline-block;
  margin-right: 0.255em;
  vertical-align: 0.255em;
  content: "";
  border-top: 0.3em solid transparent;
  border-right: 0.3em solid;
  border-bottom: 0.3em solid transparent;
}

/* Eliminación del margen izquierdo cuando no hay contenido visible en menú hacia la izquierda */
.dropleft .dropdown-toggle:empty::after {
  margin-left: 0;
}

/* Ajuste vertical de la flecha before para menú hacia la izquierda */
.dropleft .dropdown-toggle::before {
  vertical-align: 0;
}

/* Posicionamiento correcto para menús desplegables con atributos x-placement */
.dropdown-menu[x-placement^="top"], .dropdown-menu[x-placement^="right"], .dropdown-menu[x-placement^="bottom"], .dropdown-menu[x-placement^="left"] {
  right: auto;
  bottom: auto;
}

/* Divisor para separar elementos dentro del menú desplegable */
.dropdown-divider {
  height: 0;
  margin: 0.5rem 0;
  overflow: hidden;
  border-top: 1px solid #e9ecef;
}

/* Estilos para elementos dentro del menú desplegable */
.dropdown-item {
  display: block;
  width: 100%;
  padding: 0.25rem 1.5rem;
  clear: both;
  font-weight: 400;
  color: #212529;
  text-align: inherit;
  white-space: nowrap;
  background-color: transparent;
  border: 0;
}

/* Efectos al pasar el cursor o enfocar elementos del menú */
.dropdown-item:hover, .dropdown-item:focus {
  color: #16181b;
  text-decoration: none;
  background-color: #f8f9fa;
}

/* Estilos para elementos activos del menú */
.dropdown-item.active, .dropdown-item:active {
  color: #fff;
  text-decoration: none;
  background-color: #F9A392;
}

/* Estilos para elementos deshabilitados del menú desplegable */
.dropdown-item.disabled, .dropdown-item:disabled {
  color: #6c757d;
  pointer-events: none;
  background-color: transparent;
}

/* Mostrar el menú desplegable cuando tiene la clase show */
.dropdown-menu.show {
  display: block;
}

/* Estilos para el encabezado dentro del menú desplegable */
.dropdown-header {
  display: block;
  padding: 0.5rem 1.5rem;
  margin-bottom: 0;
  font-size: 0.875rem;
  color: #6c757d;
  white-space: nowrap;
}

/* Estilos para elementos de texto en el menú desplegable */
.dropdown-item-text {
  display: block;
  padding: 0.25rem 1.5rem;
  color: #212529;
}

/* Estilos para grupos de botones horizontales y verticales */
.btn-group,
.btn-group-vertical {
  position: relative;
  display: inline-flex;
  vertical-align: middle;
}

/* Distribución de botones dentro de un grupo */
.btn-group > .btn,
.btn-group-vertical > .btn {
  position: relative;
  flex: 1 1 auto;
}

/* Efecto al pasar el cursor sobre botones en un grupo */
.btn-group > .btn:hover,
.btn-group-vertical > .btn:hover {
  z-index: 1;
}

/* Estilos para estados focus, active y active de botones en un grupo */
.btn-group > .btn:focus, .btn-group > .btn:active, .btn-group > .btn.active,
.btn-group-vertical > .btn:focus,
.btn-group-vertical > .btn:active,
.btn-group-vertical > .btn.active {
  z-index: 1;
}

/* Barra de herramientas para grupos de botones con disposición flexible */
.btn-toolbar {
  display: flex;
  flex-wrap: wrap;
  justify-content: flex-start;
}

/* Ajuste para grupos de entrada dentro de la barra de herramientas */
.btn-toolbar .input-group {
  width: auto;
}

/* Ajuste de margen para botones adyacentes dentro de un grupo (efecto unido) */
.btn-group > .btn:not(:first-child),
.btn-group > .btn-group:not(:first-child) {
  margin-left: -1px;
}

/* Estilos específicos para botones desplegables divididos */
.dropdown-toggle-split {
  padding-right: 0.5625rem;
  padding-left: 0.5625rem;
}

/* Elimina el margen izquierdo de la flecha en botones desplegables divididos */
.dropdown-toggle-split::after,
.dropup .dropdown-toggle-split::after,
.dropright .dropdown-toggle-split::after {
  margin-left: 0;
}

/* Elimina el margen derecho de la flecha en botones desplegables a la izquierda */
.dropleft .dropdown-toggle-split::before {
  margin-right: 0;
}

/* Ajuste de relleno para botones pequeños con desplegable dividido */
.btn-sm + .dropdown-toggle-split, .btn-group-sm > .btn + .dropdown-toggle-split {
  padding-right: 0.375rem;
  padding-left: 0.375rem;
}

/* Ajuste de relleno para botones grandes con desplegable dividido */
.btn-lg + .dropdown-toggle-split, .btn-group-lg > .btn + .dropdown-toggle-split {
  padding-right: 0.75rem;
  padding-left: 0.75rem;
}

/* Grupo de botones con disposición vertical */
.btn-group-vertical {
  flex-direction: column;
  align-items: flex-start;
  justify-content: center;
}

/* Hacer que los botones en un grupo vertical ocupen todo el ancho disponible */
.btn-group-vertical > .btn,
.btn-group-vertical > .btn-group {
  width: 100%;
}

/* Ajuste de margen negativo para botones verticales (efecto unido vertical) */
.btn-group-vertical > .btn:not(:first-child),
.btn-group-vertical > .btn-group:not(:first-child) {
  margin-top: -1px;
}

/* Elimina el margen inferior para grupos de botones toggle */
.btn-group-toggle > .btn,
.btn-group-toggle > .btn-group > .btn {
  margin-bottom: 0;
}

/* Oculta los inputs de radio y checkbox dentro de los grupos toggle para estilizar personalizados */
.btn-group-toggle > .btn input[type="radio"],
.btn-group-toggle > .btn input[type="checkbox"],
.btn-group-toggle > .btn-group > .btn input[type="radio"],
.btn-group-toggle > .btn-group > .btn input[type="checkbox"] {
  position: absolute;
  clip: rect(0, 0, 0, 0);
  pointer-events: none;
}

/* Configuración base para grupos de entrada con disposición flexible */
.input-group {
  position: relative;
  display: flex;
  flex-wrap: wrap;
  align-items: stretch;
  width: 100%;
}

/* Estilos para los controles dentro de un grupo de entrada */
.input-group > .form-control,
.input-group > .form-control-plaintext,
.input-group > .custom-select,
.input-group > .custom-file {
  position: relative;
  flex: 1 1 auto;
  width: 1%;  /* Truco para distribución equitativa del espacio */
  min-width: 0;
  margin-bottom: 0;
}

/* Ajuste de margen negativo para controles adyacentes (efecto unido) */
.input-group > .form-control + .form-control,
.input-group > .form-control + .custom-select,
.input-group > .form-control + .custom-file,
.input-group > .form-control-plaintext + .form-control,
.input-group > .form-control-plaintext + .custom-select,
.input-group > .form-control-plaintext + .custom-file,
.input-group > .custom-select + .form-control,
.input-group > .custom-select + .custom-select,
.input-group > .custom-select + .custom-file,
.input-group > .custom-file + .form-control,
.input-group > .custom-file + .custom-select,
.input-group > .custom-file + .custom-file {
  margin-left: -1px;
}

/* Hace que los controles de formulario enfocados en grupos de entrada aparezcan por encima de otros elementos */
.input-group > .form-control:focus,
.input-group > .custom-select:focus,
.input-group > .custom-file .custom-file-input:focus ~ .custom-file-label {
  z-index: 3;
}

/* Asegura que un input de archivo personalizado enfocado tenga la máxima prioridad en términos de orden de apilamiento */
.input-group > .custom-file .custom-file-input:focus {
  z-index: 4;
}

/* Hace que los inputs de archivo personalizados usen flexbox para alineación */
.input-group > .custom-file {
  display: flex;
  align-items: center;
}

/* Configura display:flex para los elementos de prepend y append */
.input-group-prepend,
.input-group-append {
  display: flex;
}

/* Establece estilos relativos para botones dentro de los grupos prepend/append */
.input-group-prepend .btn,
.input-group-append .btn {
  position: relative;
  z-index: 2;
}

/* Aumenta el z-index de los botones enfocados para que aparezcan encima de otros elementos */
.input-group-prepend .btn:focus,
.input-group-append .btn:focus {
  z-index: 3;
}

/* Ajusta los márgenes para elementos adyacentes en grupos prepend/append para crear un aspecto cohesivo */
.input-group-prepend .btn + .btn,
.input-group-prepend .btn + .input-group-text,
.input-group-prepend .input-group-text + .input-group-text,
.input-group-prepend .input-group-text + .btn,
.input-group-append .btn + .btn,
.input-group-append .btn + .input-group-text,
.input-group-append .input-group-text + .input-group-text,
.input-group-append .input-group-text + .btn {
  margin-left: -1px;
}

/* Ajusta el margen derecho para grupos prepend */
.input-group-prepend {
  margin-right: -1px;
}

/* Ajusta el margen izquierdo para grupos append */
.input-group-append {
  margin-left: -1px;
}

/* Establece los estilos básicos para el texto en grupos de entrada */
.input-group-text {
  display: flex;
  align-items: center;
  padding: 0.375rem 0.75rem;
  margin-bottom: 0;
  font-size: 1rem;
  font-weight: 400;
  line-height: 1.5;
  color: #495057;
  text-align: center;
  white-space: nowrap;
  background-color: #e9ecef;
  border: 1px solid #ced4da;
}

/* Ajusta los márgenes para inputs de tipo radio y checkbox dentro del texto de grupo */
.input-group-text input[type="radio"],
.input-group-text input[type="checkbox"] {
  margin-top: 0;
}

/* Define la altura para controles grandes (lg) que no son textarea */
.input-group-lg > .form-control:not(textarea),
.input-group-lg > .custom-select {
  height: calc(1.5em + 1rem + 2px);
}

/* Establece el padding, tamaño de fuente y altura de línea para componentes grandes (lg) */
.input-group-lg > .form-control,
.input-group-lg > .custom-select,
.input-group-lg > .input-group-prepend > .input-group-text,
.input-group-lg > .input-group-append > .input-group-text,
.input-group-lg > .input-group-prepend > .btn,
.input-group-lg > .input-group-append > .btn {
  padding: 0.5rem 1rem;
  font-size: 1.25rem;
  line-height: 1.5;
}

/* Define la altura para controles pequeños (sm) que no son textarea */
.input-group-sm > .form-control:not(textarea),
.input-group-sm > .custom-select {
  height: calc(1.5em + 0.5rem + 2px);
}

/* Establece el padding, tamaño de fuente y altura de línea para componentes pequeños (sm) */
.input-group-sm > .form-control,
.input-group-sm > .custom-select,
.input-group-sm > .input-group-prepend > .input-group-text,
.input-group-sm > .input-group-append > .input-group-text,
.input-group-sm > .input-group-prepend > .btn,
.input-group-sm > .input-group-append > .btn {
  padding: 0.25rem 0.5rem;
  font-size: 0.875rem;
  line-height: 1.5;
}

/* Ajusta el padding derecho para selectores personalizados grandes y pequeños */
.input-group-lg > .custom-select,
.input-group-sm > .custom-select {
  padding-right: 1.75rem;
}

/* Configuración básica para controles personalizados */
.custom-control {
  position: relative;
  z-index: 1;
  display: block;
  min-height: 1.5rem;
  padding-left: 1.5rem;
  color-adjust: exact;
}

/* Permite que los controles personalizados se muestren en línea */
.custom-control-inline {
  display: inline-flex;
  margin-right: 1rem;
}

/* Posicionamiento para el input de control personalizado (oculto) */
.custom-control-input {
  position: absolute;
  left: 0;
  z-index: -1;
  width: 1rem;
  height: 1.25rem;
  opacity: 0;
}

/* Estilos para cuando el input personalizado está marcado/seleccionado */
.custom-control-input:checked ~ .custom-control-label::before {
  color: #fff;
  border-color: #F9A392;
  background-color: #F9A392;
}

/* Estilos de enfoque para el control personalizado */
.custom-control-input:focus ~ .custom-control-label::before {
  box-shadow: 0 0 0 0.2rem rgba(249, 163, 146, 0.25);
}

/* Cambia el color del borde cuando está enfocado pero no marcado */
.custom-control-input:focus:not(:checked) ~ .custom-control-label::before {
  border-color: white;
}

/* Estilos para el estado activo del control personalizado */
.custom-control-input:not(:disabled):active ~ .custom-control-label::before {
  color: #fff;
  background-color: white;
  border-color: white;
}

/* Estilos para controles personalizados deshabilitados */
.custom-control-input[disabled] ~ .custom-control-label, .custom-control-input:disabled ~ .custom-control-label {
  color: #6c757d;
}

.custom-control-input[disabled] ~ .custom-control-label::before, .custom-control-input:disabled ~ .custom-control-label::before {
  background-color: #e9ecef;
}

/* Posicionamiento para etiquetas de controles personalizados */
.custom-control-label {
  position: relative;
  margin-bottom: 0;
  vertical-align: top;
}

/* Crea el elemento decorativo "before" para controles personalizados (el box) */
.custom-control-label::before {
  position: absolute;
  top: 0.25rem;
  left: -1.5rem;
  display: block;
  width: 1rem;
  height: 1rem;
  pointer-events: none;
  content: "";
  background-color: #fff;
  border: #adb5bd solid 1px;
}

/* Crea el elemento decorativo "after" para controles personalizados (el indicador) */
.custom-control-label::after {
  position: absolute;
  top: 0.25rem;
  left: -1.5rem;
  display: block;
  width: 1rem;
  height: 1rem;
  content: "";
  background: no-repeat 50% / 50% 50%;
}

/* Añade el icono de verificación para checkboxes personalizados marcados */
.custom-checkbox .custom-control-input:checked ~ .custom-control-label::after {
  background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' width='8' height='8' viewBox='0 0 8 8'%3e%3cpath fill='%23fff' d='M6.564.75l-3.59 3.612-1.538-1.55L0 4.26l2.974 2.99L8 2.193z'/%3e%3c/svg%3e");
}

/* Estilos para el estado indeterminado de checkboxes personalizados */
.custom-checkbox .custom-control-input:indeterminate ~ .custom-control-label::before {
  border-color: #F9A392;
  background-color: #F9A392;
}

/* Añade el icono de guión para checkboxes en estado indeterminado */
.custom-checkbox .custom-control-input:indeterminate ~ .custom-control-label::after {
  background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' width='4' height='4' viewBox='0 0 4 4'%3e%3cpath stroke='%23fff' d='M0 2h4'/%3e%3c/svg%3e");
}

/* Estilos para checkboxes personalizados marcados y deshabilitados */
.custom-checkbox .custom-control-input:disabled:checked ~ .custom-control-label::before {
  background-color: rgba(249, 163, 146, 0.5);
}

/* Estilos para checkboxes personalizados indeterminados y deshabilitados */
.custom-checkbox .custom-control-input:disabled:indeterminate ~ .custom-control-label::before {
  background-color: rgba(249, 163, 146, 0.5);
}

/* Hace que el elemento decorativo "before" de radio buttons sea circular */
.custom-radio .custom-control-label::before {
  border-radius: 50%;
}

/* Añade el círculo interior para radio buttons marcados */
.custom-radio .custom-control-input:checked ~ .custom-control-label::after {
  background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' width='12' height='12' viewBox='-4 -4 8 8'%3e%3ccircle r='3' fill='%23fff'/%3e%3c/svg%3e");
}

/* Estilos para radio buttons personalizados marcados y deshabilitados */
.custom-radio .custom-control-input:disabled:checked ~ .custom-control-label::before {
  background-color: rgba(249, 163, 146, 0.5);
}

/* Configuración específica para switches personalizados */
.custom-switch {
  padding-left: 2.25rem;
}

/* Estilos para el elemento decorativo "before" de switches (la pista) */
.custom-switch .custom-control-label::before {
  left: -2.25rem;
  width: 1.75rem;
  pointer-events: all;
  border-radius: 0.5rem;
}

/* Estilos para el elemento decorativo "after" de switches (el círculo móvil) */
.custom-switch .custom-control-label::after {
  top: calc(0.25rem + 2px);
  left: calc(-2.25rem + 2px);
  width: calc(1rem - 4px);
  height: calc(1rem - 4px);
  background-color: #adb5bd;
  border-radius: 0.5rem;
  transition: transform 0.15s ease-in-out, background-color 0.15s ease-in-out, border-color 0.15s ease-in-out, box-shadow 0.15s ease-in-out;
}

/* Elimina las transiciones si el usuario prefiere movimiento reducido */
@media (prefers-reduced-motion: reduce) {
  .custom-switch .custom-control-label::after {
    transition: none;
  }
}

/* Mueve el círculo cuando el switch está activado */
.custom-switch .custom-control-input:checked ~ .custom-control-label::after {
  background-color: #fff;
  transform: translateX(0.75rem);
}

/* Estilos para switches marcados y deshabilitados */
.custom-switch .custom-control-input:disabled:checked ~ .custom-control-label::before {
  background-color: rgba(249, 163, 146, 0.5);
}

/* Estilos básicos para selectores personalizados */
.custom-select {
  display: inline-block;
  width: 100%;
  height: calc(1.5em + 0.75rem + 2px);
  padding: 0.375rem 1.75rem 0.375rem 0.75rem;
  font-size: 1rem;
  font-weight: 400;
  line-height: 1.5;
  color: #495057;
  vertical-align: middle;
  background: #fff url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' width='4' height='5' viewBox='0 0 4 5'%3e%3cpath fill='%23343a40' d='M2 0L0 2h4zm0 5L0 3h4z'/%3e%3c/svg%3e") no-repeat right 0.75rem center/8px 10px;
  border: 1px solid #ced4da;
  border-radius: 0;
  appearance: none;
}

/* Estilos de enfoque para selectores personalizados */
.custom-select:focus {
  border-color: white;
  outline: 0;
  box-shadow: 0 0 0 0.2rem rgba(249, 163, 146, 0.25);
}

/* Mantiene los colores apropiados cuando está enfocado en IE */
.custom-select:focus::-ms-value {
  color: #495057;
  background-color: #fff;
}

/* Ajusta altura y estilos para selectores múltiples */
.custom-select[multiple], .custom-select[size]:not([size="1"]) {
  height: auto;
  padding-right: 0.75rem;
  background-image: none;
}

/* Estilos para selectores personalizados deshabilitados */
.custom-select:disabled {
  color: #6c757d;
  background-color: #e9ecef;
}

/* Oculta la flecha desplegable nativa en IE */
.custom-select::-ms-expand {
  display: none;
}

/* Evita el anillo azul alrededor del texto en Firefox */
.custom-select:-moz-focusring {
  color: transparent;
  text-shadow: 0 0 0 #495057;
}

/* Estilos para selectores personalizados pequeños */
.custom-select-sm {
  height: calc(1.5em + 0.5rem + 2px);
  padding-top: 0.25rem;
  padding-bottom: 0.25rem;
  padding-left: 0.5rem;
  font-size: 0.875rem;
}

/* Estilos para selectores personalizados grandes */
.custom-select-lg {
  height: calc(1.5em + 1rem + 2px);
  padding-top: 0.5rem;
  padding-bottom: 0.5rem;
  padding-left: 1rem;
  font-size: 1.25rem;
}

/* Configuración básica para contenedores de archivos personalizados */
.custom-file {
  position: relative;
  display: inline-block;
  width: 100%;
  height: calc(1.5em + 0.75rem + 2px);
  margin-bottom: 0;
}

/* Estilos para el input de archivo oculto */
.custom-file-input {
  position: relative;
  z-index: 2;
  width: 100%;
  height: calc(1.5em + 0.75rem + 2px);
  margin: 0;
  opacity: 0;
}

/* Estilos para el input de archivo personalizado cuando está enfocado */
.custom-file-input:focus ~ .custom-file-label {
  border-color: white;
  box-shadow: 0 0 0 0.2rem rgba(249, 163, 146, 0.25);
}

/* Estilos para el input de archivo personalizado cuando está deshabilitado */
.custom-file-input[disabled] ~ .custom-file-label,
.custom-file-input:disabled ~ .custom-file-label {
  background-color: #e9ecef;
}

/* Establece el texto "Browse" para el botón de navegación en inputs de archivo en inglés */
.custom-file-input:lang(en) ~ .custom-file-label::after {
  content: "Browse";
}

/* Permite personalizar el texto del botón de navegación con el atributo data-browse */
.custom-file-input ~ .custom-file-label[data-browse]::after {
  content: attr(data-browse);
}

/* Estilos básicos para la etiqueta del input de archivo personalizado */
.custom-file-label {
  position: absolute;
  top: 0;
  right: 0;
  left: 0;
  z-index: 1;
  height: calc(1.5em + 0.75rem + 2px);
  padding: 0.375rem 0.75rem;
  font-weight: 400;
  line-height: 1.5;
  color: #495057;
  background-color: #fff;
  border: 1px solid #ced4da;
}

/* Crea el botón "Browse" en la etiqueta del input de archivo personalizado */
.custom-file-label::after {
  position: absolute;
  top: 0;
  right: 0;
  bottom: 0;
  z-index: 3;
  display: block;
  height: calc(1.5em + 0.75rem);
  padding: 0.375rem 0.75rem;
  line-height: 1.5;
  color: #495057;
  content: "Browse";
  background-color: #e9ecef;
  border-left: inherit;
}

/* Estilos básicos para inputs de rango personalizados */
.custom-range {
  width: 100%;
  height: 1.4rem;
  padding: 0;
  background-color: transparent;
  appearance: none;
}

/* Elimina el contorno predeterminado al enfocar inputs de rango */
.custom-range:focus {
  outline: none;
}

/* Estilos para el control deslizante (thumb) en Chrome/Safari cuando está enfocado */
.custom-range:focus::-webkit-slider-thumb {
  box-shadow: 0 0 0 1px #fff, 0 0 0 0.2rem rgba(249, 163, 146, 0.25);
}

/* Estilos para el control deslizante (thumb) en Firefox cuando está enfocado */
.custom-range:focus::-moz-range-thumb {
  box-shadow: 0 0 0 1px #fff, 0 0 0 0.2rem rgba(249, 163, 146, 0.25);
}

/* Estilos para el control deslizante (thumb) en IE cuando está enfocado */
.custom-range:focus::-ms-thumb {
  box-shadow: 0 0 0 1px #fff, 0 0 0 0.2rem rgba(249, 163, 146, 0.25);
}

/* Elimina el borde en Firefox cuando el control está enfocado */
.custom-range::-moz-focus-outer {
  border: 0;
}

/* Estilos para el control deslizante (thumb) en Chrome/Safari */
.custom-range::-webkit-slider-thumb {
  width: 1rem;
  height: 1rem;
  margin-top: -0.25rem;
  background-color: #F9A392;
  border: 0;
  transition: background-color 0.15s ease-in-out, border-color 0.15s ease-in-out, box-shadow 0.15s ease-in-out;
  appearance: none;
}

/* Desactiva las transiciones si el usuario prefiere movimiento reducido */
@media (prefers-reduced-motion: reduce) {
  .custom-range::-webkit-slider-thumb {
    transition: none;
  }
}

/* Cambia el color de fondo cuando el control deslizante está activo en Chrome/Safari */
.custom-range::-webkit-slider-thumb:active {
  background-color: white;
}

/* Estilos para la pista del control deslizante en Chrome/Safari */
.custom-range::-webkit-slider-runnable-track {
  width: 100%;
  height: 0.5rem;
  color: transparent;
  cursor: pointer;
  background-color: #dee2e6;
  border-color: transparent;
}

/* Estilos para el control deslizante (thumb) en Firefox */
.custom-range::-moz-range-thumb {
  width: 1rem;
  height: 1rem;
  background-color: #F9A392;
  border: 0;
  transition: background-color 0.15s ease-in-out, border-color 0.15s ease-in-out, box-shadow 0.15s ease-in-out;
  appearance: none;
}

/* Desactiva las transiciones si el usuario prefiere movimiento reducido */
@media (prefers-reduced-motion: reduce) {
  .custom-range::-moz-range-thumb {
    transition: none;
  }
}

/* Cambia el color de fondo cuando el control deslizante está activo en Firefox */
.custom-range::-moz-range-thumb:active {
  background-color: white;
}

/* Estilos para la pista del control deslizante en Firefox */
.custom-range::-moz-range-track {
  width: 100%;
  height: 0.5rem;
  color: transparent;
  cursor: pointer;
  background-color: #dee2e6;
  border-color: transparent;
}

/* Estilos para el control deslizante (thumb) en IE */
.custom-range::-ms-thumb {
  width: 1rem;
  height: 1rem;
  margin-top: 0;
  margin-right: 0.2rem;
  margin-left: 0.2rem;
  background-color: #F9A392;
  border: 0;
  transition: background-color 0.15s ease-in-out, border-color 0.15s ease-in-out, box-shadow 0.15s ease-in-out;
  appearance: none;
}

/* Desactiva las transiciones si el usuario prefiere movimiento reducido */
@media (prefers-reduced-motion: reduce) {
  .custom-range::-ms-thumb {
    transition: none;
  }
}

/* Cambia el color de fondo cuando el control deslizante está activo en IE */
.custom-range::-ms-thumb:active {
  background-color: white;
}

/* Estilos para la pista del control deslizante en IE */
.custom-range::-ms-track {
  width: 100%;
  height: 0.5rem;
  color: transparent;
  cursor: pointer;
  background-color: transparent;
  border-color: transparent;
  border-width: 0.5rem;
}

/* Estilos para la parte inferior del rango en IE */
.custom-range::-ms-fill-lower {
  background-color: #dee2e6;
}

/* Estilos para la parte superior del rango en IE */
.custom-range::-ms-fill-upper {
  margin-right: 15px;
  background-color: #dee2e6;
}

/* Estilos para el control deslizante deshabilitado en Chrome/Safari */
.custom-range:disabled::-webkit-slider-thumb {
  background-color: #adb5bd;
}

/* Cambia el cursor para la pista cuando está deshabilitado en Chrome/Safari */
.custom-range:disabled::-webkit-slider-runnable-track {
  cursor: default;
}

/* Estilos para el control deslizante deshabilitado en Firefox */
.custom-range:disabled::-moz-range-thumb {
  background-color: #adb5bd;
}

/* Cambia el cursor para la pista cuando está deshabilitado en Firefox */
.custom-range:disabled::-moz-range-track {
  cursor: default;
}

/* Estilos para el control deslizante deshabilitado en IE */
.custom-range:disabled::-ms-thumb {
  background-color: #adb5bd;
}

/* Añade transiciones suaves para varios elementos de formulario personalizados */
.custom-control-label::before,
.custom-file-label,
.custom-select {
  transition: background-color 0.15s ease-in-out, border-color 0.15s ease-in-out, box-shadow 0.15s ease-in-out;
}

/* Desactiva las transiciones si el usuario prefiere movimiento reducido */
@media (prefers-reduced-motion: reduce) {
  .custom-control-label::before,
  .custom-file-label,
  .custom-select {
    transition: none;
  }
}

/* Configuración básica para elementos de navegación usando flexbox */
.nav {
  display: flex;
  flex-wrap: wrap;
  padding-left: 0;
  margin-bottom: 0;
  list-style: none;
}

/* Estilos para los enlaces dentro de la navegación */
.nav-link {
  display: block;
  padding: 0.5rem 1rem;
}

/* Estilos para los enlaces de navegación al pasar el ratón o enfocar */
.nav-link:hover, .nav-link:focus {
  text-decoration: none;
}

/* Estilos para los enlaces de navegación deshabilitados */
.nav-link.disabled {
  color: #6c757d;
  pointer-events: none;
  cursor: default;
}

/* Estilos para la navegación con pestañas */
.nav-tabs {
  border-bottom: 1px solid #dee2e6;
}

/* Ajusta el margen inferior para elementos dentro de pestañas */
.nav-tabs .nav-item {
  margin-bottom: -1px;
}

/* Estilos para los enlaces dentro de pestañas */
.nav-tabs .nav-link {
  border: 1px solid transparent;
}

/* Estilos para los enlaces de pestañas al pasar el ratón o enfocar */
.nav-tabs .nav-link:hover, .nav-tabs .nav-link:focus {
  border-color: #e9ecef #e9ecef #dee2e6;
}

/* Estilos para los enlaces de pestañas deshabilitados */
.nav-tabs .nav-link.disabled {
  color: #6c757d;
  background-color: transparent;
  border-color: transparent;
}

/* Estilos para la pestaña activa o mostrada */
.nav-tabs .nav-link.active,
.nav-tabs .nav-item.show .nav-link {
  color: #495057;
  background-color: #fff;
  border-color: #dee2e6 #dee2e6 #fff;
}

/* Ajusta el margen superior para menús desplegables en pestañas */
.nav-tabs .dropdown-menu {
  margin-top: -1px;
}

/* Estilos para enlaces activos en navegación tipo píldora */
.nav-pills .nav-link.active,
.nav-pills .show > .nav-link {
  color: #fff;
  background-color: #F9A392;
}

/* Hace que los elementos de navegación llenen el espacio disponible */
.nav-fill > .nav-link,
.nav-fill .nav-item {
  flex: 1 1 auto;
  text-align: center;
}

/* Distribuye los elementos de navegación equitativamente */
.nav-justified > .nav-link,
.nav-justified .nav-item {
  flex-basis: 0;
  flex-grow: 1;
  text-align: center;
}

/* Oculta el contenido de las pestañas inactivas */
.tab-content > .tab-pane {
  display: none;
}

/* Muestra el contenido de la pestaña activa */
.tab-content > .active {
  display: block;
}

/* Configuración básica para la barra de navegación (navbar) */
.navbar {
  position: relative;
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  justify-content: space-between;
  padding: 0.5rem 1rem;
}

/* Ajustes para contenedores dentro de la barra de navegación */
.navbar .container,
.navbar .container-fluid, .navbar .container-sm, .navbar .container-md, .navbar .container-lg, .navbar .container-xl {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  justify-content: space-between;
}

/* Estilos para el logotipo o marca de la barra de navegación */
.navbar-brand {
  display: inline-block;      /* Muestra como elemento en línea con características de bloque */
  padding-top: 0.3125rem;     /* Relleno superior */
  padding-bottom: 0.3125rem;  /* Relleno inferior */
  margin-right: 1rem;         /* Margen derecho */
  font-size: 1.25rem;         /* Tamaño de fuente */
  line-height: inherit;       /* Altura de línea heredada */
  white-space: nowrap;        /* Evita que el texto se divida en múltiples líneas */
}

/* Estilos para estados hover y focus del logotipo */
.navbar-brand:hover, .navbar-brand:focus {
  text-decoration: none;      /* Elimina el subrayado en estos estados */
}

/* Contenedor principal para los elementos de navegación */
.navbar-nav {
  display: flex;              /* Usa flexbox para la disposición */
  flex-direction: column;     /* Coloca elementos en columna (por defecto) */
  padding-left: 0;            /* Sin relleno izquierdo */
  margin-bottom: 0;           /* Sin margen inferior */
  list-style: none;           /* Elimina los marcadores de lista */
}

/* Estilo para los enlaces dentro de la navegación */
.navbar-nav .nav-link {
  padding-right: 0;           /* Sin relleno derecho */
  padding-left: 0;            /* Sin relleno izquierdo */
}

/* Posicionamiento del menú desplegable dentro de la navegación */
.navbar-nav .dropdown-menu {
  position: static;           /* Posición estática por defecto (cambia en responsive) */
  float: none;                /* Sin flotación */
}

/* Estilo para el texto dentro de la barra de navegación */
.navbar-text {
  display: inline-block;      /* Muestra como elemento en línea con características de bloque */
  padding-top: 0.5rem;        /* Relleno superior */
  padding-bottom: 0.5rem;     /* Relleno inferior */
}

/* Contenedor para el área colapsable de la navegación */
.navbar-collapse {
  flex-basis: 100%;           /* Ocupa todo el ancho disponible */
  flex-grow: 1;               /* Puede crecer para llenar el espacio */
  align-items: center;        /* Alinea elementos al centro verticalmente */
}

/* Botón para mostrar/ocultar la navegación en dispositivos pequeños */
.navbar-toggler {
  padding: 0.25rem 0.75rem;   /* Relleno del botón */
  font-size: 1.25rem;         /* Tamaño de fuente */
  line-height: 1;             /* Altura de línea */
  background-color: transparent; /* Fondo transparente */
  border: 1px solid transparent; /* Borde transparente */
}

/* Estilos para estados hover y focus del botón toggler */
.navbar-toggler:hover, .navbar-toggler:focus {
  text-decoration: none;      /* Elimina el subrayado en estos estados */
}

/* Icono del botón de navegación (hamburguesa) */
.navbar-toggler-icon {
  display: inline-block;      /* Muestra como elemento en línea con características de bloque */
  width: 1.5em;               /* Ancho del icono */
  height: 1.5em;              /* Altura del icono */
  vertical-align: middle;     /* Alineación vertical */
  content: "";                /* Contenido vacío (se llena con imagen de fondo) */
  background: no-repeat center center; /* Posición del fondo */
  background-size: 100% 100%; /* Tamaño del fondo */
}

/* Media query para dispositivos pequeños (menos de 576px) */
@media (max-width: 575.98px) {
  .navbar-expand-sm > .container,
  .navbar-expand-sm > .container-fluid, .navbar-expand-sm > .container-sm, .navbar-expand-sm > .container-md, .navbar-expand-sm > .container-lg, .navbar-expand-sm > .container-xl {
    padding-right: 0;         /* Elimina el relleno derecho */
    padding-left: 0;          /* Elimina el relleno izquierdo */
  }
}

/* Media query para dispositivos small (576px o más) */
@media (min-width: 576px) {
  .navbar-expand-sm {
    flex-flow: row nowrap;     /* Disposición en fila sin envolver */
    justify-content: flex-start; /* Alineación al inicio */
  }
  .navbar-expand-sm .navbar-nav {
    flex-direction: row;       /* Cambia la disposición a fila */
  }
  .navbar-expand-sm .navbar-nav .dropdown-menu {
    position: absolute;        /* Cambia a posición absoluta para los desplegables */
  }
  .navbar-expand-sm .navbar-nav .nav-link {
    padding-right: 0.5rem;     /* Añade relleno derecho */
    padding-left: 0.5rem;      /* Añade relleno izquierdo */
  }
  .navbar-expand-sm > .container,
  .navbar-expand-sm > .container-fluid, .navbar-expand-sm > .container-sm, .navbar-expand-sm > .container-md, .navbar-expand-sm > .container-lg, .navbar-expand-sm > .container-xl {
    flex-wrap: nowrap;         /* Evita que los elementos se envuelvan */
  }
  .navbar-expand-sm .navbar-collapse {
    display: flex !important;  /* Muestra siempre el área colapsable */
    flex-basis: auto;          /* Base de flex automática */
  }
  .navbar-expand-sm .navbar-toggler {
    display: none;             /* Oculta el botón de navegación */
  }
}

/* Media query para dispositivos medium (menos de 768px) */
@media (max-width: 767.98px) {
  .navbar-expand-md > .container,
  .navbar-expand-md > .container-fluid, .navbar-expand-md > .container-sm, .navbar-expand-md > .container-md, .navbar-expand-md > .container-lg, .navbar-expand-md > .container-xl {
    padding-right: 0;          /* Elimina el relleno derecho */
    padding-left: 0;           /* Elimina el relleno izquierdo */
  }
}

/* Media query para dispositivos medium (768px o más) */
@media (min-width: 768px) {
  .navbar-expand-md {
    flex-flow: row nowrap;      /* Disposición en fila sin envolver */
    justify-content: flex-start; /* Alineación al inicio */
  }
  .navbar-expand-md .navbar-nav {
    flex-direction: row;        /* Cambia la disposición a fila */
  }
  .navbar-expand-md .navbar-nav .dropdown-menu {
    position: absolute;         /* Cambia a posición absoluta para los desplegables */
  }
  .navbar-expand-md .navbar-nav .nav-link {
    padding-right: 0.5rem;      /* Añade relleno derecho */
    padding-left: 0.5rem;       /* Añade relleno izquierdo */
  }
  .navbar-expand-md > .container,
  .navbar-expand-md > .container-fluid, .navbar-expand-md > .container-sm, .navbar-expand-md > .container-md, .navbar-expand-md > .container-lg, .navbar-expand-md > .container-xl {
    flex-wrap: nowrap;          /* Evita que los elementos se envuelvan */
  }
  .navbar-expand-md .navbar-collapse {
    display: flex !important;   /* Muestra siempre el área colapsable */
    flex-basis: auto;           /* Base de flex automática */
  }
  .navbar-expand-md .navbar-toggler {
    display: none;              /* Oculta el botón de navegación */
  }
}

/* Media query para dispositivos large (menos de 992px) */
@media (max-width: 991.98px) {
  .navbar-expand-lg > .container,
  .navbar-expand-lg > .container-fluid, .navbar-expand-lg > .container-sm, .navbar-expand-lg > .container-md, .navbar-expand-lg > .container-lg, .navbar-expand-lg > .container-xl {
    padding-right: 0;           /* Elimina el relleno derecho */
    padding-left: 0;            /* Elimina el relleno izquierdo */
  }
}

/* Media query para dispositivos large (992px o más) */
@media (min-width: 992px) {
  .navbar-expand-lg {
    flex-flow: row nowrap;      /* Disposición en fila sin envolver */
    justify-content: flex-start; /* Alineación al inicio */
  }
  .navbar-expand-lg .navbar-nav {
    flex-direction: row;        /* Cambia la disposición a fila */
  }
  .navbar-expand-lg .navbar-nav .dropdown-menu {
    position: absolute;         /* Cambia a posición absoluta para los desplegables */
  }
  .navbar-expand-lg .navbar-nav .nav-link {
    padding-right: 0.5rem;      /* Añade relleno derecho */
    padding-left: 0.5rem;       /* Añade relleno izquierdo */
  }
  .navbar-expand-lg > .container,
  .navbar-expand-lg > .container-fluid, .navbar-expand-lg > .container-sm, .navbar-expand-lg > .container-md, .navbar-expand-lg > .container-lg, .navbar-expand-lg > .container-xl {
    flex-wrap: nowrap;          /* Evita que los elementos se envuelvan */
  }
  .navbar-expand-lg .navbar-collapse {
    display: flex !important;   /* Muestra siempre el área colapsable */
    flex-basis: auto;           /* Base de flex automática */
  }
  .navbar-expand-lg .navbar-toggler {
    display: none;              /* Oculta el botón de navegación */
  }
}

/* Media query para dispositivos extra large (menos de 1200px) */
@media (max-width: 1199.98px) {
  .navbar-expand-xl > .container,
  .navbar-expand-xl > .container-fluid, .navbar-expand-xl > .container-sm, .navbar-expand-xl > .container-md, .navbar-expand-xl > .container-lg, .navbar-expand-xl > .container-xl {
    padding-right: 0;           /* Elimina el relleno derecho */
    padding-left: 0;            /* Elimina el relleno izquierdo */
  }
}

/* Media query para dispositivos extra large (1200px o más) */
@media (min-width: 1200px) {
  .navbar-expand-xl {
    flex-flow: row nowrap;      /* Disposición en fila sin envolver */
    justify-content: flex-start; /* Alineación al inicio */
  }
  .navbar-expand-xl .navbar-nav {
    flex-direction: row;        /* Cambia la disposición a fila */
  }
  .navbar-expand-xl .navbar-nav .dropdown-menu {
    position: absolute;         /* Cambia a posición absoluta para los desplegables */
  }
  .navbar-expand-xl .navbar-nav .nav-link {
    padding-right: 0.5rem;      /* Añade relleno derecho */
    padding-left: 0.5rem;       /* Añade relleno izquierdo */
  }
  .navbar-expand-xl > .container,
  .navbar-expand-xl > .container-fluid, .navbar-expand-xl > .container-sm, .navbar-expand-xl > .container-md, .navbar-expand-xl > .container-lg, .navbar-expand-xl > .container-xl {
    flex-wrap: nowrap;          /* Evita que los elementos se envuelvan */
  }
  .navbar-expand-xl .navbar-collapse {
    display: flex !important;   /* Muestra siempre el área colapsable */
    flex-basis: auto;           /* Base de flex automática */
  }
  .navbar-expand-xl .navbar-toggler {
    display: none;              /* Oculta el botón de navegación */
  }
}

/* Estilos para una barra de navegación que siempre estará expandida */
.navbar-expand {
  flex-flow: row nowrap;        /* Disposición en fila sin envolver */
  justify-content: flex-start;  /* Alineación al inicio */
}

.navbar-expand > .container,
.navbar-expand > .container-fluid, .navbar-expand > .container-sm, .navbar-expand > .container-md, .navbar-expand > .container-lg, .navbar-expand > .container-xl {
  padding-right: 0;             /* Elimina el relleno derecho */
  padding-left: 0;              /* Elimina el relleno izquierdo */
}

.navbar-expand .navbar-nav {
  flex-direction: row;          /* Disposición en fila */
}

.navbar-expand .navbar-nav .dropdown-menu {
  position: absolute;           /* Posición absoluta para los desplegables */
}

.navbar-expand .navbar-nav .nav-link {
  padding-right: 0.5rem;        /* Relleno derecho */
  padding-left: 0.5rem;         /* Relleno izquierdo */
}

.navbar-expand > .container,
.navbar-expand > .container-fluid, .navbar-expand > .container-sm, .navbar-expand > .container-md, .navbar-expand > .container-lg, .navbar-expand > .container-xl {
  flex-wrap: nowrap;            /* Evita que los elementos se envuelvan */
}

.navbar-expand .navbar-collapse {
  display: flex !important;     /* Muestra siempre el área colapsable */
  flex-basis: auto;             /* Base de flex automática */
}

.navbar-expand .navbar-toggler {
  display: none;                /* Oculta el botón de navegación */
}

/* Estilos para la barra de navegación con tema claro */
.navbar-light .navbar-brand {
  color: rgba(0, 0, 0, 0.9);    /* Color oscuro para el logotipo */
}

.navbar-light .navbar-brand:hover, .navbar-light .navbar-brand:focus {
  color: rgba(0, 0, 0, 0.9);    /* Mismo color en estados hover y focus */
}

.navbar-light .navbar-nav .nav-link {
  color: rgba(0, 0, 0, 0.5);    /* Color medio-oscuro para los enlaces */
}

.navbar-light .navbar-nav .nav-link:hover, .navbar-light .navbar-nav .nav-link:focus {
  color: rgba(0, 0, 0, 0.7);    /* Color más oscuro en estados hover y focus */
}

.navbar-light .navbar-nav .nav-link.disabled {
  color: rgba(0, 0, 0, 0.3);    /* Color más claro para enlaces deshabilitados */
}

.navbar-light .navbar-nav .show > .nav-link,
.navbar-light .navbar-nav .active > .nav-link,
.navbar-light .navbar-nav .nav-link.show,
.navbar-light .navbar-nav .nav-link.active {
  color: rgba(0, 0, 0, 0.9);    /* Color más oscuro para enlaces activos */
}

.navbar-light .navbar-toggler {
  color: rgba(0, 0, 0, 0.5);    /* Color para el botón de navegación */
  border-color: rgba(0, 0, 0, 0.1); /* Color del borde del botón */
}

.navbar-light .navbar-toggler-icon {
  background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' width='30' height='30' viewBox='0 0 30 30'%3e%3cpath stroke='rgba%280, 0, 0, 0.5%29' stroke-linecap='round' stroke-miterlimit='10' stroke-width='2' d='M4 7h22M4 15h22M4 23h22'/%3e%3c/svg%3e");
  /* Imagen SVG para el icono de hamburguesa en tema claro */
}

.navbar-light .navbar-text {
  color: rgba(0, 0, 0, 0.5);    /* Color para el texto en la barra */
}

.navbar-light .navbar-text a {
  color: rgba(0, 0, 0, 0.9);    /* Color para enlaces dentro del texto */
}

.navbar-light .navbar-text a:hover, .navbar-light .navbar-text a:focus {
  color: rgba(0, 0, 0, 0.9);    /* Mismo color en estados hover y focus */
}

/* Estilos para la barra de navegación con tema oscuro */
.navbar-dark .navbar-brand {
  color: #fff;                  /* Color blanco para el logotipo */
}

.navbar-dark .navbar-brand:hover, .navbar-dark .navbar-brand:focus {
  color: #fff;                  /* Mismo color en estados hover y focus */
}

.navbar-dark .navbar-nav .nav-link {
  color: rgba(255, 255, 255, 0.5); /* Color blanco semi-transparente para enlaces */
}

.navbar-dark .navbar-nav .nav-link:hover, .navbar-dark .navbar-nav .nav-link:focus {
  color: rgba(255, 255, 255, 0.75); /* Color más brillante en estados hover y focus */
}

.navbar-dark .navbar-nav .nav-link.disabled {
  color: rgba(255, 255, 255, 0.25); /* Color más tenue para enlaces deshabilitados */
}

.navbar-dark .navbar-nav .show > .nav-link,
.navbar-dark .navbar-nav .active > .nav-link,
.navbar-dark .navbar-nav .nav-link.show,
.navbar-dark .navbar-nav .nav-link.active {
  color: #fff;                  /* Color blanco completo para enlaces activos */
}

.navbar-dark .navbar-toggler {
  color: rgba(255, 255, 255, 0.5); /* Color para el botón de navegación */
  border-color: rgba(255, 255, 255, 0.1); /* Color del borde del botón */
}

.navbar-dark .navbar-toggler-icon {
  background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' width='30' height='30' viewBox='0 0 30 30'%3e%3cpath stroke='rgba%28255, 255, 255, 0.5%29' stroke-linecap='round' stroke-miterlimit='10' stroke-width='2' d='M4 7h22M4 15h22M4 23h22'/%3e%3c/svg%3e");
  /* Imagen SVG para el icono de hamburguesa en tema oscuro */
}

.navbar-dark .navbar-text {
  color: rgba(255, 255, 255, 0.5); /* Color para el texto en la barra */
}

.navbar-dark .navbar-text a {
  color: #fff;                  /* Color para enlaces dentro del texto */
}

.navbar-dark .navbar-text a:hover, .navbar-dark .navbar-text a:focus {
  color: #fff;                  /* Mismo color en estados hover y focus */
}

/* Estilos básicos para tarjetas (parece estar incompleto) */
.card {
  position: relative;           /* Posición relativa */
  display: flex;                /* Usa flexbox */
  flex-direction: column;       /* Disposición en columna */
  min-width: 0;                 /* Ancho mínimo */
  word-wrap: break-word;        /* Permite romper palabras largas */
  background-color: #fff;       /* Fondo blanco */
  background-clip: border-box;  /* Área de fondo incluye el borde */
  border: 1px solid rgba(0, 0, 0, 0.125); /* Borde ligero */
}
/* Estilos para líneas horizontales dentro de tarjetas */
.card > hr {
  margin-right: 0;          /* Sin margen derecho */
  margin-left: 0;           /* Sin margen izquierdo */
}

/* Estilos para grupos de listas dentro de tarjetas */
.card > .list-group {
  border-top: inherit;      /* Hereda el borde superior */
  border-bottom: inherit;   /* Hereda el borde inferior */
}

/* Elimina el borde superior del primer grupo de lista */
.card > .list-group:first-child {
  border-top-width: 0;      /* Sin borde superior */
}

/* Elimina el borde inferior del último grupo de lista */
.card > .list-group:last-child {
  border-bottom-width: 0;   /* Sin borde inferior */
}

/* Elimina bordes redundantes entre componentes */
.card > .card-header + .list-group,
.card > .list-group + .card-footer {
  border-top: 0;            /* Sin borde superior */
}

/* Cuerpo principal de la tarjeta */
.card-body {
  flex: 1 1 auto;           /* Crece y encoge, base automática */
  min-height: 1px;          /* Altura mínima */
  padding: 1.25rem;         /* Relleno interior */
}

/* Título de la tarjeta */
.card-title {
  margin-bottom: 0.75rem;   /* Margen inferior */
}

/* Subtítulo de la tarjeta */
.card-subtitle {
  margin-top: -0.375rem;    /* Margen superior negativo para acercar al título */
  margin-bottom: 0;         /* Sin margen inferior */
}

/* Elimina el margen inferior del último párrafo */
.card-text:last-child {
  margin-bottom: 0;         /* Sin margen inferior */
}

/* Estilos para enlaces dentro de tarjetas en estado hover */
.card-link:hover {
  text-decoration: none;    /* Sin subrayado */
}

/* Espaciado entre enlaces adyacentes */
.card-link + .card-link {
  margin-left: 1.25rem;     /* Margen izquierdo */
}

/* Encabezado de la tarjeta */
.card-header {
  padding: 0.75rem 1.25rem; /* Relleno interior */
  margin-bottom: 0;         /* Sin margen inferior */
  background-color: rgba(0, 0, 0, 0.03); /* Fondo ligeramente gris */
  border-bottom: 1px solid rgba(0, 0, 0, 0.125); /* Borde inferior ligero */
}

/* Pie de la tarjeta */
.card-footer {
  padding: 0.75rem 1.25rem; /* Relleno interior */
  background-color: rgba(0, 0, 0, 0.03); /* Fondo ligeramente gris */
  border-top: 1px solid rgba(0, 0, 0, 0.125); /* Borde superior ligero */
}

/* Pestañas en el encabezado de la tarjeta */
.card-header-tabs {
  margin-right: -0.625rem;  /* Margen negativo para alinear con el borde */
  margin-bottom: -0.75rem;  /* Margen negativo para alinear con el borde */
  margin-left: -0.625rem;   /* Margen negativo para alinear con el borde */
  border-bottom: 0;         /* Sin borde inferior */
}

/* Píldoras en el encabezado de la tarjeta */
.card-header-pills {
  margin-right: -0.625rem;  /* Margen negativo para alinear con el borde */
  margin-left: -0.625rem;   /* Margen negativo para alinear con el borde */
}

/* Superposición de imagen en tarjeta */
.card-img-overlay {
  position: absolute;       /* Posición absoluta */
  top: 0;                   /* Desde arriba */
  right: 0;                 /* Desde la derecha */
  bottom: 0;                /* Desde abajo */
  left: 0;                  /* Desde la izquierda */
  padding: 1.25rem;         /* Relleno interior */
}

/* Estilos comunes para imágenes en tarjetas */
.card-img,
.card-img-top,
.card-img-bottom {
  flex-shrink: 0;           /* No encoge */
  width: 100%;              /* Ancho completo */
}

/* Margen inferior para tarjetas en un deck */
.card-deck .card {
  margin-bottom: 15px;      /* Margen inferior */
}

/* Media query para deck de tarjetas en pantallas de 576px o más */
@media (min-width: 576px) {
  .card-deck {
    display: flex;          /* Usa flexbox */
    flex-flow: row wrap;    /* Disposición en fila con posibilidad de envolver */
    margin-right: -15px;    /* Margen negativo para compensar el margen de las tarjetas */
    margin-left: -15px;     /* Margen negativo para compensar el margen de las tarjetas */
  }
  .card-deck .card {
    flex: 1 0 0%;           /* Crece, no encoge, base 0% */
    margin-right: 15px;     /* Margen derecho */
    margin-bottom: 0;       /* Sin margen inferior */
    margin-left: 15px;      /* Margen izquierdo */
  }
}

/* Margen inferior para tarjetas en un grupo */
.card-group > .card {
  margin-bottom: 15px;      /* Margen inferior */
}

/* Media query para grupo de tarjetas en pantallas de 576px o más */
@media (min-width: 576px) {
  .card-group {
    display: flex;          /* Usa flexbox */
    flex-flow: row wrap;    /* Disposición en fila con posibilidad de envolver */
  }
  .card-group > .card {
    flex: 1 0 0%;           /* Crece, no encoge, base 0% */
    margin-bottom: 0;       /* Sin margen inferior */
  }
  .card-group > .card + .card {
    margin-left: 0;         /* Sin margen izquierdo entre tarjetas adyacentes */
    border-left: 0;         /* Sin borde izquierdo entre tarjetas adyacentes */
  }
}

/* Margen inferior para tarjetas en columnas */
.card-columns .card {
  margin-bottom: 0.75rem;   /* Margen inferior */
}

/* Media query para columnas de tarjetas en pantallas de 576px o más */
@media (min-width: 576px) {
  .card-columns {
    column-count: 3;        /* Número de columnas */
    column-gap: 1.25rem;    /* Espacio entre columnas */
    orphans: 1;             /* Mínimo de elementos antes de un salto de columna */
    widows: 1;              /* Mínimo de elementos después de un salto de columna */
  }
  .card-columns .card {
    display: inline-block;  /* Muestra como bloque en línea */
    width: 100%;            /* Ancho completo */
  }
}

/* Contenedor de acordeón */
.accordion {
  overflow-anchor: none;    /* Evita desplazamientos al expandir/contraer */
}

/* Tarjetas dentro de un acordeón */
.accordion > .card {
  overflow: hidden;         /* Oculta el contenido que sobresale */
}

/* Elimina el borde inferior excepto en la última tarjeta */
.accordion > .card:not(:last-of-type) {
  border-bottom: 0;         /* Sin borde inferior */
}

/* Ajuste del encabezado de la tarjeta en un acordeón */
.accordion > .card > .card-header {
  margin-bottom: -1px;      /* Margen negativo para unir con la siguiente tarjeta */
}

/* Estilos para la barra de migas de pan (breadcrumb) */
.breadcrumb {
  display: flex;            /* Usa flexbox */
  flex-wrap: wrap;          /* Permite envolver elementos */
  padding: 0.75rem 1rem;    /* Relleno interior */
  margin-bottom: 1rem;      /* Margen inferior */
  list-style: none;         /* Sin marcadores de lista */
  background-color: #e9ecef; /* Fondo gris claro */
}

/* Elementos individuales en la barra de migas */
.breadcrumb-item {
  display: flex;            /* Usa flexbox */
}

/* Espaciado entre elementos de migas de pan */
.breadcrumb-item + .breadcrumb-item {
  padding-left: 0.5rem;     /* Relleno izquierdo */
}

/* Separador entre elementos de migas de pan */
.breadcrumb-item + .breadcrumb-item::before {
  display: inline-block;    /* Muestra como bloque en línea */
  padding-right: 0.5rem;    /* Relleno derecho */
  color: #6c757d;           /* Color gris medio */
  content: "/";             /* Carácter separador */
}

/* Estilo hover para el separador */
.breadcrumb-item + .breadcrumb-item:hover::before {
  text-decoration: underline; /* Subrayado */
}

/* Elimina el subrayado en hover */
.breadcrumb-item + .breadcrumb-item:hover::before {
  text-decoration: none;    /* Sin subrayado */
}

/* Elemento activo en la miga de pan */
.breadcrumb-item.active {
  color: #6c757d;           /* Color gris medio */
}

/* Contenedor de paginación */
.pagination {
  display: flex;            /* Usa flexbox */
  padding-left: 0;          /* Sin relleno izquierdo */
  list-style: none;         /* Sin marcadores de lista */
}

/* Enlaces individuales de paginación */
.page-link {
  position: relative;       /* Posición relativa */
  display: block;           /* Muestra como bloque */
  padding: 0.5rem 0.75rem;  /* Relleno interior */
  margin-left: -1px;        /* Margen izquierdo negativo para unir elementos */
  line-height: 1.25;        /* Altura de línea */
  color: #F9A392;           /* Color de texto (salmón) */
  background-color: #fff;   /* Fondo blanco */
  border: 1px solid #dee2e6; /* Borde gris claro */
}

/* Estilo hover para enlaces de paginación */
.page-link:hover {
  z-index: 2;               /* Mayor z-index para sobreponerse */
  color: #f56649;           /* Color de texto más oscuro */
  text-decoration: none;    /* Sin subrayado */
  background-color: #e9ecef; /* Fondo gris claro */
  border-color: #dee2e6;    /* Color de borde gris claro */
}

/* Estilo focus para enlaces de paginación */
.page-link:focus {
  z-index: 3;               /* Mayor z-index que hover */
  outline: 0;               /* Sin contorno */
  box-shadow: 0 0 0 0.2rem rgba(249, 163, 146, 0.25); /* Sombra salmón claro */
}

/* Primer elemento de paginación */
.page-item:first-child .page-link {
  margin-left: 0;           /* Sin margen izquierdo */
}

/* Elemento de paginación activo */
.page-item.active .page-link {
  z-index: 3;               /* Mayor z-index */
  color: #fff;              /* Texto blanco */
  background-color: #F9A392; /* Fondo salmón */
  border-color: #F9A392;    /* Borde salmón */
}

/* Elemento de paginación deshabilitado */
.page-item.disabled .page-link {
  color: #6c757d;           /* Texto gris medio */
  pointer-events: none;     /* No responde a eventos */
  cursor: auto;             /* Cursor normal */
  background-color: #fff;   /* Fondo blanco */
  border-color: #dee2e6;    /* Borde gris claro */
}

/* Paginación grande */
.pagination-lg .page-link {
  padding: 0.75rem 1.5rem;  /* Relleno mayor */
  font-size: 1.25rem;       /* Texto más grande */
  line-height: 1.5;         /* Altura de línea */
}

/* Paginación pequeña */
.pagination-sm .page-link {
  padding: 0.25rem 0.5rem;  /* Relleno menor */
  font-size: 0.875rem;      /* Texto más pequeño */
  line-height: 1.5;         /* Altura de línea */
}

/* Estilos para insignias (badges) */
.badge {
  display: inline-block;    /* Muestra como bloque en línea */
  padding: 0.25em 0.4em;    /* Relleno interior */
  font-size: 75%;           /* Tamaño de fuente relativo */
  font-weight: 700;         /* Negrita */
  line-height: 1;           /* Altura de línea */
  text-align: center;       /* Texto centrado */
  white-space: nowrap;      /* Sin saltos de línea */
  vertical-align: baseline; /* Alineación vertical */
  transition: color 0.15s ease-in-out, background-color 0.15s ease-in-out, border-color 0.15s ease-in-out, box-shadow 0.15s ease-in-out;
  /* Transiciones suaves para cambios de estado */
}

/* Desactiva transiciones si el usuario prefiere menos movimiento */
@media (prefers-reduced-motion: reduce) {
  .badge {
    transition: none;       /* Sin transiciones */
  }
}

/* Estilos para insignias como enlaces */
a.badge:hover, a.badge:focus {
  text-decoration: none;    /* Sin subrayado */
}

/* Oculta insignias vacías */
.badge:empty {
  display: none;            /* No se muestra */
}

/* Posición de insignias en botones */
.btn .badge {
  position: relative;       /* Posición relativa */
  top: -1px;                /* Desplazamiento hacia arriba */
}

/* Insignia con forma de píldora */
.badge-pill {
  padding-right: 0.6em;     /* Más relleno horizontal */
  padding-left: 0.6em;      /* Más relleno horizontal */
}

/* Insignia con color primario (salmón) */
.badge-primary {
  color: #212529;           /* Texto oscuro */
  background-color: #F9A392; /* Fondo salmón */
}

/* Estilos para insignias primarias como enlaces */
a.badge-primary:hover, a.badge-primary:focus {
  color: #212529;           /* Texto oscuro */
  background-color: #f67a62; /* Fondo salmón más oscuro */
}

/* Estilos focus para insignias primarias */
a.badge-primary:focus, a.badge-primary.focus {
  outline: 0;               /* Sin contorno */
  box-shadow: 0 0 0 0.2rem rgba(249, 163, 146, 0.5); /* Sombra salmón */
}

/* Insignia con color secundario (azul claro) */
.badge-secondary {
  color: #212529;           /* Texto oscuro */
  background-color: #6EBBF6; /* Fondo azul claro */
}

/* Estilos para insignias secundarias como enlaces */
a.badge-secondary:hover, a.badge-secondary:focus {
  color: #212529;           /* Texto oscuro */
  background-color: #3ea4f3; /* Fondo azul más oscuro */
}

a.badge-secondary:focus, a.badge-secondary.focus {
  outline: 0;
  box-shadow: 0 0 0 0.2rem rgba(110, 187, 246, 0.5);
}

.badge-success {
  color: #fff;
  background-color: #28a745;
}

a.badge-success:hover, a.badge-success:focus {
  color: #fff;
  background-color: #1e7e34;
}

a.badge-success:focus, a.badge-success.focus {
  outline: 0;
  box-shadow: 0 0 0 0.2rem rgba(40, 167, 69, 0.5);
}

.badge-info {
  color: #fff;
  background-color: #17a2b8;
}

a.badge-info:hover, a.badge-info:focus {
  color: #fff;
  background-color: #117a8b;
}

a.badge-info:focus, a.badge-info.focus {
  outline: 0;
  box-shadow: 0 0 0 0.2rem rgba(23, 162, 184, 0.5);
}

.badge-warning {
  color: #212529;
  background-color: #ffc107;
}

a.badge-warning:hover, a.badge-warning:focus {
  color: #212529;
  background-color: #d39e00;
}

a.badge-warning:focus, a.badge-warning.focus {
  outline: 0;
  box-shadow: 0 0 0 0.2rem rgba(255, 193, 7, 0.5);
}

.badge-danger {
  color: #fff;
  background-color: #dc3545;
}

a.badge-danger:hover, a.badge-danger:focus {
  color: #fff;
  background-color: #bd2130;
}

a.badge-danger:focus, a.badge-danger.focus {
  outline: 0;
  box-shadow: 0 0 0 0.2rem rgba(220, 53, 69, 0.5);
}

.badge-light {
  color: #212529;
  background-color: #FEF1EF;
}

a.badge-light:hover, a.badge-light:focus {
  color: #212529;
  background-color: #fbc7bf;
}

a.badge-light:focus, a.badge-light.focus {
  outline: 0;
  box-shadow: 0 0 0 0.2rem rgba(254, 241, 239, 0.5);
}

.badge-dark {
  color: #fff;
  background-color: #211E1C;
}

a.badge-dark:hover, a.badge-dark:focus {
  color: #fff;
  background-color: #050505;
}

a.badge-dark:focus, a.badge-dark.focus {
  outline: 0;
  box-shadow: 0 0 0 0.2rem rgba(33, 30, 28, 0.5);
}

.jumbotron {
  padding: 2rem 1rem;
  margin-bottom: 2rem;
  background-color: #e9ecef;
}

@media (min-width: 576px) {
  .jumbotron {
    padding: 4rem 2rem;
  }
}

.jumbotron-fluid {
  padding-right: 0;
  padding-left: 0;
}

.alert {
  position: relative;
  padding: 0.75rem 1.25rem;
  margin-bottom: 1rem;
  border: 1px solid transparent;
}

.alert-heading {
  color: inherit;
}

.alert-link {
  font-weight: 700;
}

.alert-dismissible {
  padding-right: 4rem;
}

.alert-dismissible .close {
  position: absolute;
  top: 0;
  right: 0;
  z-index: 2;
  padding: 0.75rem 1.25rem;
  color: inherit;
}

.alert-primary {
  color: #81554c;
  background-color: #feede9;
  border-color: #fde5e0;
}

.alert-primary hr {
  border-top-color: #fbd1c8;
}

.alert-primary .alert-link {
  color: #614039;
}

.alert-secondary {
  color: #396180;
  background-color: #e2f1fd;
  border-color: #d6ecfc;
}

.alert-secondary hr {
  border-top-color: #bee1fa;
}

.alert-secondary .alert-link {
  color: #29465d;
}

.alert-success {
  color: #155724;
  background-color: #d4edda;
  border-color: #c3e6cb;
}

.alert-success hr {
  border-top-color: #b1dfbb;
}

.alert-success .alert-link {
  color: #0b2e13;
}

.alert-info {
  color: #0c5460;
  background-color: #d1ecf1;
  border-color: #bee5eb;
}

.alert-info hr {
  border-top-color: #abdde5;
}

.alert-info .alert-link {
  color: #062c33;
}

.alert-warning {
  color: #856404;
  background-color: #fff3cd;
  border-color: #ffeeba;
}

.alert-warning hr {
  border-top-color: #ffe8a1;
}

.alert-warning .alert-link {
  color: #533f03;
}

.alert-danger {
  color: #721c24;
  background-color: #f8d7da;
  border-color: #f5c6cb;
}

.alert-danger hr {
  border-top-color: #f1b0b7;
}

.alert-danger .alert-link {
  color: #491217;
}

.alert-light {
  color: #847d7c;
  background-color: #fffcfc;
  border-color: #fffbfb;
}

.alert-light hr {
  border-top-color: #ffe2e2;
}

.alert-light .alert-link {
  color: #6a6463;
}

.alert-dark {
  color: #11100f;
  background-color: #d3d2d2;
  border-color: #c1c0bf;
}

.alert-dark hr {
  border-top-color: #b4b3b2;
}

.alert-dark .alert-link {
  color: black;
}

@keyframes progress-bar-stripes {
  from {
    background-position: 1rem 0;
  }
  to {
    background-position: 0 0;
  }
}

.progress {
  display: flex;
  height: 1rem;
  overflow: hidden;
  line-height: 0;
  font-size: 0.75rem;
  background-color: #e9ecef;
}

.progress-bar {
  display: flex;
  flex-direction: column;
  justify-content: center;
  overflow: hidden;
  color: #fff;
  text-align: center;
  white-space: nowrap;
  background-color: #F9A392;
  transition: width 0.6s ease;
}

@media (prefers-reduced-motion: reduce) {
  .progress-bar {
    transition: none;
  }
}

.progress-bar-striped {
  background-image: linear-gradient(45deg, rgba(255, 255, 255, 0.15) 25%, transparent 25%, transparent 50%, rgba(255, 255, 255, 0.15) 50%, rgba(255, 255, 255, 0.15) 75%, transparent 75%, transparent);
  background-size: 1rem 1rem;
}

.progress-bar-animated {
  animation: progress-bar-stripes 1s linear infinite;
}

@media (prefers-reduced-motion: reduce) {
  .progress-bar-animated {
    animation: none;
  }
}

.media {
  display: flex;
  align-items: flex-start;
}

.media-body {
  flex: 1;
}

.list-group {
  display: flex;
  flex-direction: column;
  padding-left: 0;
  margin-bottom: 0;
}

.list-group-item-action {
  width: 100%;
  color: #495057;
  text-align: inherit;
}

.list-group-item-action:hover, .list-group-item-action:focus {
  z-index: 1;
  color: #495057;
  text-decoration: none;
  background-color: #f8f9fa;
}

.list-group-item-action:active {
  color: #757575;
  background-color: #e9ecef;
}

.list-group-item {
  position: relative;
  display: block;
  padding: 0.75rem 1.25rem;
  background-color: #fff;
  border: 1px solid rgba(0, 0, 0, 0.125);
}

.list-group-item.disabled, .list-group-item:disabled {
  color: #6c757d;
  pointer-events: none;
  background-color: #fff;
}

.list-group-item.active {
  z-index: 2;
  color: #fff;
  background-color: #F9A392;
  border-color: #F9A392;
}

.list-group-item + .list-group-item {
  border-top-width: 0;
}

.list-group-item + .list-group-item.active {
  margin-top: -1px;
  border-top-width: 1px;
}

.list-group-horizontal {
  flex-direction: row;
}

.list-group-horizontal > .list-group-item.active {
  margin-top: 0;
}

.list-group-horizontal > .list-group-item + .list-group-item {
  border-top-width: 1px;
  border-left-width: 0;
}

.list-group-horizontal > .list-group-item + .list-group-item.active {
  margin-left: -1px;
  border-left-width: 1px;
}

@media (min-width: 576px) {
  .list-group-horizontal-sm {
    flex-direction: row;
  }
  .list-group-horizontal-sm > .list-group-item.active {
    margin-top: 0;
  }
  .list-group-horizontal-sm > .list-group-item + .list-group-item {
    border-top-width: 1px;
    border-left-width: 0;
  }
  .list-group-horizontal-sm > .list-group-item + .list-group-item.active {
    margin-left: -1px;
    border-left-width: 1px;
  }
}

@media (min-width: 768px) {
  .list-group-horizontal-md {
    flex-direction: row;
  }
  .list-group-horizontal-md > .list-group-item.active {
    margin-top: 0;
  }
  .list-group-horizontal-md > .list-group-item + .list-group-item {
    border-top-width: 1px;
    border-left-width: 0;
  }
  .list-group-horizontal-md > .list-group-item + .list-group-item.active {
    margin-left: -1px;
    border-left-width: 1px;
  }
}

@media (min-width: 992px) {
  .list-group-horizontal-lg {
    flex-direction: row;
  }
  .list-group-horizontal-lg > .list-group-item.active {
    margin-top: 0;
  }
  .list-group-horizontal-lg > .list-group-item + .list-group-item {
    border-top-width: 1px;
    border-left-width: 0;
  }
  .list-group-horizontal-lg > .list-group-item + .list-group-item.active {
    margin-left: -1px;
    border-left-width: 1px;
  }
}

@media (min-width: 1200px) {
  .list-group-horizontal-xl {
    flex-direction: row;
  }
  .list-group-horizontal-xl > .list-group-item.active {
    margin-top: 0;
  }
  .list-group-horizontal-xl > .list-group-item + .list-group-item {
    border-top-width: 1px;
    border-left-width: 0;
  }
  .list-group-horizontal-xl > .list-group-item + .list-group-item.active {
    margin-left: -1px;
    border-left-width: 1px;
  }
}

.list-group-flush > .list-group-item {
  border-width: 0 0 1px;
}

.list-group-flush > .list-group-item:last-child {
  border-bottom-width: 0;
}

.list-group-item-primary {
  color: #81554c;
  background-color: #fde5e0;
}

.list-group-item-primary.list-group-item-action:hover, .list-group-item-primary.list-group-item-action:focus {
  color: #81554c;
  background-color: #fbd1c8;
}

.list-group-item-primary.list-group-item-action.active {
  color: #fff;
  background-color: #81554c;
  border-color: #81554c;
}

.list-group-item-secondary {
  color: #396180;
  background-color: #d6ecfc;
}

.list-group-item-secondary.list-group-item-action:hover, .list-group-item-secondary.list-group-item-action:focus {
  color: #396180;
  background-color: #bee1fa;
}

.list-group-item-secondary.list-group-item-action.active {
  color: #fff;
  background-color: #396180;
  border-color: #396180;
}

.list-group-item-success {
  color: #155724;
  background-color: #c3e6cb;
}

.list-group-item-success.list-group-item-action:hover, .list-group-item-success.list-group-item-action:focus {
  color: #155724;
  background-color: #b1dfbb;
}

.list-group-item-success.list-group-item-action.active {
  color: #fff;
  background-color: #155724;
  border-color: #155724;
}

.list-group-item-info {
  color: #0c5460;
  background-color: #bee5eb;
}

.list-group-item-info.list-group-item-action:hover, .list-group-item-info.list-group-item-action:focus {
  color: #0c5460;
  background-color: #abdde5;
}

.list-group-item-info.list-group-item-action.active {
  color: #fff;
  background-color: #0c5460;
  border-color: #0c5460;
}

.list-group-item-warning {
  color: #856404;
  background-color: #ffeeba;
}

.list-group-item-warning.list-group-item-action:hover, .list-group-item-warning.list-group-item-action:focus {
  color: #856404;
  background-color: #ffe8a1;
}

.list-group-item-warning.list-group-item-action.active {
  color: #fff;
  background-color: #856404;
  border-color: #856404;
}

.list-group-item-danger {
  color: #721c24;
  background-color: #f5c6cb;
}

.list-group-item-danger.list-group-item-action:hover, .list-group-item-danger.list-group-item-action:focus {
  color: #721c24;
  background-color: #f1b0b7;
}

.list-group-item-danger.list-group-item-action.active {
  color: #fff;
  background-color: #721c24;
  border-color: #721c24;
}

.list-group-item-light {
  color: #847d7c;
  background-color: #fffbfb;
}

.list-group-item-light.list-group-item-action:hover, .list-group-item-light.list-group-item-action:focus {
  color: #847d7c;
  background-color: #ffe2e2;
}

.list-group-item-light.list-group-item-action.active {
  color: #fff;
  background-color: #847d7c;
  border-color: #847d7c;
}

.list-group-item-dark {
  color: #11100f;
  background-color: #c1c0bf;
}

.list-group-item-dark.list-group-item-action:hover, .list-group-item-dark.list-group-item-action:focus {
  color: #11100f;
  background-color: #b4b3b2;
}

.list-group-item-dark.list-group-item-action.active {
  color: #fff;
  background-color: #11100f;
  border-color: #11100f;
}

.close {
  float: right;
  font-size: 1.5rem;
  font-weight: 700;
  line-height: 1;
  color: #000;
  text-shadow: 0 1px 0 #fff;
  opacity: .5;
}

@media (max-width: 1200px) {
  .close {
    font-size: calc(1.275rem + 0.3vw) ;
  }
}

.close:hover {
  color: #000;
  text-decoration: none;
}

.close:not(:disabled):not(.disabled):hover, .close:not(:disabled):not(.disabled):focus {
  opacity: .75;
}

button.close {
  padding: 0;
  background-color: transparent;
  border: 0;
}

a.close.disabled {
  pointer-events: none;
}

.toast {
  flex-basis: 350px;
  max-width: 350px;
  font-size: 0.875rem;
  background-color: rgba(255, 255, 255, 0.85);
  background-clip: padding-box;
  border: 1px solid rgba(0, 0, 0, 0.1);
  box-shadow: 0 0.25rem 0.75rem rgba(0, 0, 0, 0.1);
  opacity: 0;
}

.toast:not(:last-child) {
  margin-bottom: 0.75rem;
}

.toast.showing {
  opacity: 1;
}

.toast.show {
  display: block;
  opacity: 1;
}

.toast.hide {
  display: none;
}

.toast-header {
  display: flex;
  align-items: center;
  padding: 0.25rem 0.75rem;
  color: #6c757d;
  background-color: rgba(255, 255, 255, 0.85);
  background-clip: padding-box;
  border-bottom: 1px solid rgba(0, 0, 0, 0.05);
}

.toast-body {
  padding: 0.75rem;
}

.modal-open {
  overflow: hidden;
}

.modal-open .modal {
  overflow-x: hidden;
  overflow-y: auto;
}

.modal {
  position: fixed;
  top: 0;
  left: 0;
  z-index: 1050;
  display: none;
  width: 100%;
  height: 100%;
  overflow: hidden;
  outline: 0;
}

.modal-dialog {
  position: relative;
  width: auto;
  margin: 0.5rem;
  pointer-events: none;
}

.modal.fade .modal-dialog {
  transition: transform 0.3s ease-out;
  transform: translate(0, -50px);
}

@media (prefers-reduced-motion: reduce) {
  .modal.fade .modal-dialog {
    transition: none;
  }
}

.modal.show .modal-dialog {
  transform: none;
}

.modal.modal-static .modal-dialog {
  transform: scale(1.02);
}

.modal-dialog-scrollable {
  display: flex;
  max-height: calc(100% - 1rem);
}

.modal-dialog-scrollable .modal-content {
  max-height: calc(100vh - 1rem);
  overflow: hidden;
}

.modal-dialog-scrollable .modal-header,
.modal-dialog-scrollable .modal-footer {
  flex-shrink: 0;
}

.modal-dialog-scrollable .modal-body {
  overflow-y: auto;
}

.modal-dialog-centered {
  display: flex;
  align-items: center;
  min-height: calc(100% - 1rem);
}

.modal-dialog-centered::before {
  display: block;
  height: calc(100vh - 1rem);
  height: min-content;
  content: "";
}

.modal-dialog-centered.modal-dialog-scrollable {
  flex-direction: column;
  justify-content: center;
  height: 100%;
}

.modal-dialog-centered.modal-dialog-scrollable .modal-content {
  max-height: none;
}

.modal-dialog-centered.modal-dialog-scrollable::before {
  content: none;
}

.modal-content {
  position: relative;
  display: flex;
  flex-direction: column;
  width: 100%;
  pointer-events: auto;
  background-color: #fff;
  background-clip: padding-box;
  border: 1px solid rgba(0, 0, 0, 0.2);
  outline: 0;
}

.modal-backdrop {
  position: fixed;
  top: 0;
  left: 0;
  z-index: 1040;
  width: 100vw;
  height: 100vh;
  background-color: #000;
}

.modal-backdrop.fade {
  opacity: 0;
}

.modal-backdrop.show {
  opacity: 0.5;
}

.modal-header {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  padding: 1rem 1rem;
  border-bottom: 1px solid #dee2e6;
}

.modal-header .close {
  padding: 1rem 1rem;
  margin: -1rem -1rem -1rem auto;
}

.modal-title {
  margin-bottom: 0;
  line-height: 1.5;
}

.modal-body {
  position: relative;
  flex: 1 1 auto;
  padding: 1rem;
}

.modal-footer {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  justify-content: flex-end;
  padding: 0.75rem;
  border-top: 1px solid #dee2e6;
}

.modal-footer > * {
  margin: 0.25rem;
}

.modal-scrollbar-measure {
  position: absolute;
  top: -9999px;
  width: 50px;
  height: 50px;
  overflow: scroll;
}

@media (min-width: 576px) {
  .modal-dialog {
    max-width: 500px;
    margin: 1.75rem auto;
  }
  .modal-dialog-scrollable {
    max-height: calc(100% - 3.5rem);
  }
  .modal-dialog-scrollable .modal-content {
    max-height: calc(100vh - 3.5rem);
  }
  .modal-dialog-centered {
    min-height: calc(100% - 3.5rem);
  }
  .modal-dialog-centered::before {
    height: calc(100vh - 3.5rem);
    height: min-content;
  }
  .modal-sm {
    max-width: 300px;
  }
}

@media (min-width: 992px) {
  .modal-lg,
  .modal-xl {
    max-width: 800px;
  }
}

@media (min-width: 1200px) {
  .modal-xl {
    max-width: 1140px;
  }
}

.tooltip {
  position: absolute;
  z-index: 1070;
  display: block;
  margin: 0;
  font-family: "Poppins", sans-serif;
  font-style: normal;
  font-weight: 400;
  line-height: 1.5;
  text-align: left;
  text-align: start;
  text-decoration: none;
  text-shadow: none;
  text-transform: none;
  letter-spacing: normal;
  word-break: normal;
  word-spacing: normal;
  white-space: normal;
  line-break: auto;
  font-size: 0.875rem;
  word-wrap: break-word;
  opacity: 0;
}

.tooltip.show {
  opacity: 0.9;
}

.tooltip .arrow {
  position: absolute;
  display: block;
  width: 0.8rem;
  height: 0.4rem;
}

.tooltip .arrow::before {
  position: absolute;
  content: "";
  border-color: transparent;
  border-style: solid;
}

.bs-tooltip-top, .bs-tooltip-auto[x-placement^="top"] {
  padding: 0.4rem 0;
}

.bs-tooltip-top .arrow, .bs-tooltip-auto[x-placement^="top"] .arrow {
  bottom: 0;
}

.bs-tooltip-top .arrow::before, .bs-tooltip-auto[x-placement^="top"] .arrow::before {
  top: 0;
  border-width: 0.4rem 0.4rem 0;
  border-top-color: #000;
}

.bs-tooltip-right, .bs-tooltip-auto[x-placement^="right"] {
  padding: 0 0.4rem;
}

.bs-tooltip-right .arrow, .bs-tooltip-auto[x-placement^="right"] .arrow {
  left: 0;
  width: 0.4rem;
  height: 0.8rem;
}

.bs-tooltip-right .arrow::before, .bs-tooltip-auto[x-placement^="right"] .arrow::before {
  right: 0;
  border-width: 0.4rem 0.4rem 0.4rem 0;
  border-right-color: #000;
}

.bs-tooltip-bottom, .bs-tooltip-auto[x-placement^="bottom"] {
  padding: 0.4rem 0;
}

.bs-tooltip-bottom .arrow, .bs-tooltip-auto[x-placement^="bottom"] .arrow {
  top: 0;
}

.bs-tooltip-bottom .arrow::before, .bs-tooltip-auto[x-placement^="bottom"] .arrow::before {
  bottom: 0;
  border-width: 0 0.4rem 0.4rem;
  border-bottom-color: #000;
}

.bs-tooltip-left, .bs-tooltip-auto[x-placement^="left"] {
  padding: 0 0.4rem;
}

.bs-tooltip-left .arrow, .bs-tooltip-auto[x-placement^="left"] .arrow {
  right: 0;
  width: 0.4rem;
  height: 0.8rem;
}

.bs-tooltip-left .arrow::before, .bs-tooltip-auto[x-placement^="left"] .arrow::before {
  left: 0;
  border-width: 0.4rem 0 0.4rem 0.4rem;
  border-left-color: #000;
}

.tooltip-inner {
  max-width: 200px;
  padding: 0.25rem 0.5rem;
  color: #fff;
  text-align: center;
  background-color: #000;
}

.popover {
  position: absolute;
  top: 0;
  left: 0;
  z-index: 1060;
  display: block;
  max-width: 276px;
  font-family: "Poppins", sans-serif;
  font-style: normal;
  font-weight: 400;
  line-height: 1.5;
  text-align: left;
  text-align: start;
  text-decoration: none;
  text-shadow: none;
  text-transform: none;
  letter-spacing: normal;
  word-break: normal;
  word-spacing: normal;
  white-space: normal;
  line-break: auto;
  font-size: 0.875rem;
  word-wrap: break-word;
  background-color: #fff;
  background-clip: padding-box;
  border: 1px solid rgba(0, 0, 0, 0.2);
}

.popover .arrow {
  position: absolute;
  display: block;
  width: 1rem;
  height: 0.5rem;
  margin: 0 0.3rem;
}

.popover .arrow::before, .popover .arrow::after {
  position: absolute;
  display: block;
  content: "";
  border-color: transparent;
  border-style: solid;
}

.bs-popover-top, .bs-popover-auto[x-placement^="top"] {
  margin-bottom: 0.5rem;
}

.bs-popover-top > .arrow, .bs-popover-auto[x-placement^="top"] > .arrow {
  bottom: calc(-0.5rem - 1px);
}

.bs-popover-top > .arrow::before, .bs-popover-auto[x-placement^="top"] > .arrow::before {
  bottom: 0;
  border-width: 0.5rem 0.5rem 0;
  border-top-color: rgba(0, 0, 0, 0.25);
}

.bs-popover-top > .arrow::after, .bs-popover-auto[x-placement^="top"] > .arrow::after {
  bottom: 1px;
  border-width: 0.5rem 0.5rem 0;
  border-top-color: #fff;
}

.bs-popover-right, .bs-popover-auto[x-placement^="right"] {
  margin-left: 0.5rem;
}

.bs-popover-right > .arrow, .bs-popover-auto[x-placement^="right"] > .arrow {
  left: calc(-0.5rem - 1px);
  width: 0.5rem;
  height: 1rem;
  margin: 0.3rem 0;
}

.bs-popover-right > .arrow::before, .bs-popover-auto[x-placement^="right"] > .arrow::before {
  left: 0;
  border-width: 0.5rem 0.5rem 0.5rem 0;
  border-right-color: rgba(0, 0, 0, 0.25);
}

.bs-popover-right > .arrow::after, .bs-popover-auto[x-placement^="right"] > .arrow::after {
  left: 1px;
  border-width: 0.5rem 0.5rem 0.5rem 0;
  border-right-color: #fff;
}

.bs-popover-bottom, .bs-popover-auto[x-placement^="bottom"] {
  margin-top: 0.5rem;
}

.bs-popover-bottom > .arrow, .bs-popover-auto[x-placement^="bottom"] > .arrow {
  top: calc(-0.5rem - 1px);
}

.bs-popover-bottom > .arrow::before, .bs-popover-auto[x-placement^="bottom"] > .arrow::before {
  top: 0;
  border-width: 0 0.5rem 0.5rem 0.5rem;
  border-bottom-color: rgba(0, 0, 0, 0.25);
}

.bs-popover-bottom > .arrow::after, .bs-popover-auto[x-placement^="bottom"] > .arrow::after {
  top: 1px;
  border-width: 0 0.5rem 0.5rem 0.5rem;
  border-bottom-color: #fff;
}

.bs-popover-bottom .popover-header::before, .bs-popover-auto[x-placement^="bottom"] .popover-header::before {
  position: absolute;
  top: 0;
  left: 50%;
  display: block;
  width: 1rem;
  margin-left: -0.5rem;
  content: "";
  border-bottom: 1px solid #f7f7f7;
}

.bs-popover-left, .bs-popover-auto[x-placement^="left"] {
  margin-right: 0.5rem;
}

.bs-popover-left > .arrow, .bs-popover-auto[x-placement^="left"] > .arrow {
  right: calc(-0.5rem - 1px);
  width: 0.5rem;
  height: 1rem;
  margin: 0.3rem 0;
}

.bs-popover-left > .arrow::before, .bs-popover-auto[x-placement^="left"] > .arrow::before {
  right: 0;
  border-width: 0.5rem 0 0.5rem 0.5rem;
  border-left-color: rgba(0, 0, 0, 0.25);
}

.bs-popover-left > .arrow::after, .bs-popover-auto[x-placement^="left"] > .arrow::after {
  right: 1px;
  border-width: 0.5rem 0 0.5rem 0.5rem;
  border-left-color: #fff;
}

.popover-header {
  padding: 0.5rem 0.75rem;
  margin-bottom: 0;
  font-size: 1rem;
  color: #211E1C;
  background-color: #f7f7f7;
  border-bottom: 1px solid #ebebeb;
}

.popover-header:empty {
  display: none;
}

.popover-body {
  padding: 0.5rem 0.75rem;
  color: #757575;
}

.carousel {
  position: relative;
}

.carousel.pointer-event {
  touch-action: pan-y;
}

.carousel-inner {
  position: relative;
  width: 100%;
  overflow: hidden;
}

.carousel-inner::after {
  display: block;
  clear: both;
  content: "";
}

.carousel-item {
  position: relative;
  display: none;
  float: left;
  width: 100%;
  margin-right: -100%;
  backface-visibility: hidden;
  transition: transform 0.6s ease-in-out;
}

@media (prefers-reduced-motion: reduce) {
  .carousel-item {
    transition: none;
  }
}

.carousel-item.active,
.carousel-item-next,
.carousel-item-prev {
  display: block;
}

.carousel-item-next:not(.carousel-item-left),
.active.carousel-item-right {
  transform: translateX(100%);
}

.carousel-item-prev:not(.carousel-item-right),
.active.carousel-item-left {
  transform: translateX(-100%);
}

.carousel-fade .carousel-item {
  opacity: 0;
  transition-property: opacity;
  transform: none;
}

.carousel-fade .carousel-item.active,
.carousel-fade .carousel-item-next.carousel-item-left,
.carousel-fade .carousel-item-prev.carousel-item-right {
  z-index: 1;
  opacity: 1;
}

.carousel-fade .active.carousel-item-left,
.carousel-fade .active.carousel-item-right {
  z-index: 0;
  opacity: 0;
  transition: opacity 0s 0.6s;
}

@media (prefers-reduced-motion: reduce) {
  .carousel-fade .active.carousel-item-left,
  .carousel-fade .active.carousel-item-right {
    transition: none;
  }
}

.carousel-control-prev,
.carousel-control-next {
  position: absolute;
  top: 0;
  bottom: 0;
  z-index: 1;
  display: flex;
  align-items: center;
  justify-content: center;
  width: 15%;
  color: #fff;
  text-align: center;
  opacity: 0.5;
  transition: opacity 0.15s ease;
}

@media (prefers-reduced-motion: reduce) {
  .carousel-control-prev,
  .carousel-control-next {
    transition: none;
  }
}

.carousel-control-prev:hover, .carousel-control-prev:focus,
.carousel-control-next:hover,
.carousel-control-next:focus {
  color: #fff;
  text-decoration: none;
  outline: 0;
  opacity: 0.9;
}

.carousel-control-prev {
  left: 0;
}

.carousel-control-next {
  right: 0;
}

.carousel-control-prev-icon,
.carousel-control-next-icon {
  display: inline-block;
  width: 20px;
  height: 20px;
  background: no-repeat 50% / 100% 100%;
}

.carousel-control-prev-icon {
  background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' fill='%23fff' width='8' height='8' viewBox='0 0 8 8'%3e%3cpath d='M5.25 0l-4 4 4 4 1.5-1.5L4.25 4l2.5-2.5L5.25 0z'/%3e%3c/svg%3e");
}

.carousel-control-next-icon {
  background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' fill='%23fff' width='8' height='8' viewBox='0 0 8 8'%3e%3cpath d='M2.75 0l-1.5 1.5L3.75 4l-2.5 2.5L2.75 8l4-4-4-4z'/%3e%3c/svg%3e");
}

.carousel-indicators {
  position: absolute;
  right: 0;
  bottom: 0;
  left: 0;
  z-index: 15;
  display: flex;
  justify-content: center;
  padding-left: 0;
  margin-right: 15%;
  margin-left: 15%;
  list-style: none;
}

.carousel-indicators li {
  box-sizing: content-box;
  flex: 0 1 auto;
  width: 30px;
  height: 3px;
  margin-right: 3px;
  margin-left: 3px;
  text-indent: -999px;
  cursor: pointer;
  background-color: #fff;
  background-clip: padding-box;
  border-top: 10px solid transparent;
  border-bottom: 10px solid transparent;
  opacity: .5;
  transition: opacity 0.6s ease;
}

@media (prefers-reduced-motion: reduce) {
  .carousel-indicators li {
    transition: none;
  }
}

.carousel-indicators .active {
  opacity: 1;
}

.carousel-caption {
  position: absolute;
  right: 15%;
  bottom: 20px;
  left: 15%;
  z-index: 10;
  padding-top: 20px;
  padding-bottom: 20px;
  color: #fff;
  text-align: center;
}

@keyframes spinner-border {
  to {
    transform: rotate(360deg);
  }
}

.spinner-border {
  display: inline-block;
  width: 2rem;
  height: 2rem;
  vertical-align: text-bottom;
  border: 0.25em solid currentColor;
  border-right-color: transparent;
  border-radius: 50%;
  animation: spinner-border .75s linear infinite;
}

.spinner-border-sm {
  width: 1rem;
  height: 1rem;
  border-width: 0.2em;
}

@keyframes spinner-grow {
  0% {
    transform: scale(0);
  }
  50% {
    opacity: 1;
    transform: none;
  }
}

.spinner-grow {
  display: inline-block;
  width: 2rem;
  height: 2rem;
  vertical-align: text-bottom;
  background-color: currentColor;
  border-radius: 50%;
  opacity: 0;
  animation: spinner-grow .75s linear infinite;
}

.spinner-grow-sm {
  width: 1rem;
  height: 1rem;
}

.align-baseline {
  vertical-align: baseline !important;
}

.align-top {
  vertical-align: top !important;
}

.align-middle {
  vertical-align: middle !important;
}

.align-bottom {
  vertical-align: bottom !important;
}

.align-text-bottom {
  vertical-align: text-bottom !important;
}

.align-text-top {
  vertical-align: text-top !important;
}

.bg-primary {
  background-color: #F9A392 !important;
}

a.bg-primary:hover, a.bg-primary:focus,
button.bg-primary:hover,
button.bg-primary:focus {
  background-color: #f67a62 !important;
}

.bg-secondary {
  background-color: #6EBBF6 !important;
}

a.bg-secondary:hover, a.bg-secondary:focus,
button.bg-secondary:hover,
button.bg-secondary:focus {
  background-color: #3ea4f3 !important;
}

.bg-success {
  background-color: #28a745 !important;
}

a.bg-success:hover, a.bg-success:focus,
button.bg-success:hover,
button.bg-success:focus {
  background-color: #1e7e34 !important;
}

.bg-info {
  background-color: #17a2b8 !important;
}

a.bg-info:hover, a.bg-info:focus,
button.bg-info:hover,
button.bg-info:focus {
  background-color: #117a8b !important;
}

.bg-warning {
  background-color: #ffc107 !important;
}

a.bg-warning:hover, a.bg-warning:focus,
button.bg-warning:hover,
button.bg-warning:focus {
  background-color: #d39e00 !important;
}

.bg-danger {
  background-color: #dc3545 !important;
}

a.bg-danger:hover, a.bg-danger:focus,
button.bg-danger:hover,
button.bg-danger:focus {
  background-color: #bd2130 !important;
}

.bg-light {
  background-color: #FEF1EF !important;
}

a.bg-light:hover, a.bg-light:focus,
button.bg-light:hover,
button.bg-light:focus {
  background-color: #fbc7bf !important;
}

.bg-dark {
  background-color: #211E1C !important;
}

a.bg-dark:hover, a.bg-dark:focus,
button.bg-dark:hover,
button.bg-dark:focus {
  background-color: #050505 !important;
}

.bg-white {
  background-color: #fff !important;
}

.bg-transparent {
  background-color: transparent !important;
}

.border {
  border: 1px solid #dee2e6 !important;
}

.border-top {
  border-top: 1px solid #dee2e6 !important;
}

.border-right {
  border-right: 1px solid #dee2e6 !important;
}

.border-bottom {
  border-bottom: 1px solid #dee2e6 !important;
}

.border-left {
  border-left: 1px solid #dee2e6 !important;
}

.border-0 {
  border: 0 !important;
}

.border-top-0 {
  border-top: 0 !important;
}

.border-right-0 {
  border-right: 0 !important;
}

.border-bottom-0 {
  border-bottom: 0 !important;
}

.border-left-0 {
  border-left: 0 !important;
}

.border-primary {
  border-color: #F9A392 !important;
}

.border-secondary {
  border-color: #6EBBF6 !important;
}

.border-success {
  border-color: #28a745 !important;
}

.border-info {
  border-color: #17a2b8 !important;
}

.border-warning {
  border-color: #ffc107 !important;
}

.border-danger {
  border-color: #dc3545 !important;
}

.border-light {
  border-color: #FEF1EF !important;
}

.border-dark {
  border-color: #211E1C !important;
}

.border-white {
  border-color: #fff !important;
}

.rounded-sm {
  border-radius: 0.2rem !important;
}

.rounded {
  border-radius: 0.25rem !important;
}

.rounded-top {
  border-top-left-radius: 0.25rem !important;
  border-top-right-radius: 0.25rem !important;
}

.rounded-right {
  border-top-right-radius: 0.25rem !important;
  border-bottom-right-radius: 0.25rem !important;
}

.rounded-bottom {
  border-bottom-right-radius: 0.25rem !important;
  border-bottom-left-radius: 0.25rem !important;
}

.rounded-left {
  border-top-left-radius: 0.25rem !important;
  border-bottom-left-radius: 0.25rem !important;
}

.rounded-lg {
  border-radius: 0.3rem !important;
}

.rounded-circle {
  border-radius: 50% !important;
}

.rounded-pill {
  border-radius: 50rem !important;
}

.rounded-0 {
  border-radius: 0 !important;
}

.clearfix::after {
  display: block;
  clear: both;
  content: "";
}

.d-none {
  display: none !important;
}

.d-inline {
  display: inline !important;
}

.d-inline-block {
  display: inline-block !important;
}

.d-block {
  display: block !important;
}

.d-table {
  display: table !important;
}

.d-table-row {
  display: table-row !important;
}

.d-table-cell {
  display: table-cell !important;
}

.d-flex {
  display: flex !important;
}

.d-inline-flex {
  display: inline-flex !important;
}

@media (min-width: 576px) {
  .d-sm-none {
    display: none !important;
  }
  .d-sm-inline {
    display: inline !important;
  }
  .d-sm-inline-block {
    display: inline-block !important;
  }
  .d-sm-block {
    display: block !important;
  }
  .d-sm-table {
    display: table !important;
  }
  .d-sm-table-row {
    display: table-row !important;
  }
  .d-sm-table-cell {
    display: table-cell !important;
  }
  .d-sm-flex {
    display: flex !important;
  }
  .d-sm-inline-flex {
    display: inline-flex !important;
  }
}

@media (min-width: 768px) {
  .d-md-none {
    display: none !important;
  }
  .d-md-inline {
    display: inline !important;
  }
  .d-md-inline-block {
    display: inline-block !important;
  }
  .d-md-block {
    display: block !important;
  }
  .d-md-table {
    display: table !important;
  }
  .d-md-table-row {
    display: table-row !important;
  }
  .d-md-table-cell {
    display: table-cell !important;
  }
  .d-md-flex {
    display: flex !important;
  }
  .d-md-inline-flex {
    display: inline-flex !important;
  }
}

@media (min-width: 992px) {
  .d-lg-none {
    display: none !important;
  }
  .d-lg-inline {
    display: inline !important;
  }
  .d-lg-inline-block {
    display: inline-block !important;
  }
  .d-lg-block {
    display: block !important;
  }
  .d-lg-table {
    display: table !important;
  }
  .d-lg-table-row {
    display: table-row !important;
  }
  .d-lg-table-cell {
    display: table-cell !important;
  }
  .d-lg-flex {
    display: flex !important;
  }
  .d-lg-inline-flex {
    display: inline-flex !important;
  }
}

@media (min-width: 1200px) {
  .d-xl-none {
    display: none !important;
  }
  .d-xl-inline {
    display: inline !important;
  }
  .d-xl-inline-block {
    display: inline-block !important;
  }
  .d-xl-block {
    display: block !important;
  }
  .d-xl-table {
    display: table !important;
  }
  .d-xl-table-row {
    display: table-row !important;
  }
  .d-xl-table-cell {
    display: table-cell !important;
  }
  .d-xl-flex {
    display: flex !important;
  }
  .d-xl-inline-flex {
    display: inline-flex !important;
  }
}

@media print {
  .d-print-none {
    display: none !important;
  }
  .d-print-inline {
    display: inline !important;
  }
  .d-print-inline-block {
    display: inline-block !important;
  }
  .d-print-block {
    display: block !important;
  }
  .d-print-table {
    display: table !important;
  }
  .d-print-table-row {
    display: table-row !important;
  }
  .d-print-table-cell {
    display: table-cell !important;
  }
  .d-print-flex {
    display: flex !important;
  }
  .d-print-inline-flex {
    display: inline-flex !important;
  }
}

.embed-responsive {
  position: relative;
  display: block;
  width: 100%;
  padding: 0;
  overflow: hidden;
}

.embed-responsive::before {
  display: block;
  content: "";
}

.embed-responsive .embed-responsive-item,
.embed-responsive iframe,
.embed-responsive embed,
.embed-responsive object,
.embed-responsive video {
  position: absolute;
  top: 0;
  bottom: 0;
  left: 0;
  width: 100%;
  height: 100%;
  border: 0;
}

.embed-responsive-21by9::before {
  padding-top: 42.85714%;
}

.embed-responsive-16by9::before {
  padding-top: 56.25%;
}

.embed-responsive-4by3::before {
  padding-top: 75%;
}

.embed-responsive-1by1::before {
  padding-top: 100%;
}

.flex-row {
  flex-direction: row !important;
}

.flex-column {
  flex-direction: column !important;
}

.flex-row-reverse {
  flex-direction: row-reverse !important;
}

.flex-column-reverse {
  flex-direction: column-reverse !important;
}

.flex-wrap {
  flex-wrap: wrap !important;
}

.flex-nowrap {
  flex-wrap: nowrap !important;
}

.flex-wrap-reverse {
  flex-wrap: wrap-reverse !important;
}

.flex-fill {
  flex: 1 1 auto !important;
}

.flex-grow-0 {
  flex-grow: 0 !important;
}

.flex-grow-1 {
  flex-grow: 1 !important;
}

.flex-shrink-0 {
  flex-shrink: 0 !important;
}

.flex-shrink-1 {
  flex-shrink: 1 !important;
}

.justify-content-start {
  justify-content: flex-start !important;
}

.justify-content-end {
  justify-content: flex-end !important;
}

.justify-content-center {
  justify-content: center !important;
}

.justify-content-between {
  justify-content: space-between !important;
}

.justify-content-around {
  justify-content: space-around !important;
}

.align-items-start {
  align-items: flex-start !important;
}

.align-items-end {
  align-items: flex-end !important;
}

.align-items-center {
  align-items: center !important;
}

.align-items-baseline {
  align-items: baseline !important;
}

.align-items-stretch {
  align-items: stretch !important;
}

.align-content-start {
  align-content: flex-start !important;
}

.align-content-end {
  align-content: flex-end !important;
}

.align-content-center {
  align-content: center !important;
}

.align-content-between {
  align-content: space-between !important;
}

.align-content-around {
  align-content: space-around !important;
}

.align-content-stretch {
  align-content: stretch !important;
}

.align-self-auto {
  align-self: auto !important;
}

.align-self-start {
  align-self: flex-start !important;
}

.align-self-end {
  align-self: flex-end !important;
}

.align-self-center {
  align-self: center !important;
}

.align-self-baseline {
  align-self: baseline !important;
}

.align-self-stretch {
  align-self: stretch !important;
}

@media (min-width: 576px) {
  .flex-sm-row {
    flex-direction: row !important;
  }
  .flex-sm-column {
    flex-direction: column !important;
  }
  .flex-sm-row-reverse {
    flex-direction: row-reverse !important;
  }
  .flex-sm-column-reverse {
    flex-direction: column-reverse !important;
  }
  .flex-sm-wrap {
    flex-wrap: wrap !important;
  }
  .flex-sm-nowrap {
    flex-wrap: nowrap !important;
  }
  .flex-sm-wrap-reverse {
    flex-wrap: wrap-reverse !important;
  }
  .flex-sm-fill {
    flex: 1 1 auto !important;
  }
  .flex-sm-grow-0 {
    flex-grow: 0 !important;
  }
  .flex-sm-grow-1 {
    flex-grow: 1 !important;
  }
  .flex-sm-shrink-0 {
    flex-shrink: 0 !important;
  }
  .flex-sm-shrink-1 {
    flex-shrink: 1 !important;
  }
  .justify-content-sm-start {
    justify-content: flex-start !important;
  }
  .justify-content-sm-end {
    justify-content: flex-end !important;
  }
  .justify-content-sm-center {
    justify-content: center !important;
  }
  .justify-content-sm-between {
    justify-content: space-between !important;
  }
  .justify-content-sm-around {
    justify-content: space-around !important;
  }
  .align-items-sm-start {
    align-items: flex-start !important;
  }
  .align-items-sm-end {
    align-items: flex-end !important;
  }
  .align-items-sm-center {
    align-items: center !important;
  }
  .align-items-sm-baseline {
    align-items: baseline !important;
  }
  .align-items-sm-stretch {
    align-items: stretch !important;
  }
  .align-content-sm-start {
    align-content: flex-start !important;
  }
  .align-content-sm-end {
    align-content: flex-end !important;
  }
  .align-content-sm-center {
    align-content: center !important;
  }
  .align-content-sm-between {
    align-content: space-between !important;
  }
  .align-content-sm-around {
    align-content: space-around !important;
  }
  .align-content-sm-stretch {
    align-content: stretch !important;
  }
  .align-self-sm-auto {
    align-self: auto !important;
  }
  .align-self-sm-start {
    align-self: flex-start !important;
  }
  .align-self-sm-end {
    align-self: flex-end !important;
  }
  .align-self-sm-center {
    align-self: center !important;
  }
  .align-self-sm-baseline {
    align-self: baseline !important;
  }
  .align-self-sm-stretch {
    align-self: stretch !important;
  }
}

@media (min-width: 768px) {
  .flex-md-row {
    flex-direction: row !important;
  }
  .flex-md-column {
    flex-direction: column !important;
  }
  .flex-md-row-reverse {
    flex-direction: row-reverse !important;
  }
  .flex-md-column-reverse {
    flex-direction: column-reverse !important;
  }
  .flex-md-wrap {
    flex-wrap: wrap !important;
  }
  .flex-md-nowrap {
    flex-wrap: nowrap !important;
  }
  .flex-md-wrap-reverse {
    flex-wrap: wrap-reverse !important;
  }
  .flex-md-fill {
    flex: 1 1 auto !important;
  }
  .flex-md-grow-0 {
    flex-grow: 0 !important;
  }
  .flex-md-grow-1 {
    flex-grow: 1 !important;
  }
  .flex-md-shrink-0 {
    flex-shrink: 0 !important;
  }
  .flex-md-shrink-1 {
    flex-shrink: 1 !important;
  }
  .justify-content-md-start {
    justify-content: flex-start !important;
  }
  .justify-content-md-end {
    justify-content: flex-end !important;
  }
  .justify-content-md-center {
    justify-content: center !important;
  }
  .justify-content-md-between {
    justify-content: space-between !important;
  }
  .justify-content-md-around {
    justify-content: space-around !important;
  }
  .align-items-md-start {
    align-items: flex-start !important;
  }
  .align-items-md-end {
    align-items: flex-end !important;
  }
  .align-items-md-center {
    align-items: center !important;
  }
  .align-items-md-baseline {
    align-items: baseline !important;
  }
  .align-items-md-stretch {
    align-items: stretch !important;
  }
  .align-content-md-start {
    align-content: flex-start !important;
  }
  .align-content-md-end {
    align-content: flex-end !important;
  }
  .align-content-md-center {
    align-content: center !important;
  }
  .align-content-md-between {
    align-content: space-between !important;
  }
  .align-content-md-around {
    align-content: space-around !important;
  }
  .align-content-md-stretch {
    align-content: stretch !important;
  }
  .align-self-md-auto {
    align-self: auto !important;
  }
  .align-self-md-start {
    align-self: flex-start !important;
  }
  .align-self-md-end {
    align-self: flex-end !important;
  }
  .align-self-md-center {
    align-self: center !important;
  }
  .align-self-md-baseline {
    align-self: baseline !important;
  }
  .align-self-md-stretch {
    align-self: stretch !important;
  }
}

@media (min-width: 992px) {
  .flex-lg-row {
    flex-direction: row !important;
  }
  .flex-lg-column {
    flex-direction: column !important;
  }
  .flex-lg-row-reverse {
    flex-direction: row-reverse !important;
  }
  .flex-lg-column-reverse {
    flex-direction: column-reverse !important;
  }
  .flex-lg-wrap {
    flex-wrap: wrap !important;
  }
  .flex-lg-nowrap {
    flex-wrap: nowrap !important;
  }
  .flex-lg-wrap-reverse {
    flex-wrap: wrap-reverse !important;
  }
  .flex-lg-fill {
    flex: 1 1 auto !important;
  }
  .flex-lg-grow-0 {
    flex-grow: 0 !important;
  }
  .flex-lg-grow-1 {
    flex-grow: 1 !important;
  }
  .flex-lg-shrink-0 {
    flex-shrink: 0 !important;
  }
  .flex-lg-shrink-1 {
    flex-shrink: 1 !important;
  }
  .justify-content-lg-start {
    justify-content: flex-start !important;
  }
  .justify-content-lg-end {
    justify-content: flex-end !important;
  }
  .justify-content-lg-center {
    justify-content: center !important;
  }
  .justify-content-lg-between {
    justify-content: space-between !important;
  }
  .justify-content-lg-around {
    justify-content: space-around !important;
  }
  .align-items-lg-start {
    align-items: flex-start !important;
  }
  .align-items-lg-end {
    align-items: flex-end !important;
  }
  .align-items-lg-center {
    align-items: center !important;
  }
  .align-items-lg-baseline {
    align-items: baseline !important;
  }
  .align-items-lg-stretch {
    align-items: stretch !important;
  }
  .align-content-lg-start {
    align-content: flex-start !important;
  }
  .align-content-lg-end {
    align-content: flex-end !important;
  }
  .align-content-lg-center {
    align-content: center !important;
  }
  .align-content-lg-between {
    align-content: space-between !important;
  }
  .align-content-lg-around {
    align-content: space-around !important;
  }
  .align-content-lg-stretch {
    align-content: stretch !important;
  }
  .align-self-lg-auto {
    align-self: auto !important;
  }
  .align-self-lg-start {
    align-self: flex-start !important;
  }
  .align-self-lg-end {
    align-self: flex-end !important;
  }
  .align-self-lg-center {
    align-self: center !important;
  }
  .align-self-lg-baseline {
    align-self: baseline !important;
  }
  .align-self-lg-stretch {
    align-self: stretch !important;
  }
}

@media (min-width: 1200px) {
  .flex-xl-row {
    flex-direction: row !important;
  }
  .flex-xl-column {
    flex-direction: column !important;
  }
  .flex-xl-row-reverse {
    flex-direction: row-reverse !important;
  }
  .flex-xl-column-reverse {
    flex-direction: column-reverse !important;
  }
  .flex-xl-wrap {
    flex-wrap: wrap !important;
  }
  .flex-xl-nowrap {
    flex-wrap: nowrap !important;
  }
  .flex-xl-wrap-reverse {
    flex-wrap: wrap-reverse !important;
  }
  .flex-xl-fill {
    flex: 1 1 auto !important;
  }
  .flex-xl-grow-0 {
    flex-grow: 0 !important;
  }
  .flex-xl-grow-1 {
    flex-grow: 1 !important;
  }
  .flex-xl-shrink-0 {
    flex-shrink: 0 !important;
  }
  .flex-xl-shrink-1 {
    flex-shrink: 1 !important;
  }
  .justify-content-xl-start {
    justify-content: flex-start !important;
  }
  .justify-content-xl-end {
    justify-content: flex-end !important;
  }
  .justify-content-xl-center {
    justify-content: center !important;
  }
  .justify-content-xl-between {
    justify-content: space-between !important;
  }
  .justify-content-xl-around {
    justify-content: space-around !important;
  }
  .align-items-xl-start {
    align-items: flex-start !important;
  }
  .align-items-xl-end {
    align-items: flex-end !important;
  }
  .align-items-xl-center {
    align-items: center !important;
  }
  .align-items-xl-baseline {
    align-items: baseline !important;
  }
  .align-items-xl-stretch {
    align-items: stretch !important;
  }
  .align-content-xl-start {
    align-content: flex-start !important;
  }
  .align-content-xl-end {
    align-content: flex-end !important;
  }
  .align-content-xl-center {
    align-content: center !important;
  }
  .align-content-xl-between {
    align-content: space-between !important;
  }
  .align-content-xl-around {
    align-content: space-around !important;
  }
  .align-content-xl-stretch {
    align-content: stretch !important;
  }
  .align-self-xl-auto {
    align-self: auto !important;
  }
  .align-self-xl-start {
    align-self: flex-start !important;
  }
  .align-self-xl-end {
    align-self: flex-end !important;
  }
  .align-self-xl-center {
    align-self: center !important;
  }
  .align-self-xl-baseline {
    align-self: baseline !important;
  }
  .align-self-xl-stretch {
    align-self: stretch !important;
  }
}

.float-left {
  float: left !important;
}

.float-right {
  float: right !important;
}

.float-none {
  float: none !important;
}

@media (min-width: 576px) {
  .float-sm-left {
    float: left !important;
  }
  .float-sm-right {
    float: right !important;
  }
  .float-sm-none {
    float: none !important;
  }
}

@media (min-width: 768px) {
  .float-md-left {
    float: left !important;
  }
  .float-md-right {
    float: right !important;
  }
  .float-md-none {
    float: none !important;
  }
}

@media (min-width: 992px) {
  .float-lg-left {
    float: left !important;
  }
  .float-lg-right {
    float: right !important;
  }
  .float-lg-none {
    float: none !important;
  }
}

@media (min-width: 1200px) {
  .float-xl-left {
    float: left !important;
  }
  .float-xl-right {
    float: right !important;
  }
  .float-xl-none {
    float: none !important;
  }
}

.user-select-all {
  user-select: all !important;
}

.user-select-auto {
  user-select: auto !important;
}

.user-select-none {
  user-select: none !important;
}

.overflow-auto {
  overflow: auto !important;
}

.overflow-hidden {
  overflow: hidden !important;
}

.position-static {
  position: static !important;
}

.position-relative {
  position: relative !important;
}

.position-absolute {
  position: absolute !important;
}

.position-fixed {
  position: fixed !important;
}

.position-sticky {
  position: sticky !important;
}

.fixed-top {
  position: fixed;
  top: 0;
  right: 0;
  left: 0;
  z-index: 1030;
}

.fixed-bottom {
  position: fixed;
  right: 0;
  bottom: 0;
  left: 0;
  z-index: 1030;
}

@supports (position: sticky) {
  .sticky-top {
    position: sticky;
    top: 0;
    z-index: 1020;
  }
}

.sr-only {
  position: absolute;
  width: 1px;
  height: 1px;
  padding: 0;
  margin: -1px;
  overflow: hidden;
  clip: rect(0, 0, 0, 0);
  white-space: nowrap;
  border: 0;
}

.sr-only-focusable:active, .sr-only-focusable:focus {
  position: static;
  width: auto;
  height: auto;
  overflow: visible;
  clip: auto;
  white-space: normal;
}

.shadow-sm {
  box-shadow: 0 0.125rem 0.25rem rgba(0, 0, 0, 0.075) !important;
}

.shadow {
  box-shadow: 0 0.5rem 1rem rgba(0, 0, 0, 0.15) !important;
}

.shadow-lg {
  box-shadow: 0 1rem 3rem rgba(0, 0, 0, 0.175) !important;
}

.shadow-none {
  box-shadow: none !important;
}

.w-25 {
  width: 25% !important;
}

.w-50 {
  width: 50% !important;
}

.w-75 {
  width: 75% !important;
}

.w-100 {
  width: 100% !important;
}

.w-auto {
  width: auto !important;
}

.h-25 {
  height: 25% !important;
}

.h-50 {
  height: 50% !important;
}

.h-75 {
  height: 75% !important;
}

.h-100 {
  height: 100% !important;
}

.h-auto {
  height: auto !important;
}

.mw-100 {
  max-width: 100% !important;
}

.mh-100 {
  max-height: 100% !important;
}

.min-vw-100 {
  min-width: 100vw !important;
}

.min-vh-100 {
  min-height: 100vh !important;
}

.vw-100 {
  width: 100vw !important;
}

.vh-100 {
  height: 100vh !important;
}

.m-0 {
  margin: 0 !important;
}

.mt-0,
.my-0 {
  margin-top: 0 !important;
}

.mr-0,
.mx-0 {
  margin-right: 0 !important;
}

.mb-0,
.my-0 {
  margin-bottom: 0 !important;
}

.ml-0,
.mx-0 {
  margin-left: 0 !important;
}

.m-1 {
  margin: 0.25rem !important;
}

.mt-1,
.my-1 {
  margin-top: 0.25rem !important;
}

.mr-1,
.mx-1 {
  margin-right: 0.25rem !important;
}

.mb-1,
.my-1 {
  margin-bottom: 0.25rem !important;
}

.ml-1,
.mx-1 {
  margin-left: 0.25rem !important;
}

.m-2 {
  margin: 0.5rem !important;
}

.mt-2,
.my-2 {
  margin-top: 0.5rem !important;
}

.mr-2,
.mx-2 {
  margin-right: 0.5rem !important;
}

.mb-2,
.my-2 {
  margin-bottom: 0.5rem !important;
}

.ml-2,
.mx-2 {
  margin-left: 0.5rem !important;
}

.m-3 {
  margin: 1rem !important;
}

.mt-3,
.my-3 {
  margin-top: 1rem !important;
}

.mr-3,
.mx-3 {
  margin-right: 1rem !important;
}

.mb-3,
.my-3 {
  margin-bottom: 1rem !important;
}

.ml-3,
.mx-3 {
  margin-left: 1rem !important;
}

.m-4 {
  margin: 1.5rem !important;
}

.mt-4,
.my-4 {
  margin-top: 1.5rem !important;
}

.mr-4,
.mx-4 {
  margin-right: 1.5rem !important;
}

.mb-4,
.my-4 {
  margin-bottom: 1.5rem !important;
}

.ml-4,
.mx-4 {
  margin-left: 1.5rem !important;
}

.m-5 {
  margin: 3rem !important;
}

.mt-5,
.my-5 {
  margin-top: 3rem !important;
}

.mr-5,
.mx-5 {
  margin-right: 3rem !important;
}

.mb-5,
.my-5 {
  margin-bottom: 3rem !important;
}

.ml-5,
.mx-5 {
  margin-left: 3rem !important;
}

.p-0 {
  padding: 0 !important;
}

.pt-0,
.py-0 {
  padding-top: 0 !important;
}

.pr-0,
.px-0 {
  padding-right: 0 !important;
}

.pb-0,
.py-0 {
  padding-bottom: 0 !important;
}

.pl-0,
.px-0 {
  padding-left: 0 !important;
}

.p-1 {
  padding: 0.25rem !important;
}

.pt-1,
.py-1 {
  padding-top: 0.25rem !important;
}

.pr-1,
.px-1 {
  padding-right: 0.25rem !important;
}

.pb-1,
.py-1 {
  padding-bottom: 0.25rem !important;
}

.pl-1,
.px-1 {
  padding-left: 0.25rem !important;
}

.p-2 {
  padding: 0.5rem !important;
}

.pt-2,
.py-2 {
  padding-top: 0.5rem !important;
}

.pr-2,
.px-2 {
  padding-right: 0.5rem !important;
}

.pb-2,
.py-2 {
  padding-bottom: 0.5rem !important;
}

.pl-2,
.px-2 {
  padding-left: 0.5rem !important;
}

.p-3 {
  padding: 1rem !important;
}

.pt-3,
.py-3 {
  padding-top: 1rem !important;
}

.pr-3,
.px-3 {
  padding-right: 1rem !important;
}

.pb-3,
.py-3 {
  padding-bottom: 1rem !important;
}

.pl-3,
.px-3 {
  padding-left: 1rem !important;
}

.p-4 {
  padding: 1.5rem !important;
}

.pt-4,
.py-4 {
  padding-top: 1.5rem !important;
}

.pr-4,
.px-4 {
  padding-right: 1.5rem !important;
}

.pb-4,
.py-4 {
  padding-bottom: 1.5rem !important;
}

.pl-4,
.px-4 {
  padding-left: 1.5rem !important;
}

.p-5 {
  padding: 3rem !important;
}

.pt-5,
.py-5 {
  padding-top: 3rem !important;
}

.pr-5,
.px-5 {
  padding-right: 3rem !important;
}

.pb-5,
.py-5 {
  padding-bottom: 3rem !important;
}

.pl-5,
.px-5 {
  padding-left: 3rem !important;
}

.m-n1 {
  margin: -0.25rem !important;
}

.mt-n1,
.my-n1 {
  margin-top: -0.25rem !important;
}

.mr-n1,
.mx-n1 {
  margin-right: -0.25rem !important;
}

.mb-n1,
.my-n1 {
  margin-bottom: -0.25rem !important;
}

.ml-n1,
.mx-n1 {
  margin-left: -0.25rem !important;
}

.m-n2 {
  margin: -0.5rem !important;
}

.mt-n2,
.my-n2 {
  margin-top: -0.5rem !important;
}

.mr-n2,
.mx-n2 {
  margin-right: -0.5rem !important;
}

.mb-n2,
.my-n2 {
  margin-bottom: -0.5rem !important;
}

.ml-n2,
.mx-n2 {
  margin-left: -0.5rem !important;
}

.m-n3 {
  margin: -1rem !important;
}

.mt-n3,
.my-n3 {
  margin-top: -1rem !important;
}

.mr-n3,
.mx-n3 {
  margin-right: -1rem !important;
}

.mb-n3,
.my-n3 {
  margin-bottom: -1rem !important;
}

.ml-n3,
.mx-n3 {
  margin-left: -1rem !important;
}

.m-n4 {
  margin: -1.5rem !important;
}

.mt-n4,
.my-n4 {
  margin-top: -1.5rem !important;
}

.mr-n4,
.mx-n4 {
  margin-right: -1.5rem !important;
}

.mb-n4,
.my-n4 {
  margin-bottom: -1.5rem !important;
}

.ml-n4,
.mx-n4 {
  margin-left: -1.5rem !important;
}

.m-n5 {
  margin: -3rem !important;
}

.mt-n5,
.my-n5 {
  margin-top: -3rem !important;
}

.mr-n5,
.mx-n5 {
  margin-right: -3rem !important;
}

.mb-n5,
.my-n5 {
  margin-bottom: -3rem !important;
}

.ml-n5,
.mx-n5 {
  margin-left: -3rem !important;
}

.m-auto {
  margin: auto !important;
}

.mt-auto,
.my-auto {
  margin-top: auto !important;
}

.mr-auto,
.mx-auto {
  margin-right: auto !important;
}

.mb-auto,
.my-auto {
  margin-bottom: auto !important;
}

.ml-auto,
.mx-auto {
  margin-left: auto !important;
}

@media (min-width: 576px) {
  .m-sm-0 {
    margin: 0 !important;
  }
  .mt-sm-0,
  .my-sm-0 {
    margin-top: 0 !important;
  }
  .mr-sm-0,
  .mx-sm-0 {
    margin-right: 0 !important;
  }
  .mb-sm-0,
  .my-sm-0 {
    margin-bottom: 0 !important;
  }
  .ml-sm-0,
  .mx-sm-0 {
    margin-left: 0 !important;
  }
  .m-sm-1 {
    margin: 0.25rem !important;
  }
  .mt-sm-1,
  .my-sm-1 {
    margin-top: 0.25rem !important;
  }
  .mr-sm-1,
  .mx-sm-1 {
    margin-right: 0.25rem !important;
  }
  .mb-sm-1,
  .my-sm-1 {
    margin-bottom: 0.25rem !important;
  }
  .ml-sm-1,
  .mx-sm-1 {
    margin-left: 0.25rem !important;
  }
  .m-sm-2 {
    margin: 0.5rem !important;
  }
  .mt-sm-2,
  .my-sm-2 {
    margin-top: 0.5rem !important;
  }
  .mr-sm-2,
  .mx-sm-2 {
    margin-right: 0.5rem !important;
  }
  .mb-sm-2,
  .my-sm-2 {
    margin-bottom: 0.5rem !important;
  }
  .ml-sm-2,
  .mx-sm-2 {
    margin-left: 0.5rem !important;
  }
  .m-sm-3 {
    margin: 1rem !important;
  }
  .mt-sm-3,
  .my-sm-3 {
    margin-top: 1rem !important;
  }
  .mr-sm-3,
  .mx-sm-3 {
    margin-right: 1rem !important;
  }
  .mb-sm-3,
  .my-sm-3 {
    margin-bottom: 1rem !important;
  }
  .ml-sm-3,
  .mx-sm-3 {
    margin-left: 1rem !important;
  }
  .m-sm-4 {
    margin: 1.5rem !important;
  }
  .mt-sm-4,
  .my-sm-4 {
    margin-top: 1.5rem !important;
  }
  .mr-sm-4,
  .mx-sm-4 {
    margin-right: 1.5rem !important;
  }
  .mb-sm-4,
  .my-sm-4 {
    margin-bottom: 1.5rem !important;
  }
  .ml-sm-4,
  .mx-sm-4 {
    margin-left: 1.5rem !important;
  }
  .m-sm-5 {
    margin: 3rem !important;
  }
  .mt-sm-5,
  .my-sm-5 {
    margin-top: 3rem !important;
  }
  .mr-sm-5,
  .mx-sm-5 {
    margin-right: 3rem !important;
  }
  .mb-sm-5,
  .my-sm-5 {
    margin-bottom: 3rem !important;
  }
  .ml-sm-5,
  .mx-sm-5 {
    margin-left: 3rem !important;
  }
  .p-sm-0 {
    padding: 0 !important;
  }
  .pt-sm-0,
  .py-sm-0 {
    padding-top: 0 !important;
  }
  .pr-sm-0,
  .px-sm-0 {
    padding-right: 0 !important;
  }
  .pb-sm-0,
  .py-sm-0 {
    padding-bottom: 0 !important;
  }
  .pl-sm-0,
  .px-sm-0 {
    padding-left: 0 !important;
  }
  .p-sm-1 {
    padding: 0.25rem !important;
  }
  .pt-sm-1,
  .py-sm-1 {
    padding-top: 0.25rem !important;
  }
  .pr-sm-1,
  .px-sm-1 {
    padding-right: 0.25rem !important;
  }
  .pb-sm-1,
  .py-sm-1 {
    padding-bottom: 0.25rem !important;
  }
  .pl-sm-1,
  .px-sm-1 {
    padding-left: 0.25rem !important;
  }
  .p-sm-2 {
    padding: 0.5rem !important;
  }
  .pt-sm-2,
  .py-sm-2 {
    padding-top: 0.5rem !important;
  }
  .pr-sm-2,
  .px-sm-2 {
    padding-right: 0.5rem !important;
  }
  .pb-sm-2,
  .py-sm-2 {
    padding-bottom: 0.5rem !important;
  }
  .pl-sm-2,
  .px-sm-2 {
    padding-left: 0.5rem !important;
  }
  .p-sm-3 {
    padding: 1rem !important;
  }
  .pt-sm-3,
  .py-sm-3 {
    padding-top: 1rem !important;
  }
  .pr-sm-3,
  .px-sm-3 {
    padding-right: 1rem !important;
  }
  .pb-sm-3,
  .py-sm-3 {
    padding-bottom: 1rem !important;
  }
  .pl-sm-3,
  .px-sm-3 {
    padding-left: 1rem !important;
  }
  .p-sm-4 {
    padding: 1.5rem !important;
  }
  .pt-sm-4,
  .py-sm-4 {
    padding-top: 1.5rem !important;
  }
  .pr-sm-4,
  .px-sm-4 {
    padding-right: 1.5rem !important;
  }
  .pb-sm-4,
  .py-sm-4 {
    padding-bottom: 1.5rem !important;
  }
  .pl-sm-4,
  .px-sm-4 {
    padding-left: 1.5rem !important;
  }
  .p-sm-5 {
    padding: 3rem !important;
  }
  .pt-sm-5,
  .py-sm-5 {
    padding-top: 3rem !important;
  }
  .pr-sm-5,
  .px-sm-5 {
    padding-right: 3rem !important;
  }
  .pb-sm-5,
  .py-sm-5 {
    padding-bottom: 3rem !important;
  }
  .pl-sm-5,
  .px-sm-5 {
    padding-left: 3rem !important;
  }
  .m-sm-n1 {
    margin: -0.25rem !important;
  }
  .mt-sm-n1,
  .my-sm-n1 {
    margin-top: -0.25rem !important;
  }
  .mr-sm-n1,
  .mx-sm-n1 {
    margin-right: -0.25rem !important;
  }
  .mb-sm-n1,
  .my-sm-n1 {
    margin-bottom: -0.25rem !important;
  }
  .ml-sm-n1,
  .mx-sm-n1 {
    margin-left: -0.25rem !important;
  }
  .m-sm-n2 {
    margin: -0.5rem !important;
  }
  .mt-sm-n2,
  .my-sm-n2 {
    margin-top: -0.5rem !important;
  }
  .mr-sm-n2,
  .mx-sm-n2 {
    margin-right: -0.5rem !important;
  }
  .mb-sm-n2,
  .my-sm-n2 {
    margin-bottom: -0.5rem !important;
  }
  .ml-sm-n2,
  .mx-sm-n2 {
    margin-left: -0.5rem !important;
  }
  .m-sm-n3 {
    margin: -1rem !important;
  }
  .mt-sm-n3,
  .my-sm-n3 {
    margin-top: -1rem !important;
  }
  .mr-sm-n3,
  .mx-sm-n3 {
    margin-right: -1rem !important;
  }
  .mb-sm-n3,
  .my-sm-n3 {
    margin-bottom: -1rem !important;
  }
  .ml-sm-n3,
  .mx-sm-n3 {
    margin-left: -1rem !important;
  }
  .m-sm-n4 {
    margin: -1.5rem !important;
  }
  .mt-sm-n4,
  .my-sm-n4 {
    margin-top: -1.5rem !important;
  }
  .mr-sm-n4,
  .mx-sm-n4 {
    margin-right: -1.5rem !important;
  }
  .mb-sm-n4,
  .my-sm-n4 {
    margin-bottom: -1.5rem !important;
  }
  .ml-sm-n4,
  .mx-sm-n4 {
    margin-left: -1.5rem !important;
  }
  .m-sm-n5 {
    margin: -3rem !important;
  }
  .mt-sm-n5,
  .my-sm-n5 {
    margin-top: -3rem !important;
  }
  .mr-sm-n5,
  .mx-sm-n5 {
    margin-right: -3rem !important;
  }
  .mb-sm-n5,
  .my-sm-n5 {
    margin-bottom: -3rem !important;
  }
  .ml-sm-n5,
  .mx-sm-n5 {
    margin-left: -3rem !important;
  }
  .m-sm-auto {
    margin: auto !important;
  }
  .mt-sm-auto,
  .my-sm-auto {
    margin-top: auto !important;
  }
  .mr-sm-auto,
  .mx-sm-auto {
    margin-right: auto !important;
  }
  .mb-sm-auto,
  .my-sm-auto {
    margin-bottom: auto !important;
  }
  .ml-sm-auto,
  .mx-sm-auto {
    margin-left: auto !important;
  }
}

@media (min-width: 768px) {
  .m-md-0 {
    margin: 0 !important;
  }
  .mt-md-0,
  .my-md-0 {
    margin-top: 0 !important;
  }
  .mr-md-0,
  .mx-md-0 {
    margin-right: 0 !important;
  }
  .mb-md-0,
  .my-md-0 {
    margin-bottom: 0 !important;
  }
  .ml-md-0,
  .mx-md-0 {
    margin-left: 0 !important;
  }
  .m-md-1 {
    margin: 0.25rem !important;
  }
  .mt-md-1,
  .my-md-1 {
    margin-top: 0.25rem !important;
  }
  .mr-md-1,
  .mx-md-1 {
    margin-right: 0.25rem !important;
  }
  .mb-md-1,
  .my-md-1 {
    margin-bottom: 0.25rem !important;
  }
  .ml-md-1,
  .mx-md-1 {
    margin-left: 0.25rem !important;
  }
  .m-md-2 {
    margin: 0.5rem !important;
  }
  .mt-md-2,
  .my-md-2 {
    margin-top: 0.5rem !important;
  }
  .mr-md-2,
  .mx-md-2 {
    margin-right: 0.5rem !important;
  }
  .mb-md-2,
  .my-md-2 {
    margin-bottom: 0.5rem !important;
  }
  .ml-md-2,
  .mx-md-2 {
    margin-left: 0.5rem !important;
  }
  .m-md-3 {
    margin: 1rem !important;
  }
  .mt-md-3,
  .my-md-3 {
    margin-top: 1rem !important;
  }
  .mr-md-3,
  .mx-md-3 {
    margin-right: 1rem !important;
  }
  .mb-md-3,
  .my-md-3 {
    margin-bottom: 1rem !important;
  }
  .ml-md-3,
  .mx-md-3 {
    margin-left: 1rem !important;
  }
  .m-md-4 {
    margin: 1.5rem !important;
  }
  .mt-md-4,
  .my-md-4 {
    margin-top: 1.5rem !important;
  }
  .mr-md-4,
  .mx-md-4 {
    margin-right: 1.5rem !important;
  }
  .mb-md-4,
  .my-md-4 {
    margin-bottom: 1.5rem !important;
  }
  .ml-md-4,
  .mx-md-4 {
    margin-left: 1.5rem !important;
  }
  .m-md-5 {
    margin: 3rem !important;
  }
  .mt-md-5,
  .my-md-5 {
    margin-top: 3rem !important;
  }
  .mr-md-5,
  .mx-md-5 {
    margin-right: 3rem !important;
  }
  .mb-md-5,
  .my-md-5 {
    margin-bottom: 3rem !important;
  }
  .ml-md-5,
  .mx-md-5 {
    margin-left: 3rem !important;
  }
  .p-md-0 {
    padding: 0 !important;
  }
  .pt-md-0,
  .py-md-0 {
    padding-top: 0 !important;
  }
  .pr-md-0,
  .px-md-0 {
    padding-right: 0 !important;
  }
  .pb-md-0,
  .py-md-0 {
    padding-bottom: 0 !important;
  }
  .pl-md-0,
  .px-md-0 {
    padding-left: 0 !important;
  }
  .p-md-1 {
    padding: 0.25rem !important;
  }
  .pt-md-1,
  .py-md-1 {
    padding-top: 0.25rem !important;
  }
  .pr-md-1,
  .px-md-1 {
    padding-right: 0.25rem !important;
  }
  .pb-md-1,
  .py-md-1 {
    padding-bottom: 0.25rem !important;
  }
  .pl-md-1,
  .px-md-1 {
    padding-left: 0.25rem !important;
  }
  .p-md-2 {
    padding: 0.5rem !important;
  }
  .pt-md-2,
  .py-md-2 {
    padding-top: 0.5rem !important;
  }
  .pr-md-2,
  .px-md-2 {
    padding-right: 0.5rem !important;
  }
  .pb-md-2,
  .py-md-2 {
    padding-bottom: 0.5rem !important;
  }
  .pl-md-2,
  .px-md-2 {
    padding-left: 0.5rem !important;
  }
  .p-md-3 {
    padding: 1rem !important;
  }
  .pt-md-3,
  .py-md-3 {
    padding-top: 1rem !important;
  }
  .pr-md-3,
  .px-md-3 {
    padding-right: 1rem !important;
  }
  .pb-md-3,
  .py-md-3 {
    padding-bottom: 1rem !important;
  }
  .pl-md-3,
  .px-md-3 {
    padding-left: 1rem !important;
  }
  .p-md-4 {
    padding: 1.5rem !important;
  }
  .pt-md-4,
  .py-md-4 {
    padding-top: 1.5rem !important;
  }
  .pr-md-4,
  .px-md-4 {
    padding-right: 1.5rem !important;
  }
  .pb-md-4,
  .py-md-4 {
    padding-bottom: 1.5rem !important;
  }
  .pl-md-4,
  .px-md-4 {
    padding-left: 1.5rem !important;
  }
  .p-md-5 {
    padding: 3rem !important;
  }
  .pt-md-5,
  .py-md-5 {
    padding-top: 3rem !important;
  }
  .pr-md-5,
  .px-md-5 {
    padding-right: 3rem !important;
  }
  .pb-md-5,
  .py-md-5 {
    padding-bottom: 3rem !important;
  }
  .pl-md-5,
  .px-md-5 {
    padding-left: 3rem !important;
  }
  .m-md-n1 {
    margin: -0.25rem !important;
  }
  .mt-md-n1,
  .my-md-n1 {
    margin-top: -0.25rem !important;
  }
  .mr-md-n1,
  .mx-md-n1 {
    margin-right: -0.25rem !important;
  }
  .mb-md-n1,
  .my-md-n1 {
    margin-bottom: -0.25rem !important;
  }
  .ml-md-n1,
  .mx-md-n1 {
    margin-left: -0.25rem !important;
  }
  .m-md-n2 {
    margin: -0.5rem !important;
  }
  .mt-md-n2,
  .my-md-n2 {
    margin-top: -0.5rem !important;
  }
  .mr-md-n2,
  .mx-md-n2 {
    margin-right: -0.5rem !important;
  }
  .mb-md-n2,
  .my-md-n2 {
    margin-bottom: -0.5rem !important;
  }
  .ml-md-n2,
  .mx-md-n2 {
    margin-left: -0.5rem !important;
  }
  .m-md-n3 {
    margin: -1rem !important;
  }
  .mt-md-n3,
  .my-md-n3 {
    margin-top: -1rem !important;
  }
  .mr-md-n3,
  .mx-md-n3 {
    margin-right: -1rem !important;
  }
  .mb-md-n3,
  .my-md-n3 {
    margin-bottom: -1rem !important;
  }
  .ml-md-n3,
  .mx-md-n3 {
    margin-left: -1rem !important;
  }
  .m-md-n4 {
    margin: -1.5rem !important;
  }
  .mt-md-n4,
  .my-md-n4 {
    margin-top: -1.5rem !important;
  }
  .mr-md-n4,
  .mx-md-n4 {
    margin-right: -1.5rem !important;
  }
  .mb-md-n4,
  .my-md-n4 {
    margin-bottom: -1.5rem !important;
  }
  .ml-md-n4,
  .mx-md-n4 {
    margin-left: -1.5rem !important;
  }
  .m-md-n5 {
    margin: -3rem !important;
  }
  .mt-md-n5,
  .my-md-n5 {
    margin-top: -3rem !important;
  }
  .mr-md-n5,
  .mx-md-n5 {
    margin-right: -3rem !important;
  }
  .mb-md-n5,
  .my-md-n5 {
    margin-bottom: -3rem !important;
  }
  .ml-md-n5,
  .mx-md-n5 {
    margin-left: -3rem !important;
  }
  .m-md-auto {
    margin: auto !important;
  }
  .mt-md-auto,
  .my-md-auto {
    margin-top: auto !important;
  }
  .mr-md-auto,
  .mx-md-auto {
    margin-right: auto !important;
  }
  .mb-md-auto,
  .my-md-auto {
    margin-bottom: auto !important;
  }
  .ml-md-auto,
  .mx-md-auto {
    margin-left: auto !important;
  }
}

@media (min-width: 992px) {
  .m-lg-0 {
    margin: 0 !important;
  }
  .mt-lg-0,
  .my-lg-0 {
    margin-top: 0 !important;
  }
  .mr-lg-0,
  .mx-lg-0 {
    margin-right: 0 !important;
  }
  .mb-lg-0,
  .my-lg-0 {
    margin-bottom: 0 !important;
  }
  .ml-lg-0,
  .mx-lg-0 {
    margin-left: 0 !important;
  }
  .m-lg-1 {
    margin: 0.25rem !important;
  }
  .mt-lg-1,
  .my-lg-1 {
    margin-top: 0.25rem !important;
  }
  .mr-lg-1,
  .mx-lg-1 {
    margin-right: 0.25rem !important;
  }
  .mb-lg-1,
  .my-lg-1 {
    margin-bottom: 0.25rem !important;
  }
  .ml-lg-1,
  .mx-lg-1 {
    margin-left: 0.25rem !important;
  }
  .m-lg-2 {
    margin: 0.5rem !important;
  }
  .mt-lg-2,
  .my-lg-2 {
    margin-top: 0.5rem !important;
  }
  .mr-lg-2,
  .mx-lg-2 {
    margin-right: 0.5rem !important;
  }
  .mb-lg-2,
  .my-lg-2 {
    margin-bottom: 0.5rem !important;
  }
  .ml-lg-2,
  .mx-lg-2 {
    margin-left: 0.5rem !important;
  }
  .m-lg-3 {
    margin: 1rem !important;
  }
  .mt-lg-3,
  .my-lg-3 {
    margin-top: 1rem !important;
  }
  .mr-lg-3,
  .mx-lg-3 {
    margin-right: 1rem !important;
  }
  .mb-lg-3,
  .my-lg-3 {
    margin-bottom: 1rem !important;
  }
  .ml-lg-3,
  .mx-lg-3 {
    margin-left: 1rem !important;
  }
  .m-lg-4 {
    margin: 1.5rem !important;
  }
  .mt-lg-4,
  .my-lg-4 {
    margin-top: 1.5rem !important;
  }
  .mr-lg-4,
  .mx-lg-4 {
    margin-right: 1.5rem !important;
  }
  .mb-lg-4,
  .my-lg-4 {
    margin-bottom: 1.5rem !important;
  }
  .ml-lg-4,
  .mx-lg-4 {
    margin-left: 1.5rem !important;
  }
  .m-lg-5 {
    margin: 3rem !important;
  }
  .mt-lg-5,
  .my-lg-5 {
    margin-top: 3rem !important;
  }
  .mr-lg-5,
  .mx-lg-5 {
    margin-right: 3rem !important;
  }
  .mb-lg-5,
  .my-lg-5 {
    margin-bottom: 3rem !important;
  }
  .ml-lg-5,
  .mx-lg-5 {
    margin-left: 3rem !important;
  }
  .p-lg-0 {
    padding: 0 !important;
  }
  .pt-lg-0,
  .py-lg-0 {
    padding-top: 0 !important;
  }
  .pr-lg-0,
  .px-lg-0 {
    padding-right: 0 !important;
  }
  .pb-lg-0,
  .py-lg-0 {
    padding-bottom: 0 !important;
  }
  .pl-lg-0,
  .px-lg-0 {
    padding-left: 0 !important;
  }
  .p-lg-1 {
    padding: 0.25rem !important;
  }
  .pt-lg-1,
  .py-lg-1 {
    padding-top: 0.25rem !important;
  }
  .pr-lg-1,
  .px-lg-1 {
    padding-right: 0.25rem !important;
  }
  .pb-lg-1,
  .py-lg-1 {
    padding-bottom: 0.25rem !important;
  }
  .pl-lg-1,
  .px-lg-1 {
    padding-left: 0.25rem !important;
  }
  .p-lg-2 {
    padding: 0.5rem !important;
  }
  .pt-lg-2,
  .py-lg-2 {
    padding-top: 0.5rem !important;
  }
  .pr-lg-2,
  .px-lg-2 {
    padding-right: 0.5rem !important;
  }
  .pb-lg-2,
  .py-lg-2 {
    padding-bottom: 0.5rem !important;
  }
  .pl-lg-2,
  .px-lg-2 {
    padding-left: 0.5rem !important;
  }
  .p-lg-3 {
    padding: 1rem !important;
  }
  .pt-lg-3,
  .py-lg-3 {
    padding-top: 1rem !important;
  }
  .pr-lg-3,
  .px-lg-3 {
    padding-right: 1rem !important;
  }
  .pb-lg-3,
  .py-lg-3 {
    padding-bottom: 1rem !important;
  }
  .pl-lg-3,
  .px-lg-3 {
    padding-left: 1rem !important;
  }
  .p-lg-4 {
    padding: 1.5rem !important;
  }
  .pt-lg-4,
  .py-lg-4 {
    padding-top: 1.5rem !important;
  }
  .pr-lg-4,
  .px-lg-4 {
    padding-right: 1.5rem !important;
  }
  .pb-lg-4,
  .py-lg-4 {
    padding-bottom: 1.5rem !important;
  }
  .pl-lg-4,
  .px-lg-4 {
    padding-left: 1.5rem !important;
  }
  .p-lg-5 {
    padding: 3rem !important;
  }
  .pt-lg-5,
  .py-lg-5 {
    padding-top: 3rem !important;
  }
  .pr-lg-5,
  .px-lg-5 {
    padding-right: 3rem !important;
  }
  .pb-lg-5,
  .py-lg-5 {
    padding-bottom: 3rem !important;
  }
  .pl-lg-5,
  .px-lg-5 {
    padding-left: 3rem !important;
  }
  .m-lg-n1 {
    margin: -0.25rem !important;
  }
  .mt-lg-n1,
  .my-lg-n1 {
    margin-top: -0.25rem !important;
  }
  .mr-lg-n1,
  .mx-lg-n1 {
    margin-right: -0.25rem !important;
  }
  .mb-lg-n1,
  .my-lg-n1 {
    margin-bottom: -0.25rem !important;
  }
  .ml-lg-n1,
  .mx-lg-n1 {
    margin-left: -0.25rem !important;
  }
  .m-lg-n2 {
    margin: -0.5rem !important;
  }
  .mt-lg-n2,
  .my-lg-n2 {
    margin-top: -0.5rem !important;
  }
  .mr-lg-n2,
  .mx-lg-n2 {
    margin-right: -0.5rem !important;
  }
  .mb-lg-n2,
  .my-lg-n2 {
    margin-bottom: -0.5rem !important;
  }
  .ml-lg-n2,
  .mx-lg-n2 {
    margin-left: -0.5rem !important;
  }
  .m-lg-n3 {
    margin: -1rem !important;
  }
  .mt-lg-n3,
  .my-lg-n3 {
    margin-top: -1rem !important;
  }
  .mr-lg-n3,
  .mx-lg-n3 {
    margin-right: -1rem !important;
  }
  .mb-lg-n3,
  .my-lg-n3 {
    margin-bottom: -1rem !important;
  }
  .ml-lg-n3,
  .mx-lg-n3 {
    margin-left: -1rem !important;
  }
  .m-lg-n4 {
    margin: -1.5rem !important;
  }
  .mt-lg-n4,
  .my-lg-n4 {
    margin-top: -1.5rem !important;
  }
  .mr-lg-n4,
  .mx-lg-n4 {
    margin-right: -1.5rem !important;
  }
  .mb-lg-n4,
  .my-lg-n4 {
    margin-bottom: -1.5rem !important;
  }
  .ml-lg-n4,
  .mx-lg-n4 {
    margin-left: -1.5rem !important;
  }
  .m-lg-n5 {
    margin: -3rem !important;
  }
  .mt-lg-n5,
  .my-lg-n5 {
    margin-top: -3rem !important;
  }
  .mr-lg-n5,
  .mx-lg-n5 {
    margin-right: -3rem !important;
  }
  .mb-lg-n5,
  .my-lg-n5 {
    margin-bottom: -3rem !important;
  }
  .ml-lg-n5,
  .mx-lg-n5 {
    margin-left: -3rem !important;
  }
  .m-lg-auto {
    margin: auto !important;
  }
  .mt-lg-auto,
  .my-lg-auto {
    margin-top: auto !important;
  }
  .mr-lg-auto,
  .mx-lg-auto {
    margin-right: auto !important;
  }
  .mb-lg-auto,
  .my-lg-auto {
    margin-bottom: auto !important;
  }
  .ml-lg-auto,
  .mx-lg-auto {
    margin-left: auto !important;
  }
}

@media (min-width: 1200px) {
  .m-xl-0 {
    margin: 0 !important;
  }
  .mt-xl-0,
  .my-xl-0 {
    margin-top: 0 !important;
  }
  .mr-xl-0,
  .mx-xl-0 {
    margin-right: 0 !important;
  }
  .mb-xl-0,
  .my-xl-0 {
    margin-bottom: 0 !important;
  }
  .ml-xl-0,
  .mx-xl-0 {
    margin-left: 0 !important;
  }
  .m-xl-1 {
    margin: 0.25rem !important;
  }
  .mt-xl-1,
  .my-xl-1 {
    margin-top: 0.25rem !important;
  }
  .mr-xl-1,
  .mx-xl-1 {
    margin-right: 0.25rem !important;
  }
  .mb-xl-1,
  .my-xl-1 {
    margin-bottom: 0.25rem !important;
  }
  .ml-xl-1,
  .mx-xl-1 {
    margin-left: 0.25rem !important;
  }
  .m-xl-2 {
    margin: 0.5rem !important;
  }
  .mt-xl-2,
  .my-xl-2 {
    margin-top: 0.5rem !important;
  }
  .mr-xl-2,
  .mx-xl-2 {
    margin-right: 0.5rem !important;
  }
  .mb-xl-2,
  .my-xl-2 {
    margin-bottom: 0.5rem !important;
  }
  .ml-xl-2,
  .mx-xl-2 {
    margin-left: 0.5rem !important;
  }
  .m-xl-3 {
    margin: 1rem !important;
  }
  .mt-xl-3,
  .my-xl-3 {
    margin-top: 1rem !important;
  }
  .mr-xl-3,
  .mx-xl-3 {
    margin-right: 1rem !important;
  }
  .mb-xl-3,
  .my-xl-3 {
    margin-bottom: 1rem !important;
  }
  .ml-xl-3,
  .mx-xl-3 {
    margin-left: 1rem !important;
  }
  .m-xl-4 {
    margin: 1.5rem !important;
  }
  .mt-xl-4,
  .my-xl-4 {
    margin-top: 1.5rem !important;
  }
  .mr-xl-4,
  .mx-xl-4 {
    margin-right: 1.5rem !important;
  }
  .mb-xl-4,
  .my-xl-4 {
    margin-bottom: 1.5rem !important;
  }
  .ml-xl-4,
  .mx-xl-4 {
    margin-left: 1.5rem !important;
  }
  .m-xl-5 {
    margin: 3rem !important;
  }
  .mt-xl-5,
  .my-xl-5 {
    margin-top: 3rem !important;
  }
  .mr-xl-5,
  .mx-xl-5 {
    margin-right: 3rem !important;
  }
  .mb-xl-5,
  .my-xl-5 {
    margin-bottom: 3rem !important;
  }
  .ml-xl-5,
  .mx-xl-5 {
    margin-left: 3rem !important;
  }
  .p-xl-0 {
    padding: 0 !important;
  }
  .pt-xl-0,
  .py-xl-0 {
    padding-top: 0 !important;
  }
  .pr-xl-0,
  .px-xl-0 {
    padding-right: 0 !important;
  }
  .pb-xl-0,
  .py-xl-0 {
    padding-bottom: 0 !important;
  }
  .pl-xl-0,
  .px-xl-0 {
    padding-left: 0 !important;
  }
  .p-xl-1 {
    padding: 0.25rem !important;
  }
  .pt-xl-1,
  .py-xl-1 {
    padding-top: 0.25rem !important;
  }
  .pr-xl-1,
  .px-xl-1 {
    padding-right: 0.25rem !important;
  }
  .pb-xl-1,
  .py-xl-1 {
    padding-bottom: 0.25rem !important;
  }
  .pl-xl-1,
  .px-xl-1 {
    padding-left: 0.25rem !important;
  }
  .p-xl-2 {
    padding: 0.5rem !important;
  }
  .pt-xl-2,
  .py-xl-2 {
    padding-top: 0.5rem !important;
  }
  .pr-xl-2,
  .px-xl-2 {
    padding-right: 0.5rem !important;
  }
  .pb-xl-2,
  .py-xl-2 {
    padding-bottom: 0.5rem !important;
  }
  .pl-xl-2,
  .px-xl-2 {
    padding-left: 0.5rem !important;
  }
  .p-xl-3 {
    padding: 1rem !important;
  }
  .pt-xl-3,
  .py-xl-3 {
    padding-top: 1rem !important;
  }
  .pr-xl-3,
  .px-xl-3 {
    padding-right: 1rem !important;
  }
  .pb-xl-3,
  .py-xl-3 {
    padding-bottom: 1rem !important;
  }
  .pl-xl-3,
  .px-xl-3 {
    padding-left: 1rem !important;
  }
  .p-xl-4 {
    padding: 1.5rem !important;
  }
  .pt-xl-4,
  .py-xl-4 {
    padding-top: 1.5rem !important;
  }
  .pr-xl-4,
  .px-xl-4 {
    padding-right: 1.5rem !important;
  }
  .pb-xl-4,
  .py-xl-4 {
    padding-bottom: 1.5rem !important;
  }
  .pl-xl-4,
  .px-xl-4 {
    padding-left: 1.5rem !important;
  }
  .p-xl-5 {
    padding: 3rem !important;
  }
  .pt-xl-5,
  .py-xl-5 {
    padding-top: 3rem !important;
  }
  .pr-xl-5,
  .px-xl-5 {
    padding-right: 3rem !important;
  }
  .pb-xl-5,
  .py-xl-5 {
    padding-bottom: 3rem !important;
  }
  .pl-xl-5,
  .px-xl-5 {
    padding-left: 3rem !important;
  }
  .m-xl-n1 {
    margin: -0.25rem !important;
  }
  .mt-xl-n1,
  .my-xl-n1 {
    margin-top: -0.25rem !important;
  }
  .mr-xl-n1,
  .mx-xl-n1 {
    margin-right: -0.25rem !important;
  }
  .mb-xl-n1,
  .my-xl-n1 {
    margin-bottom: -0.25rem !important;
  }
  .ml-xl-n1,
  .mx-xl-n1 {
    margin-left: -0.25rem !important;
  }
  .m-xl-n2 {
    margin: -0.5rem !important;
  }
  .mt-xl-n2,
  .my-xl-n2 {
    margin-top: -0.5rem !important;
  }
  .mr-xl-n2,
  .mx-xl-n2 {
    margin-right: -0.5rem !important;
  }
  .mb-xl-n2,
  .my-xl-n2 {
    margin-bottom: -0.5rem !important;
  }
  .ml-xl-n2,
  .mx-xl-n2 {
    margin-left: -0.5rem !important;
  }
  .m-xl-n3 {
    margin: -1rem !important;
  }
  .mt-xl-n3,
  .my-xl-n3 {
    margin-top: -1rem !important;
  }
  .mr-xl-n3,
  .mx-xl-n3 {
    margin-right: -1rem !important;
  }
  .mb-xl-n3,
  .my-xl-n3 {
    margin-bottom: -1rem !important;
  }
  .ml-xl-n3,
  .mx-xl-n3 {
    margin-left: -1rem !important;
  }
  .m-xl-n4 {
    margin: -1.5rem !important;
  }
  .mt-xl-n4,
  .my-xl-n4 {
    margin-top: -1.5rem !important;
  }
  .mr-xl-n4,
  .mx-xl-n4 {
    margin-right: -1.5rem !important;
  }
  .mb-xl-n4,
  .my-xl-n4 {
    margin-bottom: -1.5rem !important;
  }
  .ml-xl-n4,
  .mx-xl-n4 {
    margin-left: -1.5rem !important;
  }
  .m-xl-n5 {
    margin: -3rem !important;
  }
  .mt-xl-n5,
  .my-xl-n5 {
    margin-top: -3rem !important;
  }
  .mr-xl-n5,
  .mx-xl-n5 {
    margin-right: -3rem !important;
  }
  .mb-xl-n5,
  .my-xl-n5 {
    margin-bottom: -3rem !important;
  }
  .ml-xl-n5,
  .mx-xl-n5 {
    margin-left: -3rem !important;
  }
  .m-xl-auto {
    margin: auto !important;
  }
  .mt-xl-auto,
  .my-xl-auto {
    margin-top: auto !important;
  }
  .mr-xl-auto,
  .mx-xl-auto {
    margin-right: auto !important;
  }
  .mb-xl-auto,
  .my-xl-auto {
    margin-bottom: auto !important;
  }
  .ml-xl-auto,
  .mx-xl-auto {
    margin-left: auto !important;
  }
}

.stretched-link::after {
  position: absolute;
  top: 0;
  right: 0;
  bottom: 0;
  left: 0;
  z-index: 1;
  pointer-events: auto;
  content: "";
  background-color: rgba(0, 0, 0, 0);
}

.text-monospace {
  font-family: SFMono-Regular, Menlo, Monaco, Consolas, "Liberation Mono", "Courier New", monospace !important;
}

.text-justify {
  text-align: justify !important;
}

.text-wrap {
  white-space: normal !important;
}

.text-nowrap {
  white-space: nowrap !important;
}

.text-truncate {
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.text-left {
  text-align: left !important;
}

.text-right {
  text-align: right !important;
}

.text-center {
  text-align: center !important;
}

@media (min-width: 576px) {
  .text-sm-left {
    text-align: left !important;
  }
  .text-sm-right {
    text-align: right !important;
  }
  .text-sm-center {
    text-align: center !important;
  }
}

@media (min-width: 768px) {
  .text-md-left {
    text-align: left !important;
  }
  .text-md-right {
    text-align: right !important;
  }
  .text-md-center {
    text-align: center !important;
  }
}

@media (min-width: 992px) {
  .text-lg-left {
    text-align: left !important;
  }
  .text-lg-right {
    text-align: right !important;
  }
  .text-lg-center {
    text-align: center !important;
  }
}

@media (min-width: 1200px) {
  .text-xl-left {
    text-align: left !important;
  }
  .text-xl-right {
    text-align: right !important;
  }
  .text-xl-center {
    text-align: center !important;
  }
}

.text-lowercase {
  text-transform: lowercase !important;
}

.text-uppercase {
  text-transform: uppercase !important;
}

.text-capitalize {
  text-transform: capitalize !important;
}

.font-weight-light {
  font-weight: 300 !important;
}

.font-weight-lighter {
  font-weight: lighter !important;
}

.font-weight-normal {
  font-weight: 400 !important;
}

.font-weight-bold {
  font-weight: 700 !important;
}

.font-weight-bolder {
  font-weight: bolder !important;
}

.font-italic {
  font-style: italic !important;
}

.text-white {
  color: #fff !important;
}

.text-primary {
  color: #F9A392 !important;
}

a.text-primary:hover, a.text-primary:focus {
  color: #f56649 !important;
}

.text-secondary {
  color: #6EBBF6 !important;
}

a.text-secondary:hover, a.text-secondary:focus {
  color: #2699f2 !important;
}

.text-success {
  color: #28a745 !important;
}

a.text-success:hover, a.text-success:focus {
  color: #19692c !important;
}

.text-info {
  color: #17a2b8 !important;
}

a.text-info:hover, a.text-info:focus {
  color: #0f6674 !important;
}

.text-warning {
  color: #ffc107 !important;
}

a.text-warning:hover, a.text-warning:focus {
  color: #ba8b00 !important;
}

.text-danger {
  color: #dc3545 !important;
}

a.text-danger:hover, a.text-danger:focus {
  color: #a71d2a !important;
}

.text-light {
  color: #FEF1EF !important;
}

a.text-light:hover, a.text-light:focus {
  color: #fab2a7 !important;
}

.text-dark {
  color: #211E1C !important;
}

a.text-dark:hover, a.text-dark:focus {
  color: black !important;
}

.text-body {
  color: #757575 !important;
}

.text-muted {
  color: #6c757d !important;
}

.text-black-50 {
  color: rgba(0, 0, 0, 0.5) !important;
}

.text-white-50 {
  color: rgba(255, 255, 255, 0.5) !important;
}

.text-hide {
  font: 0/0 a;
  color: transparent;
  text-shadow: none;
  background-color: transparent;
  border: 0;
}

.text-decoration-none {
  text-decoration: none !important;
}

.text-break {
  word-break: break-word !important;
  word-wrap: break-word !important;
}

.text-reset {
  color: inherit !important;
}

.visible {
  visibility: visible !important;
}

.invisible {
  visibility: hidden !important;
}

@media print {
  *,
  *::before,
  *::after {
    text-shadow: none !important;
    box-shadow: none !important;
  }
  a:not(.btn) {
    text-decoration: underline;
  }
  abbr[title]::after {
    content: " (" attr(title) ")";
  }
  pre {
    white-space: pre-wrap !important;
  }
  pre,
  blockquote {
    border: 1px solid #adb5bd;
    page-break-inside: avoid;
  }
  thead {
    display: table-header-group;
  }
  tr,
  img {
    page-break-inside: avoid;
  }
  p,
  h2,
  h3 {
    orphans: 3;
    widows: 3;
  }
  h2,
  h3 {
    page-break-after: avoid;
  }
  @page {
    size: a3;
  }
  body {
    min-width: 992px !important;
  }
  .container {
    min-width: 992px !important;
  }
  .navbar {
    display: none;
  }
  .badge {
    border: 1px solid #000;
  }
  .table {
    border-collapse: collapse !important;
  }
  .table td,
  .table th {
    background-color: #fff !important;
  }
  .table-bordered th,
  .table-bordered td {
    border: 1px solid #dee2e6 !important;
  }
  .table-dark {
    color: inherit;
  }
  .table-dark th,
  .table-dark td,
  .table-dark thead th,
  .table-dark tbody + tbody {
    border-color: #dee2e6;
  }
  .table .thead-dark th {
    color: inherit;
    border-color: #dee2e6;
  }
}

/********** Template CSS ************/
h1,
h2,
.font-weight-bold {
  font-weight: 700 !important;
}

h3,
h4,
.font-weight-semi-bold {
  font-weight: 600 !important;
}

h5,
h6,
.font-weight-medium {
  font-weight: 500 !important;
}

.btn {
  font-weight: 500;
}

.btn.btn-sm, .btn-group-sm > .btn {
  font-weight: 400;
}

.btn.btn-primary,
.btn.btn-secondary {
  color: #FFFFFF !important;
}

.btn-square {
  width: 36px;
  height: 36px;
}

.btn-sm-square {
  width: 28px;
  height: 28px;
}

.btn-lg-square {
  width: 46px;
  height: 46px;
}

.btn-square,
.btn-sm-square,
.btn-lg-square {
  padding: 0;
  display: flex;
  align-items: center;
  justify-content: center;
}

.back-to-top {
  position: fixed;
  display: none;
  right: 30px;
  bottom: 30px;
  z-index: 11;
  animation: action 1s infinite alternate;
}

@keyframes action {
  0% {
    transform: translateY(0);
  }
  100% {
    transform: translateY(-15px);
  }
}

.navbar-light .navbar-nav .nav-link {
  padding: 30px 15px;
  font-weight: 600;
  letter-spacing: 1px;
  color: #211E1C;
  outline: none;
}

.navbar-light .navbar-nav .nav-link:hover,
.navbar-light .navbar-nav .nav-link.active {
  color: #F9A392;
}

@media (max-width: 991.98px) {
  .navbar-light .navbar-nav .nav-link {
    padding: 10px 15px;
  }
}

.carousel-indicators li {
  width: 25px;
  height: 25px;
  margin: 0 5px 10px 5px;
  background: transparent;
  border: 1px solid #FFFFFF;
  transition: .5s;
}

.carousel-indicators .active {
  width: 50px;
  background: #FFFFFF;
}

.carousel-caption {
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  background: rgba(33, 30, 28, 0.7);
  z-index: 1;
}

.service-item img {
  position: relative;
  margin-top: 40px;
  transition: .5s;
}

.service-item .service-text {
  position: absolute;
  width: 100%;
  height: calc(100% + 86px);
  top: 0;
  left: 0;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: flex-end;
  background: rgba(33, 30, 28, 0.5);
  transition: .5s;
  z-index: 1;
}

.service-item:hover img {
  margin-top: 0px;
}

.service-item:hover .service-text {
  height: calc(100% + 40px);
}

.bg-appointment {
  background: linear-gradient(rgba(33, 30, 28, 0.7), rgba(33, 40, 28, 0.7)), url(../img/carousel-1.jpg), no-repeat center center;
  background-size: cover;
}

.bg-pricing {
  background: linear-gradient(rgba(33, 30, 28, 0.7), rgba(33, 40, 28, 0.7)), url(../img/carousel-2.jpg), no-repeat center center;
  background-size: cover;
}

.bg-jumbotron {
  background: linear-gradient(rgba(33, 30, 28, 0.7), rgba(33, 40, 28, 0.7)), url(../img/carousel-3.jpg), no-repeat center center;
  background-size: cover;
}

@media (min-width: 992px) {
  .hours-text,
  .pricing-text,
  .contact-form {
    margin-left: -120px;
  }
}

.team img {
  position: relative;
  z-index: 1;
}

.team .team-text {
  position: relative;
  width: 100%;
  height: 100px;
  top: 0px;
  left: 0;
  display: flex;
  align-items: center;
  justify-content: center;
  flex-direction: column;
  transition: .5s;
}

.team:hover .team-text {
  top: 100px;
}

.team .team-social {
  position: absolute;
  width: 100%;
  height: 100px;
  top: -100px;
  left: 0;
  display: flex;
  align-items: center;
  justify-content: center;
  transition: .5s;
}

.team:hover .team-social {
  top: 0;
}

.testimonial-carousel .owl-dots {
  margin-top: 20px;
}

.testimonial-carousel .owl-dot {
  display: inline-block;
  margin: 0 5px;
  width: 25px;
  height: 25px;
  background: #FEF1EF;
  border: 1px solid #F9A392;
  transition: .5s;
}

.testimonial-carousel .owl-dot.active {
  width: 50px;
  background: #F9A392;
}

.footer p,
.footer a,
.footer i {
  color: #CCCCCC !important;
}

.footer .btn-primary i {
  color: #FFFFFF !important;
}

@media (min-width: 992px) {
  .footer::after {
    position: absolute;
    content: "";
    width: 1px;
    height: 100%;
    top: 0;
    left: 50%;
    background: rgba(255, 255, 255, 0.15);
  }
}

.contact-form .help-block ul {
  margin: 0;
  padding: 0;
  list-style-type: none;
}