:root {
    --custom-primary-color: #009CDE; /* Color principal (azul) */
    --custom-secondary-color: #6c757d; /* Color secundario (gris) */
    --custom-accent-color: #28a745; /* Color de acento (verde) */
    --custom-text-color: #009CDE; /* Color de texto */
    --custom-background-color: #f8f9fa; /* Color de fondo */
    --custom-link-color: #0056b3; /* Color de los enlaces */
    --custom-hover-color: #0056b3; /* Color al pasar el mouse */
    --custom-icon-color: #007bff; /* Color de los íconos */
}
/* general inicio */

.text-primary-custom{
    color: var(--custom-text-color)!important;
}

.cust-circle-icon {
    width: 24px!important;
    height: 24px!important;
    border-radius: 50%!important;
    display: flex!important;
    align-items: center!important;
    justify-content: center!important;
    font-size: 16px!important;
    overflow: hidden!important;
}

.clinic-colum {
    background: url(../../images/use/aseguradoras.png) no-repeat center center !important;
    background-size: cover !important;

}


.navigation {
    margin: 0; /* Elimina márgenes */
    padding: 0; /* Elimina padding */
}

.navigation > li {
    padding: 0 10px; /* Ajusta el padding entre los enlaces */
}

.navigation a {
    white-space: nowrap; /* Evita que los enlaces se vayan a la siguiente línea */
}

.collapse.navbar-collapse {
    flex-grow: 1; /* Asegúrate de que el contenedor ocupe todo el ancho disponible */
}

.file-action {
    color: #007bff; /* Color azul para que se distinga */
    font-weight: bold; /* Resaltar el texto */
    cursor: pointer; /* Cambia el cursor para indicar que es interactivo */
}
.file-action:hover{
    color: white; /* Color azul para que se distinga */
    font-weight: bold; /* Resaltar el texto */
    cursor: pointer; /* Cambia el cursor para indicar que es interactivo */
}
.btn-custom-file:hover >  * {
    color: white!important;
}

/* general fin */

/* sliders inicio */
.pbmit-service-style-2 {
    display: flex;
    flex-direction: column;
    justify-content: space-between;
    min-height: 400px; /* Ajusta esta altura según tus necesidades */
}

.pbminfotech-post-item {
    display: flex;
    flex-direction: column;
    flex-grow: 1;
}

.pbminfotech-box-content {
    flex-grow: 1;
    display: flex;
    flex-direction: column;
    justify-content: space-between;
}
/* slider fin */

/* form section reservation inicio */
.home2-emergency-section {
    /* background: #eaeef3!important; */
}
/* form section reservation fin */

/* footer inicio */
.widget-title {
    font-size: 18px;
    margin-bottom: 15px;
}

.hospital-unit {
    margin-bottom: 15px;
}

.pbmit-footer-text-area {
    color: white;
    font-size: 14px;
}

.footer-social-links i {
    font-size: 20px;
    color: #fff;
}

.footer-social-links a {
    color: #fff;
    margin: 0 10px;
}

/* footer fin  */


/* contacto  */
.contact-section-bg {
    padding-top: 0px !important;
}
/* contacto  */


/* historia ini */

.ourhistory-right img {
    transition: transform 0.3s ease; /* Controla la duración y suavidad de la animación */
}

.ourhistory-right img:hover {
    transform: scale(1.05); /* Aumenta la escala de la imagen al 110% */
}

.contenedor-titulo {
  position: relative;
  display: inline-block;
  text-align: center;
}

  /* Mantener tu estilo original de la etiqueta NUEVA tal cual */
  .etiqueta-nueva {
    position: absolute;
    top: 47%;
    left: 50%;
    transform: translate(-50%, -50%);
    color: #0056b3;
    font-weight: bold;
    font-style: italic;
    white-space: nowrap;
    font-size: 2.5rem;
    z-index: 9999;
  }
  @media (max-width: 768px) {
    .etiqueta-nueva {
      top: 45%;
      left: 33%;
      font-size: 1.2rem;
    }
  }
  @media (max-width: 480px) {
    .etiqueta-nueva {
      top: 42%;
      left: 33%;
      font-size: 1rem;
    }
  }

  /* Asegurar que cada slide sea contenedor relativo */
  #carouselExample .carousel-item {
    position: relative;
    overflow: hidden;
  }

  /* Título centrado sobre la imagen, alta especificidad para evitar override */
  #carouselExample .carousel-inner > .carousel-item .title-img-principal,
  .carousel-item .title-img-principal {
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    color: #ffffff;
    font-weight: 700;
    font-size: 2.5rem;
    text-align: center;
    white-space: nowrap;
    z-index: 50;
    pointer-events: none;
    text-shadow: 0 2px 8px rgba(0,0,0,0.6);
    display: block;
  }

  @media (max-width: 992px) {
    #carouselExample .carousel-inner > .carousel-item .title-img-principal,
    .carousel-item .title-img-principal {
      font-size: 1.8rem;
      white-space: normal;
      padding: 0 12px;
    }
  }
  @media (max-width: 576px) {
    #carouselExample .carousel-inner > .carousel-item .title-img-principal,
    .carousel-item .title-img-principal {
      font-size: 1rem;
    }
  }

  /* Asegurar imagen debajo del título */
  #carouselExample .carousel-inner > .carousel-item img {
    position: relative;
    z-index: 1;
    width: 100%;
    height: auto;
    object-fit: cover;
    display: block;
  }


  /* capa blanca slider */
