/*
Theme Name: Travel Tour Child
Theme URI: http://demo.goodlayers.com/infinite
Template: traveltour
Author: Goodlayers
Author URI: http://goodlayers.com
Description: Goodlayers Travel Tour Child Theme
Tags: light,dark,right-sidebar,responsive-layout
Version: 1.0.0.1593552435
Updated: 2020-06-30 22:27:15

*/

/* --- ESTILOS MEJORADOS PARA LOS TOURS (REEMPLAZAR EL CÓDIGO ANTERIOR) --- */

/* 1. Establecer una altura fija para todas las imágenes */
.tourmaster-tour-grid .tourmaster-tour-thumbnail img {
    height: 240px; /* Puedes ajustar este valor si lo necesitas */
    width: 100%;
    object-fit: cover; /* Esto asegura que la imagen cubra el espacio sin deformarse */
}

/* 2. Alinear el contenido a la izquierda */
.tourmaster-tour-grid .tourmaster-tour-content-wrap {
    text-align: left;
}

/* 3. Reducir el espacio sobre el botón */
.tourmaster-tour-read-more-wrap {
    margin-top: 10px; /* Espacio de 10px entre el texto y el botón */
    padding-bottom: 15px; 
}

/* --- Estilo del botón "Book Now" para que coincida con la imagen de ejemplo --- */

/* 4. Ocultar el texto original "Read More" */
.tourmaster-tour-read-more {
    font-size: 0 !important;
    line-height: 0;
}

/* 5. Añadir el nuevo texto "Book Now" */
.tourmaster-tour-read-more::before {
    content: 'Book Now';
    font-size: 16px !important;
    line-height: normal;
    letter-spacing: normal;
    font-weight: bold;
}

/* 6. Aplicar los estilos del botón naranja */
.tourmaster-tour-read-more-wrap .tourmaster-tour-read-more {
    display: inline-block;
    padding: 12px 28px;
    background-color: #ff9b54; /* Color naranja del ejemplo */
    color: #2d003b !important;
    text-align: center;
    text-decoration: none;
    border-radius: 5px; /* Bordes ligeramente redondeados */
    border: none;
    box-shadow: 0 2px 4px rgba(0,0,0,0.1); /* Sombra sutil */
    transition: all 0.3s ease;
}

/* 7. Efecto al pasar el ratón (hover) */
.tourmaster-tour-read-more-wrap .tourmaster-tour-read-more:hover {
    background-color: #f88b3e; /* Naranja un poco más oscuro */
    color: #ffffff !important;
    transform: translateY(-2px); /* Pequeño efecto de elevación */
    box-shadow: 0 4px 8px rgba(0,0,0,0.15);
}



/* --- OPCIÓN 1: Flecha de título más grande y con cambio de color --- */

/* 1. Prepara el enlace del título */
.tourmaster-tour-item-column-2 .tourmaster-tour-title a {
    position: relative;
    padding-right: 40px; /* Aumentamos el espacio para la flecha más grande */
    display: block;
    color: #1a1a1a; /* Color inicial del título */
    transition: color 0.3s ease; /* Transición suave de color */
}

/* 2. El título cambia a color naranja al pasar el ratón */
.tourmaster-tour-item-column-2 .tourmaster-tour-title a:hover {
    color: #ff9b54;
}

/* 3. Crea la flecha (más grande y visible) */
.tourmaster-tour-item-column-2 .tourmaster-tour-title a::after {
    content: '\35'; /* Código del ícono de flecha derecha */
    font-family: 'ElegantIcons';
    position: absolute;
    right: 0;
    top: 50%;
    transform: translateY(-50%);
    font-size: 34px; /* Flecha más grande */
    font-weight: normal;
    color: #ff9b54; /* Color naranja */
    transition: right 0.3s ease;
}

/* 4. Efecto de movimiento al pasar el ratón */
.tourmaster-tour-item-column-2 .tourmaster-tour-title a:hover::after {
    right: -10px; /* Mueve la flecha un poco a la derecha */
}


