.gs-accommodations-archive {
padding-top: var(--space-xl);
}

.gs-accommodations-archive__content > .gs-container {
display: grid;
gap: var(--space-md);
}

.gs-accommodations-filters__eyebrow {
margin: 0;
color: var(--color-primario-anaranjado);
font-size: 11px;
font-weight: var(--font-bold);
letter-spacing: .16em;
text-transform: uppercase;
}

.gs-accommodations-archive__layout {
display: grid;
grid-template-columns: minmax(220px, 260px) minmax(0, 1fr);
gap: var(--space-md);
align-items: start;
}

.gs-accommodations-archive__sidebar {
position: sticky;
top: 24px;
}

.gs-accommodations-filters {
display: grid;
gap: 12px;
padding: 18px;
border: 1px solid rgba(78, 115, 185, .08);
border-radius: var(--radius-md);
background: rgba(255, 255, 255, .86);
box-shadow: 0 10px 28px rgba(78, 115, 185, .05);
}

.gs-accommodations-filters__header {
display: flex;
align-items: center;
justify-content: space-between;
gap: 10px;
padding-bottom: 4px;
}

.gs-accommodations-filters__clear {
color: var(--color-text-azul);
font-size: var(--text-sm);
font-weight: var(--font-semibold);
text-decoration: none;
}

.gs-accommodations-filters__group {
display: grid;
gap: 8px;
}

.gs-accommodations-filters__label {
color: var(--color-text-cafe);
font-size: 11px;
font-weight: var(--font-semibold);
letter-spacing: .14em;
text-transform: uppercase;
}

.gs-accommodations-filters__field {
position: relative;
}

.gs-accommodations-filters__field::after {
content: "";
position: absolute;
top: 50%;
right: 14px;
width: 12px;
height: 12px;
transform: translateY(-50%);
background: var(--color-text-cafe);
pointer-events: none;
-webkit-mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='m6 9 6 6 6-6'/%3E%3C/svg%3E") center / contain no-repeat;
mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='m6 9 6 6 6-6'/%3E%3C/svg%3E") center / contain no-repeat;
}

.gs-accommodations-filters select {
width: 100%;
height: 40px;
padding: 0 36px 0 14px;
border: 1px solid var(--color-borde-primario);
border-radius: var(--radius-sm);
background: var(--color-blanco);
color: var(--color-text-negro);
font-size: var(--text-sm);
font-weight: var(--font-medium);
appearance: none;
outline: none;
}

.gs-accommodations-filters__submit {
min-height: 42px;
border: 0;
border-radius: var(--radius-sm);
background: var(--color-primario);
color: var(--color-text-blanco);
font-size: var(--text-sm);
font-weight: var(--font-semibold);
cursor: pointer;
}

.gs-accommodations-toolbar {
display: flex;
align-items: center;
justify-content: space-between;
gap: var(--space-md);
margin-bottom: var(--space-md);
padding: 14px 18px;
border-radius: var(--radius-sm);
background: var(--color-blanco);
}

.gs-accommodations-toolbar__count {
margin: 0;
color: var(--color-text-cafe);
font-size: var(--text-sm);
}

.gs-accommodations-grid {
display: grid;
grid-template-columns: 1fr;
gap: var(--space-md);
}

.gs-accommodation-card {
position: relative;
display: grid;
grid-template-rows: auto 1fr;
overflow: hidden;
height: 100%;
border: 1px solid var(--color-borde-primario);
border-radius: var(--radius-sm);
background: var(--color-blanco);
box-shadow: 0 14px 30px rgba(78, 115, 185, .05);
transition: transform .25s ease, box-shadow .25s ease;
}

.gs-accommodation-card:hover {
transform: translateY(-3px);
box-shadow: 0 18px 38px rgba(78, 115, 185, .09);
}

.gs-accommodation-card__media {
position: relative;
display: block;
aspect-ratio: 1.6;
overflow: hidden;
background: linear-gradient(135deg, rgba(78, 115, 185, .16), rgba(0, 194, 105, .12));
}

.gs-accommodation-card__image,
.gs-accommodation-card__placeholder {
width: 100%;
height: 100%;
}

.gs-accommodation-card__image {
object-fit: cover;
transition: transform .35s ease;
}