/* Overlay blanca semitransparente sobre slides (no requiere cambios en HTML) */
.rs-slide, .tp-revslider-slidesli {
  position: relative !important;
  overflow: hidden !important;
}

/* Capa overlay creada con pseudo-elemento; cobertura total de la slide */
.rs-slide::after,
.tp-revslider-slidesli::after {
  content: "";
  position: absolute;
  inset: 0;
  background: rgba(255,255,255,0.5);
  z-index: 9;
  pointer-events: none;
  box-sizing: border-box;
  transition: background .18s ease, opacity .18s ease;
}

/* Forzar que las capas de texto de Revolution queden por encima de la overlay */
.rs-slide rs-layer,
.rs-slide .tp-caption,
.rs-slide .tp-resp-layer,
.tp-revslider-slidesli rs-layer,
.tp-revslider-slidesli .tp-caption,
.tp-revslider-slidesli .tp-resp-layer {
  z-index: 11 !important;
}

/* Opción: activar blur visual (puedes quitarla si quieres solo rgba) */
.rs-slide::after,
.tp-revslider-slidesli::after {
  /* Si no quieres blur elimina las dos líneas siguientes */
  backdrop-filter: blur(0px);
  -webkit-backdrop-filter: blur(0px);
}

/* Si quieres habilitar blur en escritorio, usa esta clase desde CSS dinámico o cámbialo aquí */
.rs-slide.with-blur::after,
.tp-revslider-slidesli.with-blur::after {
  backdrop-filter: blur(6px);
  -webkit-backdrop-filter: blur(6px);
}

/* Rendimiento: desactivar blur y aumentar ligeramente opacidad en tablets/móviles */
@media (max-width: 1024px) {
  .rs-slide::after,
  .tp-revslider-slidesli::after {
    backdrop-filter: none !important;
    -webkit-backdrop-filter: none !important;
    background: rgba(255,255,255,0.55) !important;
  }
}

@media (max-width: 480px) {
  .rs-slide::after,
  .tp-revslider-slidesli::after {
    background: rgba(255,255,255,0.6) !important;
  }
}

/* Fallback: si Revolution genera overlays propias que cubren todo, forzamos visibilidad de texto */
.rs-slide .tp-caption,
.tp-revslider-slidesli .tp-caption {
  position: relative !important;
}

/* Ajuste rápido si alguna capa de texto sigue oculta (aumenta solo si lo necesitas) */
/* .rs-slide rs-layer, .tp-revslider-slidesli rs-layer { z-index: 9999 !important; } */
.btn-outline-rhp {
  --bs-btn-color: #081839;
  --bs-btn-border-color: #081839;
  --bs-btn-hover-color: #fff;
  --bs-btn-hover-bg: #081839;
  --bs-btn-hover-border-color: #081839;
  --bs-btn-focus-shadow-rgb: 25,135,84;
  --bs-btn-active-color: #fff;
  --bs-btn-active-bg: #081839;
  --bs-btn-active-border-color: #081839;
  --bs-btn-active-shadow: inset 0 3px 5px rgba(0, 0, 0, 0.125);
  --bs-btn-disabled-color: #081839;
  --bs-btn-disabled-bg: transparent;
  --bs-gradient: none;
}
.btn-outline-rhp:hover {
  color: var(--bs-btn-hover-color);
  background-color: var(--bs-btn-hover-bg);
  border-color: var(--bs-btn-hover-border-color);
}
.btn-outline-mchp {
  --bs-btn-color: #1bbde4;
  --bs-btn-border-color: #1bbde4;
  --bs-btn-hover-color: #fff;
  --bs-btn-hover-bg: #1bbde4;
  --bs-btn-hover-border-color: #1bbde4;
  --bs-btn-focus-shadow-rgb: 255,193,7;
  --bs-btn-active-color: #fff;
  --bs-btn-active-bg: #1bbde4;
  --bs-btn-active-border-color: #1bbde4;
  --bs-btn-active-shadow: inset 0 3px 5px rgba(0, 0, 0, 0.125);
  --bs-btn-disabled-color: #1bbde4;
  --bs-btn-disabled-bg: transparent;
  --bs-gradient: none;
}