:root {
--primary-100:#26A69A;
--primary-200:#408d86;
--primary-300:#cdfaf6;
--accent-100:#80CBC4;
--accent-200:#43A49B;
--text-100:#263339;
--text-200:#728f9e;
--bg-100:#E0F2F1;
--bg-200:#D0EBEA;
--bg-300:#FFFFFF;
--accent-300:#F18F01;
--accent-400:#833500;  
--accent-500: #ebe2cd;
--accent-600: #c2baa6;
--accent-700: #ffbfab;
}
.vet-bg-primary-200 {
  background-color: #26A69A; }
.vet-text-primary-200 {
    color: #cdfaf6; }

.bttable-primary-100 thead th {
  background-color: #80CBC4;
  color: #728f9e;
  font-weight: bold;
}
/*=========== COLORES ======================*/
.bg-accent-700{
  background-color : #ffbfab;
}
.accent-100 {
  color : #80CBC4;
}
.bg-accent-100 {
  background-color : #80CBC4;
}
.accent-500 {
  color : #ebe2cd;
}
.accent-300 {
  color : #F18F01;
}
.bg-accent-300 {
  background-color : #F18F01;
}
.accent-400 {
  color : #833500;
}
.primary-300 {
  color : #cdfaf6;
}
.accent-600 {
  color : #c2baa6;
}
.bg-accent-600 {
  background-color : #c2baa6;
}
.text-100 {
  color : #263339;
}
.bg-text-100 {
  background-color : #263339;
}
.bg-text-200 {
  background-color : #408d86;
}
.bg-salmon {
  background-color: #ff6384;
}
/*=========== TABLAS =========================*/
.bttable-vetzy thead th {
  background-color: #086972;
  color: #fff;
  font-weight: bold;
}
.bttable-vetzy-600 thead th {
  background-color: #c2baa6;
  color: #833500;
  font-weight: bold;
}
.tbl-selected tbody tr.selected {
  background-color: #cdfaf6;
}
.modal-bs-table {
  max-height: calc(100vh - 210px); /* Ajusta '210px' al espacio que ocupan el header y footer del modal */
  overflow-y: auto;
}

.list-group-item.active {
  color: #833500 !important;
  background-color: #c2baa6 !important;
  border-color: #c2baa6 !important; }
/*=========== HOME =========================*/
.card.vethome {
  background-color: #80CBC4;
  position: relative;
}
.card.vethomeserv {
  background-color: #c2baa6;
  position: relative;
}
.card.vethome .icono {
  font-size: 100px;
  opacity: 0.2;
  position: absolute;
  right: -30px;  /* Aumenta este valor para mover el ícono más a la derecha */
  top: 50px;  /* Aumenta este valor para mover el ícono más abajo */
}
.card.vetsaehome {
  position: relative;
}

.card.vetsaehome .vethome-progress-bar {
  position: absolute;
  bottom: 0;
  left: 0;
  width: 0%;
  height: 2px;
  background-color: #80CBC4; /* puedes cambiar esto a cualquier color que prefieras */
}
/* ======== AGENDA ===============================================*/
body .fc .fc-button-primary {
  background-color: #80CBC4; /* Color de fondo azul */
  border-color: #80CBC4; /* Color del borde */
  color: black; /* Color del texto */
}

body .fc .fc-button-primary:hover {
  background-color: #086972; /* Color de fondo más oscuro al pasar el ratón */
  border-color: #086972; /* Color del borde más oscuro al pasar el ratón */
}

body .fc .fc-button-primary:not(:disabled).fc-button-active,
body .fc .fc-button-primary:not(:disabled):active,
body .fc .fc-button-primary:not(:disabled):focus {
  background-color: #086972; /* Color de fondo para el estado activo/enfocado */
  border-color: #086972; /* Color del borde para el estado activo/enfocado */
  color: white; /* Color del texto para el estado activo/enfocado */
}

#fvet7000Calendar .tooltip {
  border: 1px solid #ccc !important; /* Borde gris claro */
  box-shadow: 0px 5px 10px rgba(0, 0, 0, 0.2) !important; /* Sombra ligera */
  font-size: 0.875rem !important; /* Tamaño de letra más pequeño */
}

#fvet7000Calendar .tooltip .tooltip-inner {
  background-color: #fff !important; /* Fondo blanco para el tooltip */
  color: #000 !important; /* Texto negro para el tooltip */
  border-radius: 0.25rem !important; /* Bordes redondeados */
  padding: 0.5rem !important; /* Relleno interior */
}

#fvet7000Calendar .tooltip .arrow::before {
  border-top-color: #ccc !important; /* Flecha del mismo color que el borde */
}
/*========= PERFILES =================================*/
.avatar-2 {
  width: 120px;
  height: 120px;
  overflow: hidden;
  margin: auto;
  border-radius: 50%; }

/*========= CLINICA =================================*/
.clinica-image-container {
  margin: 10px;
  width: 200px;
}
.clinica-image-thumbnail {
  width: 100%;
  height: auto;
}
.clinica-trash-icon {
  position: absolute;
  top: 0;
  right: 10px;
  cursor: pointer;
}