.gs-accommodation-card:hover .gs-accommodation-card__image {
transform: scale(1.045);
}

.gs-accommodation-card__media::after {
content: "";
position: absolute;
inset: auto 0 0;
height: 58%;
background: linear-gradient(180deg, rgba(35, 31, 32, 0), rgba(35, 31, 32, .42));
pointer-events: none;
}

.gs-accommodation-card__media-overlay {
position: absolute;
right: 14px;
bottom: 14px;
left: 14px;
z-index: 1;
display: flex;
align-items: flex-end;
justify-content: space-between;
gap: 10px;
pointer-events: none;
}

.gs-accommodation-card__media-badge {
display: inline-flex;
align-items: center;
gap: 6px;
min-height: 32px;
padding: 0 11px;
border-radius: 999px;
background: rgba(255, 255, 255, .92);
color: var(--color-text-cafe);
font-size: 12px;
font-weight: var(--font-bold);
line-height: 1;
box-shadow: 0 10px 24px rgba(35, 31, 32, .18);
backdrop-filter: blur(10px);
}

.gs-accommodation-card__media-badge {
max-width: min(72%, 210px);
overflow: hidden;
text-overflow: ellipsis;
white-space: nowrap;
}

.gs-accommodation-card__media-badge-icon {
flex: 0 0 auto;
width: 15px;
height: 15px;
color: var(--color-text-cafe);
stroke-width: 2.4;
}

.gs-accommodation-card__like {
position: absolute;
top: 14px;
right: 14px;
z-index: 2;
display: inline-flex;
}

.gs-accommodation-card__like .gs-like-button {
min-height: 38px;
padding: 4px 12px;
box-shadow: 0 10px 22px rgba(35, 31, 32, .2);
}

.gs-accommodation-card__like .gs-like-count {
font-size: 12px;
}

.gs-accommodation-card__like .gs-like-icon {
width: 24px;
height: 24px;
}

.gs-accommodation-card__placeholder {
display: grid;
place-items: center;
color: var(--color-primario);
}

.gs-accommodation-card__placeholder-icon {
width: 42px;
height: 42px;
}

.gs-accommodation-card__body {
position: relative;
display: grid;
grid-template-rows: 1fr auto;
gap: 16px;
padding: 18px;
min-width: 0;
}

.gs-accommodation-card__main {
display: grid;
align-content: start;
gap: 9px;
min-width: 0;
}

.gs-accommodation-card__side {
display: grid;
grid-template-columns: minmax(0, 1fr) auto;
align-items: center;
gap: 0 14px;
min-width: 0;
text-align: left;
}

.gs-accommodation-card__amenities span {
display: inline-flex;
align-items: center;
gap: 6px;
min-height: 22px;
padding: 0;
color: var(--color-text-cafe);
font-size: 12px;
font-weight: var(--font-semibold);
white-space: nowrap;
}

.gs-accommodation-card__amenity-icon {
flex: 0 0 auto;
width: 15px;
height: 15px;
color: var(--color-text-cafe);
stroke-width: 2.25;
}

.gs-accommodation-card__title {
margin: 0;
}

.gs-accommodation-card.has-rating-summary .gs-accommodation-card__title {
padding-right: 116px;
}

.gs-accommodation-card__title a {
display: -webkit-box;
overflow: hidden;
color: var(--color-text-cafe);
font-size: var(--text-md);
font-weight: var(--font-bold);
line-height: 1.08;
text-decoration: none;
-webkit-box-orient: vertical;
-webkit-line-clamp: 2;
}

.gs-accommodation-card__rating-preview {
position: absolute;
top: 17px;
right: 18px;
display: grid;
justify-items: end;
gap: 3px;
max-width: 106px;
color: var(--color-text-cafe);
font-size: 12px;
font-weight: var(--font-semibold);
line-height: 1.1;
text-align: right;
}

.gs-accommodation-card__rating-score {
display: inline-flex;
align-items: center;
gap: 4px;
font-size: 13px;
font-weight: var(--font-bold);
line-height: 1.25;
}

.gs-accommodation-card__rating-icon {
width: 14px;
height: 14px;
color: var(--color-primario-anaranjado);
fill: currentColor;
stroke: currentColor;
stroke-width: 2.4;
}

