/*
 * Tappersia Public Styles
 * Cleaned for optimization.
 */

body .yab-wrapper, body [class*="yab-double-banner-wrapper-"] *, body .yab-promo-banner-wrapper *, body .yab-simple-banner-wrapper *, body .yab-sticky-simple-banner-wrapper *, body .yab-api-banner-wrapper *, body .yab-api-banner-placeholder *, body [class*="yab-tour-carousel-wrapper-"] *, body [class*="yab-hotel-carousel-wrapper-"] * {
    font-family: 'Roboto', sans-serif !important;
}

.yab-skeleton-loader { position: relative; overflow: hidden; background-color: #f0f0f0; }
.yab-skeleton-loader::before {
    content: ''; position: absolute; inset: 0; transform: translateX(-100%);
    background: linear-gradient(90deg, transparent, rgba(255, 255, 255, 0.6), transparent);
    animation: yab-shimmer 1.5s infinite;
}
@keyframes yab-shimmer { 100% { transform: translateX(100%); } }
@keyframes yab-fade-in { from { opacity: 0; } to { opacity: 1; } }

[class*="yab-tour-carousel-wrapper-"] .swiper-pagination-bullet,
[class*="yab-hotel-carousel-wrapper-"] .swiper-pagination-bullet {
    width: 20px !important; height: 6px !important; border-radius: 4px !important; opacity: 1 !important;
}
[class*="yab-tour-carousel-wrapper-"] .swiper-pagination-bullet-active,
[class*="yab-hotel-carousel-wrapper-"] .swiper-pagination-bullet-active {
    background-color: #00BAA4 !important;
}
[class*="yab-tour-carousel-wrapper-"] .swiper-button-disabled,
[class*="yab-hotel-carousel-wrapper-"] .swiper-button-disabled {
    opacity: 0.5 !important; cursor: auto !important; pointer-events: none !important;
}

.hotel-label-base { margin-top: 7px; width: fit-content; border-radius: 3px; padding: 2px 6px; font-size: 11px; line-height: 1; display: inline-block; box-sizing: border-box; }
.hotel-label-luxury { background: #333333; color: #fff; }
.hotel-label-business { background: #DAF6FF; color: #04A5D8; }
.hotel-label-boutique { background: #f8f3b0; color: #a8a350; }
.hotel-label-traditional { background: #FAECE0; color: #B68960; }
.hotel-label-economy { background: #FFE9F7; color: #FF48C3; }
.hotel-label-hostel { background: #B0B0B0; color: #FFF; }
.hotel-label-default { background: #e0e0e0; color: #555; }
.yab-hotel-card a:focus, .yab-hotel-card a:active { outline: none!important; }

.promo-banner { width: 100%; min-height: 150px; border-radius: 16px; display: flex; align-items: center; padding: 0 12px; position: relative; isolation: isolate; box-sizing: border-box;direction: ltr;text-align: left; }
.promo-banner__background { width: 100%; height: 100%; position: absolute; right: 0; z-index: 1; border-radius: 16px; top: 0; left: 0; }
.promo-banner__image-wrapper { width: 100%; height: 100%; position: absolute; right: 0; z-index: 2; border-radius: 16px; top: 0; left: 0; overflow: hidden; }
.promo-banner__image-wrapper img { object-fit: contain; }
.promo-banner__content { direction: ltr; display: flex; flex-direction: column; position: absolute; z-index: 3; margin-left: 16px;gap: 0px; }
.promo-banner__content_1 { line-height: normal; }
.promo-banner__content_2 { line-height: normal;}
.promo-banner__content_3 { line-height: normal; }

.ticket { width: 352px; height: 129px; position: relative; display: flex; z-index: 50; margin-left: auto; box-sizing: border-box; direction: rtl; overflow: hidden; background-color: transparent; }
.ticket__svg-shape-wrapper { position: absolute; top: 50%; left: 50%; transform: translate(-50%, -50%); z-index: 4; width: 352px; height: 129px; }
.ticket__svg-shape-img { width:100%; height:100%; object-fit: contain; }
.ticket__section { position: relative; z-index: 5; height: 100%; display: flex; flex-direction: column; justify-content: center; box-sizing: border-box; width: 50%; }
.ticket__section--actions { align-items: center; gap: 21px; }
.ticket__section--details { align-items: flex-end; }
.ticket__city { display: flex; flex-direction: row; align-items: center; gap: 8px; padding-left: 22px; width: 100%; box-sizing: border-box; }
.ticket__city-name { line-height: 19px; overflow-wrap: break-word; direction: ltr; padding-right: 20px; flex-grow: 1; text-align: left; }
.ticket__city-dot { width: 5px; height: 5px; border-radius: 50%; flex-shrink: 0; }
.ticket__city-dot--origin { background-color: #5191FA; }
.ticket__city-dot--destination { background-color: #FF48C3; }
.ticket__flight-path { display: flex; flex-direction: row; align-items: center; justify-content: center; gap: 6px; width: 100%; margin: 8px 0; }
.ticket__flight-arrow--bottom { transform: rotate(180deg); }
.ticket__price { display: flex; flex-direction: row-reverse; align-items: center; justify-content: center; gap: 7px; }
.ticket__price-icon { display: flex; justify-content: center; align-items: center; width: 20px; height: 20px; }
.ticket__price-label { display: flex; justify-content: center; align-items: center; font-weight: 400; font-size: 10px; line-height: 12px; color: #666666; }
.ticket__price-amount { display: flex; justify-content: center; align-items: center; font-weight: 700; font-size: 17px; line-height: 21px; }
.ticket__button { border-radius: 8px; padding: 10px 33px; cursor: pointer; }
.ticket__button-text { font-size: 13px; font-weight: 600; line-height: 16px; display: flex; justify-content: center; align-items: center; }
.ticket__flight-arrow--top{display: flex;align-items: flex-end;}
.ticket__flight-arrow--bottom{display: flex;align-items: flex-start;}

@media (max-width: 768px) {
    .yab-ft-mobile .ticket {
        width: 165px !important;
        height: 60px !important;
        gap: 0;
    }
    .yab-ft-mobile .ticket__svg-shape-wrapper {
        width: 165px !important;
        height: 60px !important;
    }
    .yab-ft-mobile .ticket__section--actions {
        align-items: center;
        gap: 5px;

    }
    .yab-ft-mobile .ticket__section--details {
        align-items: flex-end;
        padding-right: 5px;
    }
    .yab-ft-mobile .ticket__city {
        gap: 4px;
        padding-left: 10px;
    }
    .yab-ft-mobile .ticket__city-name {
        font-size: 8px !important;
        line-height: 1.2;
        padding-right: 10px;
    }
    .yab-ft-mobile .ticket__city-dot {
        width: 3px;
        height: 3px;
    }
    .yab-ft-mobile .ticket__flight-path {
        gap: 3px;
        margin: 4px 0;
    }
    .yab-ft-mobile .ticket__flight-path svg {
        width: 4px;
        height: 12px;
    }
    .yab-ft-mobile .ticket__price {
        gap: 3px;
    }
    .yab-ft-mobile .ticket__price-icon {
        width: 10px !important;
        height: 10px !important;
    }
    .yab-ft-mobile .ticket__price-icon svg {
        width: 10px;
        height: 10px;
    }
    .yab-ft-mobile .ticket__price-label {
        font-size: 5px !important;
        line-height: 1;
    }
    .yab-ft-mobile .ticket__price-amount {
        font-size: 8px !important;
        line-height: 1;
    }
    .yab-ft-mobile .ticket__button {
        padding: 4px 13px !important; 
        border-radius: 4px !important; 
    }
    .yab-ft-mobile .ticket__button-text {
        font-size: 8px !important;
        line-height: 1;
    }
    .promo-banner__content {
        margin-left: 7px;
    }
}

.yab-single-skeleton .yab-skeleton-content {
    display: flex;
    flex-direction: column;
    width: 100%;
    height: 100%;
    box-sizing: border-box;
}

.yab-single-skeleton .yab-skeleton-text-lg {
    width: 20%;
    height: 24px;
    background-color: #e0e0e0;
    border-radius: 4px;
    margin-bottom: 12px;
}

.yab-single-skeleton .yab-skeleton-text-md {
    width: 30%;
    height: 16px;
    background-color: #e0e0e0;
    border-radius: 4px;
    margin-bottom: 15px;
}

.yab-single-skeleton .yab-skeleton-button {
    width: 120px;
    height: 40px;
    background-color: #e0e0e0;
    border-radius: 8px;
}

@media (max-width: 768px) {
    .yab-skeleton-mobile .yab-skeleton-text-lg {
        height: 18px;
        width: 50%;
        margin-bottom: 10px;
    }
    .yab-skeleton-mobile .yab-skeleton-text-md {
        height: 14px;
        width: 70%;
        margin-bottom: 12px;
    }
    .yab-skeleton-mobile .yab-skeleton-button {
        height: 36px;
        width: 100px;
    }
}

.yab-double-skeleton .yab-skeleton-content {
    display: flex;
    flex-direction: column;
    width: 100%;
    box-sizing: border-box;
}

.yab-double-skeleton .yab-skeleton-text-lg {
    width: 40%;
    height: 22px;
    background-color: #e0e0e0;
    border-radius: 4px;
    margin-bottom: 12px;
}

.yab-double-skeleton .yab-skeleton-text-md {
    width: 60%;
    height: 16px;
    background-color: #e0e0e0;
    border-radius: 4px;
    margin-bottom: 15px;
}

.yab-double-skeleton .yab-skeleton-button {
    width: 120px;
    height: 40px;
    background-color: #e0e0e0;
    border-radius: 8px;
}

.right-ticket-promo{
    direction: rtl!important;
}
.right-ticket-promo .promo-banner__content {
    text-align: right!important;
    margin-left: 0!important;
    margin-right: 7px!important;
}
.right-ticket-promo .ticket {
        flex-direction: row-reverse!important;
}
.right-ticket-promo .ticket__city-name{
    text-align: right!important;
padding-right: 0!important;
padding-left: 20px!important;
}
.right-ticket-promo .ticket__city{
    flex-direction: row-reverse!important;
    padding-left: 0!important;
    padding-right: 22px!important;
}
.right-ticket-promo .ticket__price{
    flex-direction: row!important;
}
.yab-ft-mobile .right-ticket-promo  .ticket__city{
    padding-right: 5px!important;
}
.yab-ft-mobile .promo-banner__content{
    gap: 3px;
}