/* --- Estilos para las flechas del slider de testimonios (CORREGIDO) --- */

/* 1. Prepara el contenedor del slider para posicionar las flechas a los lados */
.gdlr-core-testimonial-item .gdlr-core-flexslider {
    position: relative;
    padding: 0 45px; /* Añade espacio a los lados para que el texto no choque con las nuevas flechas */
}

/* 2. Estilos base para ambas flechas */
.gdlr-core-testimonial-item .flex-direction-nav a {
    opacity: 1; /* Asegura que sean visibles */
    width: 45px;      /* Ancho del círculo */
    height: 45px;     /* Alto del círculo */
    border-radius: 50%; /* Hace el fondo circular */
    background-color: #ff9b54; /* Color naranja */
    display: flex;
    justify-content: center;
    align-items: center;
    box-shadow: 0 2px 5px rgba(0,0,0,0.15);
    transition: all 0.3s ease;
    top: 50%; /* Centra las flechas verticalmente */
    transform: translateY(-50%);
	margin: 0 10px;
}

/* 3. Estilo para el ícono (la flecha en sí) */
.gdlr-core-testimonial-item .flex-direction-nav a i {
    color: #2d003b !important; /* Color de la flecha (blanco) */
	font-size: 30px;
    line-height: 40px;
    height: auto;     /* Ajuste para centrado */
    margin: 0;        /* Resetea márgenes */
    padding: 0;       /* Resetea rellenos */
}
.gdlr-core-testimonial-item .flex-direction-nav a i:before {
    font-weight: bold !important;
}

/* 4. Posición de la flecha IZQUIERDA */
.gdlr-core-testimonial-item .flex-direction-nav .flex-prev {
    left: 0px; /* La posiciona a la izquierda */
}

/* 5. Posición de la flecha DERECHA */
.gdlr-core-testimonial-item .flex-direction-nav .flex-next {
    right: 0px; /* La posiciona a la derecha */
}

/* 6. Efecto al pasar el ratón por encima */
.gdlr-core-testimonial-item .flex-direction-nav a:hover {
    background-color: #f88b3e; /* Naranja un poco más oscuro */
    transform: translateY(-50%) scale(1.1); /* Se agranda un poco */
}

/* --- Reducir espaciado de la galería de clientes en MÓVIL --- */

@media (max-width: 767px) {
	.tourmaster-tour-grid-style-5 .tourmaster-tour-thumbnail{
		padding-left:30px;
	}
  .gdlr-core-gallery-item-holder .gdlr-core-item-mgb {
    margin-bottom: 10px !important; /* Reduce el espacio vertical entre los logos */
    padding-left: 5px !important;   /* Reduce el espacio horizontal */
    padding-right: 5px !important;  /* Reduce el espacio horizontal */
  }
  .gdlr-core-page-builder-body img{
    max-height: 150px !important;
	width: auto !important;
  }
   /* 1. REGLA GENERAL: Clientes en 2 columnas */
    .gdlr-core-gallery-item-holder .gdlr-core-item-list {
        width: 50% !important;
        float: left !important;
        padding: 5px !important;
        clear: none !important;
    }

    /* 2. EXCEPCIÓN: Sección "Why Us" en 1 columna grande */
    #gdlr-core-gallery-1 .gdlr-core-item-list {
        width: 100% !important;
        float: none !important;
        clear: both !important;
        margin-bottom: 15px !important;
        padding-left: 0 !important;
        padding-right: 0 !important;
    }

    /* 3. REGLA BASE PARA LAS FOTOS DE "WHY US" */
    #gdlr-core-gallery-1 img {
        width: 100% !important;
        height: auto !important; 
        object-fit: cover !important;
    }

    /* 4. REGLA QUIRÚRGICA: Ajuste de la cara ("Expert Guidance") */
    /* El 50% es centro horizontal. El 15% es la altura vertical */
    #gdlr-core-gallery-1 .gdlr-core-item-list:nth-child(2) img {
        object-position: 50% 15% !important;
    }
}