.gs-accommodation-card__rating-text {
color: var(--color-text-azul);
font-size: 11px;
}

.gs-accommodation-card__distance {
    display: flex;
    align-items: center;
    gap: 6px;
    width: fit-content;
    border-radius: 100px;
    padding: 5px 15px;
    color: var(--color-text-azul);
    font-size: 10px;
    background: #f9f9f9;
    font-weight: var(--font-semibold);
    line-height: 1.25;
}

.gs-accommodation-card__distance-icon {
flex: 0 0 auto;
width: 14px;
height: 14px;
color: var(--color-primario);
stroke-width: 2.4;
}

.gs-accommodation-card__amenities {
display: flex;
    flex-wrap: wrap;
    border-radius: 10px;
    gap: 10px 15px;
    padding: 15px;
    background: #f9f9f9;
}

.gs-accommodation-card__amenities span {
gap: 5px;
}

.gs-accommodation-card__price-block {
display: grid;
grid-column: 1;
justify-items: start;
}

.gs-accommodation-card__price-block strong {
    display: flex;
    color: var(--color-text-azul);
    font-size: 20px;
    font-weight: var(--font-bold);
    line-height: 1.8;
    flex-direction: column;
    align-items: center;
}

.gs-accommodation-card__price-block strong span {
color: var(--color-text-cafe) !important;
font-size: 12px;
font-weight: var(--font-bold);
line-height: 1;
}

.gs-accommodation-card__link {
display: inline-flex;
grid-column: 2;
grid-row: 1 / span 2;
align-self: center;
justify-self: end;
align-items: center;
justify-content: center;
min-height: 38px;
padding: 0 16px;
border-radius: 999px;
background: var(--color-text-cafe);
color: var(--color-text-blanco);
font-size: var(--text-sm);
font-weight: var(--font-bold);
text-decoration: none;
white-space: nowrap;
}

.gs-accommodations-pagination {
display: flex;
justify-content: flex-end;
gap: 10px;
margin-top: var(--space-lg);
}

.gs-accommodations-pagination .page-numbers {
display: inline-flex;
align-items: center;
justify-content: center;
min-width: 40px;
height: 40px;
padding: 0 14px;
border: 1px solid var(--color-borde-primario);
border-radius: var(--radius-sm);
background: var(--color-blanco);
color: var(--color-text-cafe);
text-decoration: none;
}

.gs-accommodations-pagination .page-numbers.current {
border-color: var(--color-primario);
background: var(--color-primario);
color: var(--color-text-blanco);
}

.gs-accommodations-empty {
display: grid;
gap: var(--space-md);
justify-items: start;
padding: clamp(26px, 4vw, 40px);
border: 1px solid var(--color-borde-primario);
border-radius: var(--radius-lg);
background: rgba(255, 255, 255, .9);
}

.gs-accommodations-empty h2,
.gs-accommodations-empty p {
margin: 0;
}

@media (min-width: 1025px) {
.gs-accommodations-archive__content > .gs-container {
width: 94%;
max-width: none;
}
}

@media (min-width: 1280px) {
.gs-accommodations-grid {
grid-template-columns: repeat(auto-fill, minmax(300px, 1fr));
}
}

@media (max-width: 1024px) {
.gs-accommodations-archive__layout {
grid-template-columns: 1fr;
}

.gs-accommodations-archive__sidebar {
position: static;
}
}

@media (max-width: 768px) {
.gs-accommodations-archive {
padding-top: var(--space-lg);
}

.gs-accommodations-grid {
grid-template-columns: 1fr;
gap: 14px;
}

.gs-accommodation-card__body {
padding: 14px;
}

.gs-accommodation-card.has-rating-summary .gs-accommodation-card__title {
padding-right: 104px;
}

.gs-accommodation-card__rating-preview {
top: 14px;
right: 14px;
max-width: 96px;
}
}

@media (max-width: 1279px) and (min-width: 769px) {
.gs-accommodations-grid {
grid-template-columns: repeat(2, minmax(0, 1fr));
}
}

@media (max-width: 560px) {
.gs-accommodation-card__media-overlay {
right: 12px;
bottom: 12px;
left: 12px;
}

.gs-accommodation-card__media-badge {
max-width: 68%;
}

.gs-accommodation-card__side {
grid-template-columns: 1fr auto;
}
}
