/**

 * Traveler Reviews Block Styles

 *

 * Grid grande de reviews con filtros

 *

 * @package Travel\Blocks

 * @since 1.0.0

 */



/* ===== CONTAINER ===== */



.traveler-reviews {

    width: 100%;

    padding: 4rem 0;

}



/* ===== HEADER ===== */



.traveler-reviews__header {

    text-align: center;

    margin-bottom: 3rem;

}



.traveler-reviews__title {

    font-size: 2.5rem;

    font-weight: 700;

    color: var(--color-gray-900, #212121);

    margin: 0 0 1rem 0;

    line-height: 1.2;

}



.traveler-reviews__subtitle {

    font-size: 1.125rem;

    color: var(--color-gray-600, #757575);

    margin: 0;

    line-height: 1.6;

}



@media (max-width: 768px) {

    .traveler-reviews__title {

        font-size: 1.75rem;

    }



    .traveler-reviews__subtitle {

        font-size: 1rem;

    }

}



/* ===== FILTERS ===== */



.traveler-reviews__filters {

    display: flex;

    justify-content: center;

    gap: 1rem;

    margin-bottom: 3rem;

    flex-wrap: wrap;

}



.traveler-reviews__filter-button {

    padding: 0.75rem 1.5rem;

    border: 2px solid var(--color-gray-300, #E0E0E0);

    background: white;

    border-radius: var(--border-radius-full, 50px);

    font-size: 0.9375rem;

    font-weight: 600;

    color: var(--color-gray-700, #616161);

    cursor: pointer;

    transition: all 0.3s ease;

}



.traveler-reviews__filter-button:hover {

    border-color: var(--wp--preset--color--secondary);

    color: var(--wp--preset--color--secondary);

}



.traveler-reviews__filter-button.active {

    background: var(--wp--preset--color--secondary);

    border-color: var(--wp--preset--color--secondary);

    color: white;

}



/* ===== GRID ===== */



.traveler-reviews__grid {

    display: grid;

    grid-template-columns: repeat(var(--grid-columns, 3), 1fr);

    gap: 2rem;

    margin-bottom: 3rem;

}



@media (max-width: 1024px) {

    .traveler-reviews__grid {

        grid-template-columns: repeat(2, 1fr);

    }

}



@media (max-width: 640px) {

    .traveler-reviews__grid {

        grid-template-columns: 1fr;

        gap: 1.5rem;

    }

}



/* ===== CARD ===== */



.traveler-reviews__card {

    background: white;

    border: 1px solid var(--color-gray-200, #EEEEEE);

    border-radius: var(--border-radius-lg, 8px);

    padding: 1.5rem;

    display: flex;

    flex-direction: column;

    gap: 1rem;

    transition: all 0.3s ease;

}



.traveler-reviews__card:hover {

    box-shadow: 0 8px 16px rgba(0, 0, 0, 0.1);

    transform: translateY(-4px);

}



.traveler-reviews__card.hidden {

    display: none;

}



/* ===== CARD HEADER (Avatar + Author Info) ===== */



.traveler-reviews__card-header {

    display: flex;

    align-items: flex-start;

    gap: 1rem;

}



.traveler-reviews__avatar {

    width: 48px;

    height: 48px;

    border-radius: 50%;

    background: var(--color-gray-100, #F5F5F5);

    display: flex;

    align-items: center;

    justify-content: center;

    flex-shrink: 0;

    overflow: hidden;

}



.traveler-reviews__avatar img {

    width: 100%;

    height: 100%;

    object-fit: cover;

}



.traveler-reviews__avatar svg {

    opacity: 0.6;

}



.traveler-reviews__author-info {

    display: flex;

    flex-direction: column;

    gap: 0.25rem;

    min-width: 0;

}



.traveler-reviews__author-name {

    font-size: 1rem;

    font-weight: 600;

    color: var(--color-gray-900, #212121);

}



.traveler-reviews__origin {

    display: flex;

    align-items: center;

    gap: 4px;

    font-size: 0.875rem;

    color: var(--color-gray-600, #757575);

}



.traveler-reviews__origin svg {

    flex-shrink: 0;

}



.traveler-reviews__traveler-type {

    font-size: 0.8125rem;

    color: var(--color-gray-500, #9E9E9E);

    font-style: italic;

}



/* ===== RATING ===== */



.traveler-reviews__rating {

    display: flex;

    align-items: center;

    gap: 4px;

}



.traveler-reviews__rating svg {

    flex-shrink: 0;

}



.traveler-reviews__date {

    margin-left: 0.5rem;

    font-size: 0.75rem;

    color: var(--color-gray-500, #9E9E9E);

}



/* ===== CONTENT ===== */



.traveler-reviews__content {

    font-size: 0.9375rem;

    line-height: 1.6;

    color: var(--color-gray-700, #616161);

    margin: 0;

    flex-grow: 1;

}



/* ===== PLATFORM BADGE ===== */



.traveler-reviews__platform {

    display: flex;

    align-items: center;

    margin-top: auto;

}



.traveler-reviews__platform-badge {

    display: inline-block;

    padding: 0.375rem 0.75rem;

    border-radius: var(--border-radius-sm, 4px);

    font-size: 0.75rem;

    font-weight: 600;

    text-transform: capitalize;

    letter-spacing: 0.05em;

}



.traveler-reviews__platform-badge--tripadvisor {

    background: #34E0A1;

    color: white;

}



.traveler-reviews__platform-badge--google {

    background: #4285F4;

    color: white;

}



.traveler-reviews__platform-badge--facebook {

    background: #1877F2;

    color: white;

}



/* ===== NO RESULTS ===== */



.traveler-reviews__no-results {

    text-align: center;

    padding: 3rem 2rem;

    color: var(--color-gray-600, #757575);

}



.traveler-reviews__no-results p {

    margin: 0;

    font-size: 1.125rem;

}



/* ===== PAGINATION ===== */



.traveler-reviews__pagination {

    display: flex;

    flex-direction: column;

    align-items: center;

    gap: 1rem;

}



.traveler-reviews__show-more {

    padding: 0.875rem 2.5rem;

    background: transparent;

    border: 2px solid var(--wp--preset--color--secondary);

    border-radius: var(--border-radius-md, 6px);

    color: var(--wp--preset--color--secondary);

    font-size: 1rem;

    font-weight: 600;

    cursor: pointer;

    transition: all 0.3s ease;

}



.traveler-reviews__show-more:hover {

    background: var(--wp--preset--color--secondary);

    color: white;

}



.traveler-reviews__show-more.hidden {

    display: none;

}



.traveler-reviews__showing {

    font-size: 0.875rem;

    color: var(--color-gray-600, #757575);

}



/* ===== PLACEHOLDER ===== */



.traveler-reviews-placeholder {

    padding: 3rem;

    text-align: center;

    background: var(--color-gray-50, #FAFAFA);

    border-radius: var(--border-radius-lg, 8px);

}



.traveler-reviews-placeholder p {

    margin: 0;

    color: var(--color-gray-600, #757575);

    font-size: 1rem;

}



/* ===== PRINT STYLES ===== */



@media print {

    .traveler-reviews__filters,

    .traveler-reviews__pagination {

        display: none;

    }



    .traveler-reviews__card {

        break-inside: avoid;

        page-break-inside: avoid;

    }



    .traveler-reviews__card.hidden {

        display: flex;

    }

}