/* Tour detail page only: rules whose colours / icon files differ from tour.css (the detail page still has the old purple accents). */


#main-content {
    margin: 0;
    line-height: inherit
}

#main-content .text-primary {
    --tw-text-opacity: 1;
    color: rgb(190 49 144/var(--tw-text-opacity))
}

#main-content i.icon[icon=d-icon-location-20px] {
    background-image: url("../images/tour/d-icon-location-20px.svg")
}

#main-content i.icon[icon=d-icon-phone] {
    background-image: url("../images/tour/d-icon-phone.svg")
}

#main-content i.icon[icon=d-icon-play-10px] {
    background-image: url("../images/tour/icons-n.svg")
}

@media screen and (max-width: 500px) {
    #main-content i.icon[icon=d-icon-play-10px] {
        background-image: url("../images/tour/icons-n.svg")
    }
}

#main-content {
    --tw-bg-opacity: 1;
    background-color: rgb(235 235 235/var(--tw-bg-opacity));
    font-family: IRANYekanXFaNum;
    --tw-text-opacity: 1;
    color: rgb(12 12 12/var(--tw-text-opacity))
}

#main-content .card.tour .content > a:after {
    background-image: url("../images/tour/icons-n.svg");
    background-size: 24px 24px;
    background-position: 50%;
    content: var(--tw-content);
    background-repeat: no-repeat;
    box-shadow: 0 0 20px #0003
}

#main-content .tourcard .labels .label:after {
    position: absolute;
    bottom: -8px;
    right: 0;
    height: .5rem;
    width: .5rem;
    --tw-rotate: 90deg;
    transform: translate(var(--tw-translate-x), var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y));
    background-image: linear-gradient(to top right, #842583 50%, #fff 0);
    --tw-content: "";
    content: var(--tw-content)
}
/* toast of the reserve modal (reserve.js) */
@keyframes slideUp { from { opacity: 0; transform: translateX(-50%) translateY(20px); } to { opacity: 1; transform: translateX(-50%) translateY(0); } }