/* Package hotel cards: split pricing and shared photo/layout overrides. */
.tg-mixed-hotels{direction:rtl;color:#25262b}
.tg-mixed-hotels>h5{font-size:1.25rem;font-weight:500;text-align:right}
.hotelPrice .card.tg-mixed-card{display:grid;grid-template-columns:184px minmax(0,1fr);grid-template-areas:"image heading" "image prices";column-gap:22px;row-gap:16px;padding:13px;border:1px solid #e9eaf0;border-radius:7px;margin:0 0 14px;box-shadow:none;align-items:start;background:#fff;direction:rtl}
.tg-mixed-gallery{grid-area:image;display:grid;gap:10px;height:100%;min-width:0}
.tg-mixed-gallery>a{display:block;min-width:0}
.tg-mixed-image{display:block;width:100%;height:184px;object-fit:cover;border-radius:6px}
.tg-mixed-heading{grid-area:heading;position:relative;padding-left:100px;min-width:0;min-height:55px}
.tg-mixed-hotel-heading{display:flex;flex-wrap:wrap;align-items:center;gap:7px 9px;justify-content:flex-start;margin:4px 0}
.tg-mixed-hotel-heading h6{font-size:15px;font-weight:600;line-height:1.5;margin:0;overflow-wrap:anywhere;max-width:100%}
.tg-mixed-meta{display:contents}
.tg-mixed-stars{color:#ffc500;font-family:Arial,sans-serif;font-size:21px;line-height:1;white-space:nowrap;letter-spacing:-1px}
.tg-mixed-nights{flex-basis:100%;font-size:11px;color:#9298a5;line-height:1.6}
.tg-mixed-service{position:absolute;left:0;top:1px;display:flex;direction:ltr;align-items:center;gap:7px;color:#343b80;font-size:11px;max-width:100px}
.tg-mixed-service small{direction:rtl}
.tg-service-code{display:inline-flex;align-items:center;justify-content:center;min-width:32px;min-height:28px;border-radius:18px;background:#f4f5f9;padding:3px 9px;font-size:12px;font-weight:600}
.tg-mixed-prices{grid-area:prices;display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:20px 12px;align-self:end;padding-bottom:3px;min-width:0}
.tg-mixed-price-item{text-align:right;min-width:0}
.tg-mixed-price-label{display:block;color:#9298a5;font-size:10px;font-weight:400;line-height:1.7;margin-bottom:5px;white-space:nowrap}
.tg-mixed-price{display:inline-flex;align-items:center;justify-content:center;gap:3px;max-width:100%;padding:3px 7px;min-height:24px;border-radius:20px;background:#f5f6fa;white-space:nowrap;line-height:1.6;font-size:12px}
.tg-mixed-price .tg-price-number{color:#00bc78;font-weight:600;direction:ltr;unicode-bidi:isolate}
.tg-mixed-price small{font-size:9px;color:#9298a5;font-weight:400}
.tg-price-plus{color:#353b45;font-size:11px}
.tg-mixed-unavailable{display:inline-block;padding:3px 8px;border-radius:20px;background:#f5f6fa;color:#757b89;font-size:12px;max-width:100%;overflow-wrap:anywhere}
@media(max-width:767px){
 .hotelPrice .card.tg-mixed-card{grid-template-columns:minmax(0,1fr);grid-template-areas:"image" "heading" "prices";gap:10px;padding:6px;margin-bottom:10px;border-radius:6px}
 .tg-mixed-gallery{gap:6px}
 .tg-mixed-image{height:auto;aspect-ratio:1.6;object-fit:cover;border-radius:5px}
 .tg-mixed-heading{padding:0;min-height:0}
 .tg-mixed-hotel-heading{display:block;margin:0 0 7px}
 .tg-mixed-hotel-heading h6{text-align:center;font-size:13px;margin-bottom:8px;line-height:1.6}
 .tg-mixed-meta{display:flex;align-items:center;gap:5px;min-height:26px;padding-left:85px}
 .tg-mixed-stars{font-size:20px;order:0}
 .tg-mixed-nights{flex-basis:auto;font-size:10px;order:1}
 .tg-mixed-service{top:auto;bottom:7px;font-size:10px;gap:5px;max-width:85px}
 .tg-service-code{min-width:27px;min-height:23px;padding:2px 6px;font-size:11px}
 .tg-mixed-prices{grid-template-columns:repeat(2,minmax(0,1fr));gap:13px 5px;padding:0 1px 2px}
 .tg-mixed-price-item:nth-child(5){grid-column:2}
 .tg-mixed-price-label{font-size:9px;margin-bottom:4px}
 .tg-mixed-price{gap:2px;padding:2px 5px;font-size:11px;min-height:21px}
 .tg-mixed-price small{font-size:8px}
 .tg-price-plus{font-size:10px}
}
@media(min-width:768px) and (max-width:1100px){
 .hotelPrice .card.tg-mixed-card{grid-template-columns:165px minmax(0,1fr);column-gap:15px}
 .tg-mixed-image{height:184px}
 .tg-mixed-prices{column-gap:5px}
 .tg-mixed-price{font-size:11px;gap:2px;padding-inline:5px}
}

.hotelPrice .card.tg-mixed-card.tg-no-hotel-images {
    grid-template-columns: minmax(0, 1fr);
    grid-template-areas: "heading" "prices";
}

/* Combined split-price offers follow the legacy two-column hotel card. */
.hotelPrice .card.tg-mixed-card.tg-mixed-combined-card {
    display: block;
    padding: 15px;
    border-color: rgba(0, 0, 0, .175);
    border-radius: 15px;
    margin-bottom: 20px;
}

.hotelPrice .tg-mixed-combined-card .tg-mixed-stays {
    display: flex;
    flex-direction: column;
    gap: 1rem;
}

.hotelPrice .tg-mixed-combined-card .tg-mixed-stay-photo > a {
    display: block;
    height: 100%;
}

.hotelPrice .tg-mixed-card.tg-mixed-combined-card .tg-mixed-stay .tg-mixed-image {
    width: 100%;
    height: 90px;
    min-height: 90px;
    aspect-ratio: auto;
    border-radius: 8px;
}

.hotelPrice .tg-mixed-combined-card .tg-mixed-stay-details {
    display: flex;
    flex-direction: column;
    justify-content: space-around;
    min-width: 0;
}

.hotelPrice .tg-mixed-combined-card .tg-mixed-stay-details h6 {
    margin: 0;
    font-size: 1rem;
    text-align: right;
    line-height: 1.7;
    overflow-wrap: anywhere;
}

.hotelPrice .tg-mixed-combined-card .tg-mixed-stay-title {
    display: flex;
    align-items: center;
    width: 100%;
}

.hotelPrice .tg-mixed-combined-card .tg-mixed-stay-meta {
    display: block;
    line-height: 1.5;
}

.hotelPrice .tg-mixed-combined-card .tg-mixed-stay-service {
    display: inline-block;
    background: aliceblue;
    color: #343c7b;
    border-radius: 20px;
    padding: 4px 12px;
    font-size: .8rem;
    line-height: 1;
}

.hotelPrice .tg-mixed-combined-card .tg-mixed-stay-location {
    display: flex;
    flex-wrap: wrap;
    gap: .3rem;
    color: #6c757d;
    font-size: 14px;
    margin-top: .3rem;
}

.hotelPrice .tg-mixed-combined-card .tg-mixed-price-column {
    container-type: inline-size;
}

.hotelPrice .tg-mixed-combined-card .tg-mixed-price-column .tg-mixed-prices {
    display: flex;
    flex-wrap: wrap;
    min-height: 195px;
    align-items: start;
    gap: 0;
    padding: 0;
}

.hotelPrice .tg-mixed-combined-card .tg-mixed-price-column .tg-mixed-price-item {
    flex: 0 0 50%;
    min-width: 0;
    padding: 0 0 3px 4px;
}

.hotelPrice .tg-mixed-combined-card .tg-mixed-price-column .tg-mixed-price-label {
    font-size: 13px;
    color: rgb(140, 146, 157);
    font-weight: 500;
    line-height: 1.5;
    white-space: normal;
}

.hotelPrice .tg-mixed-combined-card .tg-mixed-price-column .tg-mixed-price {
    display: inline-flex;
    flex-wrap: nowrap;
    justify-content: center;
    background: rgb(239, 246, 255);
    padding: 3px 4px;
    border-radius: 50px;
    min-width: 0;
    font-size: 11px;
    line-height: 1.2;
    gap: 1px;
    white-space: nowrap;
}

.hotelPrice .tg-mixed-combined-card .tg-mixed-price-column .tg-mixed-price > * {
    flex-shrink: 0;
}

.hotelPrice .tg-mixed-combined-card .tg-mixed-price-column .tg-price-number {
    white-space: nowrap;
}

.hotelPrice .tg-mixed-combined-card .tg-mixed-price-column .tg-mixed-price small {
    font-size: 9px;
}

@media (max-width: 991px) {
    .hotelPrice .tg-mixed-combined-card .tg-mixed-price-column .tg-mixed-prices {
        margin-top: 1rem;
    }
}

@media (max-width: 768px) {
    /* Match the reference: a 90px photo above each hotel's own information. */
    .hotelPrice .tg-mixed-combined-card .tg-mixed-stay-title {
        justify-content: center;
        margin-top: 1rem;
    }

    .hotelPrice .tg-mixed-combined-card .tg-mixed-stay-details h6 {
        text-align: center;
    }

    .hotelPrice .tg-mixed-combined-card .tg-mixed-stay-meta {
        display: flex;
        flex-wrap: wrap;
        align-items: center;
        justify-content: center;
        margin-top: 1rem;
    }

    .hotelPrice .tg-mixed-combined-card .tg-mixed-stay-location {
        display: block;
        margin-right: 1rem;
    }

    .hotelPrice .tg-mixed-combined-card .tg-mixed-price-column .tg-mixed-prices {
        padding: 0;
    }

    .hotelPrice .tg-mixed-combined-card .tg-mixed-price-column .tg-mixed-price-item {
        display: flex;
        flex-direction: column;
        align-items: center;
        padding: 0 2px 8px;
        text-align: center;
    }

    .hotelPrice .tg-mixed-combined-card .tg-mixed-price-column .tg-mixed-price-label {
        width: 100%;
        margin-right: 0;
        margin-left: 0;
        text-align: center;
    }

    .hotelPrice .tg-mixed-combined-card .tg-mixed-price-item:last-child:nth-child(odd) {
        flex-basis: 100%;
    }
}

/* Preserve textual availability messages with the reference price-chip styling. */
.hotelPrice .tg-mixed-combined-card .tg-mixed-unavailable {
    min-width: 7rem;
    max-width: 100%;
    padding: 5px 12px;
    border-radius: 50px;
    background: rgb(239, 246, 255);
    color: rgb(0, 184, 107);
    font-size: .9rem;
    text-align: center;
}

@media (max-width: 360px) {
    .hotelPrice .tg-mixed-combined-card .tg-mixed-price-column .tg-mixed-price,
    .hotelPrice .tg-mixed-combined-card .tg-mixed-price-column .tg-price-plus {
        font-size: 10px;
    }

    .hotelPrice .tg-mixed-combined-card .tg-mixed-price-column .tg-mixed-price small {
        font-size: 8px;
    }
}

/* Keep complete amounts readable when the desktop sidebar narrows the column. */
@container (max-width: 280px) {
    .hotelPrice .tg-mixed-combined-card .tg-mixed-price-column .tg-mixed-price,
    .hotelPrice .tg-mixed-combined-card .tg-mixed-price-column .tg-price-plus {
        font-size: 10px;
    }

    .hotelPrice .tg-mixed-combined-card .tg-mixed-price-column .tg-mixed-price small {
        font-size: 8px;
    }
}

@container (max-width: 260px) {
    .hotelPrice .tg-mixed-combined-card .tg-mixed-price-column .tg-mixed-price-item {
        flex-basis: 100%;
    }
}
