/* Gold store V2 — one responsive shop surface for phone, tablet and desktop.
   The dialog is returned without the legacy paymentShopV3 classes, so the old
   frame/slider rules no longer participate in this window. */
@media screen {
    html.trav47GoldStoreOpen,
    html.trav47GoldStoreOpen body,
    body.trav47GoldStoreOpen {
        height: 100% !important;
        overflow: hidden !important;
        overscroll-behavior: none !important;
    }

    .dialog.trav47GoldStoreV2 {
        position: fixed !important;
        top: var(--trav47-gold-store-top, 90px) !important;
        right: 0 !important;
        bottom: var(--trav47-gold-store-bottom, 76px) !important;
        left: 0 !important;
        z-index: 1500 !important;
        display: block !important;
        width: 100vw !important;
        min-width: 0 !important;
        max-width: none !important;
        height: auto !important;
        min-height: 0 !important;
        max-height: none !important;
        margin: 0 !important;
        padding: 0 !important;
        overflow: hidden !important;
        border: 0 !important;
        border-radius: 0 !important;
        background: transparent !important;
        box-shadow: 0 -2px 8px rgba(31, 20, 10, .28) !important;
        transform: none !important;
        animation: none !important;
        box-sizing: border-box !important;
        pointer-events: auto !important;
    }

    .dialog.trav47GoldStoreV2 [class^="dialog-background"],
    .dialog.trav47GoldStoreV2 [class*=" dialog-background"],
    .dialog.trav47GoldStoreV2 .dialogDragBar,
    .dialog.trav47GoldStoreV2 .dialogCancelButton,
    .dialog.trav47GoldStoreV2 .iconButton.info,
    .dialog.trav47GoldStoreV2 form > .buttons,
    .dialog.trav47GoldStoreV2 .contentBorder-tl,
    .dialog.trav47GoldStoreV2 .contentBorder-tr,
    .dialog.trav47GoldStoreV2 .contentBorder-tc,
    .dialog.trav47GoldStoreV2 .contentBorder-ml,
    .dialog.trav47GoldStoreV2 .contentBorder-mr,
    .dialog.trav47GoldStoreV2 .contentBorder-mc,
    .dialog.trav47GoldStoreV2 .contentBorder-bl,
    .dialog.trav47GoldStoreV2 .contentBorder-br,
    .dialog.trav47GoldStoreV2 .contentBorder-bc,
    .dialog.trav47GoldStoreV2 .tabBtnBGPart,
    .dialog.trav47GoldStoreV2 .tabBtnImg,
    .dialog.trav47GoldStoreV2 .tabBorder,
    .dialog.trav47GoldStoreV2 .highlightArrow,
    .dialog.trav47GoldStoreV2 .dynamicContent {
        display: none !important;
    }

    .dialog.trav47GoldStoreV2 .dialog-container,
    .dialog.trav47GoldStoreV2 .dialogContainer,
    .dialog.trav47GoldStoreV2 .dialog-contents,
    .dialog.trav47GoldStoreV2 .dialogContents,
    .dialog.trav47GoldStoreV2 form,
    .dialog.trav47GoldStoreV2 #dialogContent {
        position: static !important;
        inset: auto !important;
        display: block !important;
        width: 100% !important;
        min-width: 0 !important;
        max-width: none !important;
        height: 100% !important;
        min-height: 0 !important;
        max-height: none !important;
        margin: 0 !important;
        padding: 0 !important;
        overflow: hidden !important;
        border: 0 !important;
        border-radius: 0 !important;
        background: transparent !important;
        box-shadow: inset 0 0 0 1px rgba(255, 230, 143, .28), 0 1px 2px rgba(50, 15, 4, .45) !important;
        transform: none !important;
        box-sizing: border-box !important;
    }

    .dialog.trav47GoldStoreV2 #paymentWizard.trav47GoldStorePanel {
        position: relative !important;
        display: flex !important;
        flex-direction: column !important;
        width: 100% !important;
        min-width: 0 !important;
        height: 100% !important;
        min-height: 0 !important;
        margin: 0 !important;
        padding: 0 !important;
        overflow: hidden !important;
        direction: rtl !important;
        color: #3d4939 !important;
        background: #f4f6ef !important;
        font-family: Tahoma, Arial, sans-serif !important;
        box-sizing: border-box !important;
    }

    .dialog.trav47GoldStoreV2 .trav47GoldStoreTopbar {
        position: relative !important;
        order: 1 !important;
        display: grid !important;
        grid-template-columns: 66px minmax(0, 1fr) 66px !important;
        align-items: center !important;
        flex: 0 0 38px !important;
        width: 100% !important;
        height: 38px !important;
        min-height: 38px !important;
        margin: 0 !important;
        padding: 0 5px !important;
        border: 1px solid #553c28 !important;
        border-right: 0 !important;
        border-left: 0 !important;
        color: #fff5dc !important;
        background: linear-gradient(to bottom, #6a4f38, #443025) !important;
        box-shadow: inset 0 1px 0 rgba(255,255,255,.3), inset 0 -1px 0 rgba(34,21,13,.55) !important;
        box-sizing: border-box !important;
    }

    .dialog.trav47GoldStoreV2 .trav47GoldStoreTopbar h2 {
        grid-column: 2 !important;
        min-width: 0 !important;
        margin: 0 !important;
        padding: 0 !important;
        overflow: hidden !important;
        color: #fff5dc !important;
        font: 700 14px/36px Tahoma, Arial, sans-serif !important;
        text-align: center !important;
        text-overflow: ellipsis !important;
        text-shadow: 0 1px 1px #2a1a10 !important;
        white-space: nowrap !important;
    }

    .dialog.trav47GoldStoreV2 .trav47PaymentClose {
        position: absolute !important;
        top: 6px !important;
        right: auto !important;
        left: 5px !important;
        z-index: 2 !important;
        grid-column: auto !important;
        grid-row: auto !important;
        justify-self: auto !important;
        display: inline-flex !important;
        align-items: center !important;
        justify-content: center !important;
        width: 25px !important;
        min-width: 25px !important;
        height: 25px !important;
        margin: 0 !important;
        padding: 0 0 2px !important;
        border: 1px solid #314917 !important;
        border-radius: 4px !important;
        color: #fff !important;
        background: linear-gradient(#85ad4b, #4e7824) !important;
        box-shadow: inset 0 1px 0 rgba(255,255,255,.42), 0 1px 2px rgba(24,16,9,.42) !important;
        font: 700 20px/22px Arial, sans-serif !important;
        text-align: center !important;
        text-shadow: 0 1px 1px #28400f !important;
        cursor: pointer !important;
        box-sizing: border-box !important;
        -webkit-tap-highlight-color: transparent !important;
    }

    .dialog.trav47GoldStoreV2 .trav47PaymentClose:active {
        transform: translateY(1px) scale(.95) !important;
        filter: brightness(.9) !important;
    }

    .dialog.trav47GoldStoreV2 .trav47GoldStoreBalance {
        position: absolute !important;
        top: 7px !important;
        right: auto !important;
        left: 36px !important;
        z-index: 1 !important;
        grid-column: auto !important;
        grid-row: auto !important;
        justify-self: auto !important;
        display: inline-flex !important;
        align-items: center !important;
        justify-content: flex-end !important;
        min-width: 0 !important;
        gap: 2px !important;
        color: #ffe69a !important;
        direction: ltr !important;
        font: 700 11px/24px Arial, sans-serif !important;
        font-variant-numeric: tabular-nums !important;
        white-space: nowrap !important;
    }

    .dialog.trav47GoldStoreV2 .trav47GoldStoreBalance img {
        flex: 0 0 15px !important;
        width: 15px !important;
        height: 15px !important;
        margin: 0 !important;
        object-fit: contain !important;
    }

    .dialog.trav47GoldStoreV2 #paymentWizard > .header {
        position: relative !important;
        top: auto !important;
        right: auto !important;
        bottom: auto !important;
        left: auto !important;
        z-index: 4 !important;
        order: 2 !important;
        flex: 0 0 38px !important;
        width: 100% !important;
        height: 38px !important;
        min-height: 38px !important;
        margin: 0 !important;
        padding: 0 !important;
        overflow: hidden !important;
        border: 0 !important;
        border-bottom: 1px solid #b8a47c !important;
        background: #eadfc8 !important;
        box-shadow: 0 2px 3px rgba(73,58,37,.14) !important;
        transform: none !important;
        box-sizing: border-box !important;
    }

    .dialog.trav47GoldStoreV2 #paymentWizard > .header > ul {
        display: flex !important;
        flex-direction: row !important;
        width: 100% !important;
        height: 100% !important;
        margin: 0 !important;
        padding: 0 !important;
        list-style: none !important;
        direction: rtl !important;
    }

    .dialog.trav47GoldStoreV2 #paymentWizard > .header li:not(.clear),
    .dialog.trav47GoldStoreV2 #paymentWizard > .header li.active {
        position: relative !important;
        display: block !important;
        flex: 1 1 0 !important;
        width: auto !important;
        min-width: 0 !important;
        height: 38px !important;
        min-height: 38px !important;
        margin: 0 !important;
        padding: 0 !important;
        border: 0 !important;
        background: none !important;
        transform: none !important;
        box-sizing: border-box !important;
    }

    .dialog.trav47GoldStoreV2 #paymentWizard > .header li.clear {
        display: none !important;
    }

    .dialog.trav47GoldStoreV2 #paymentWizard > .header .tabButton,
    .dialog.trav47GoldStoreV2 #paymentWizard > .header li.active .tabButton {
        position: static !important;
        display: flex !important;
        align-items: center !important;
        justify-content: center !important;
        width: 100% !important;
        min-width: 0 !important;
        height: 38px !important;
        margin: 0 !important;
        padding: 0 3px !important;
        overflow: hidden !important;
        border: 0 !important;
        border-left: 1px solid rgba(142,119,78,.32) !important;
        border-radius: 0 !important;
        color: #27231d !important;
        background: linear-gradient(to bottom, #f7efdf, #e2d2b2) !important;
        box-shadow: inset 0 1px 0 rgba(255,255,255,.72) !important;
        font: 700 11px/36px Tahoma, Arial, sans-serif !important;
        text-decoration: none !important;
        text-shadow: 0 1px 0 rgba(255,255,255,.65) !important;
        transform: none !important;
        cursor: pointer !important;
        box-sizing: border-box !important;
        -webkit-appearance: none !important;
        appearance: none !important;
        -webkit-tap-highlight-color: transparent !important;
        pointer-events: auto !important;
    }

    .dialog.trav47GoldStoreV2 #paymentWizard > .header li:last-of-type .tabButton {
        border-left: 0 !important;
    }

    .dialog.trav47GoldStoreV2 #paymentWizard > .header li.active .tabButton {
        color: #fff !important;
        background: linear-gradient(to bottom, #8fbd45, #5d8c27) !important;
        box-shadow: inset 0 2px 0 rgba(255,255,255,.25), inset 0 -2px 0 #3d6719 !important;
        text-shadow: 0 1px 1px #365716 !important;
    }

    .dialog.trav47GoldStoreV2 #paymentWizard > .header .tabButton.paymentFeatures,
    .dialog.trav47GoldStoreV2 #paymentWizard > .header li.active .tabButton.paymentFeatures {
        color: #f2f2f2 !important;
        border-color: #200532 !important;
        background-color: #ad73c5 !important;
        background-image: linear-gradient(180deg, #ad73c5, #805d8f) !important;
        box-shadow: inset -2px 0 1px -1px #88579d,
                    inset 3px 0 1px -1px #87569b,
                    inset 0 3px 1px -1px #d68ef6,
                    inset 0 -3px 1px -1px rgba(66, 29, 83, .6) !important;
        text-shadow: -1px 1px 1px rgba(0, 0, 0, .5) !important;
    }

    .dialog.trav47GoldStoreV2 #paymentWizard > .header .tabButton .text {
        position: static !important;
        display: block !important;
        min-width: 0 !important;
        width: auto !important;
        margin: 0 !important;
        padding: 0 !important;
        overflow: hidden !important;
        color: inherit !important;
        font: inherit !important;
        line-height: inherit !important;
        text-overflow: ellipsis !important;
        white-space: nowrap !important;
    }

    .dialog.trav47GoldStoreV2 .trav47PaymentTabIcon {
        color: #ffd66c !important;
        font-size: 10px !important;
    }

    .dialog.trav47GoldStoreV2 #paymentWizard > .contentWrapper {
        position: relative !important;
        order: 4 !important;
        display: block !important;
        flex: 1 1 auto !important;
        width: 100% !important;
        min-width: 0 !important;
        height: auto !important;
        min-height: 0 !important;
        max-height: none !important;
        margin: 0 !important;
        padding: 6px !important;
        overflow-x: hidden !important;
        overflow-y: auto !important;
        overscroll-behavior: contain !important;
        scrollbar-width: none !important;
        background:
            linear-gradient(rgba(255,255,255,.72), rgba(255,255,255,.72)),
            repeating-linear-gradient(135deg, #eef2e9 0 8px, #e7ece2 8px 16px) !important;
        -webkit-overflow-scrolling: touch !important;
        touch-action: pan-y !important;
        box-sizing: border-box !important;
    }

    .dialog.trav47GoldStoreV2 #paymentWizard > .trav47GoldStoreInsufficientNotice {
        position: relative !important;
        order: 3 !important;
        flex: 0 0 auto !important;
        display: flex !important;
        align-items: center !important;
        justify-content: center !important;
        width: 100% !important;
        min-height: 28px !important;
        margin: 0 !important;
        padding: 4px 8px !important;
        border: 0 !important;
        border-bottom: 1px solid #d8a8a0 !important;
        color: #a02d22 !important;
        background: #fff2ee !important;
        font: 700 11px/19px Tahoma, Arial, sans-serif !important;
        text-align: center !important;
        box-sizing: border-box !important;
        animation: trav47GoldStoreNoticeIn .18s ease-out !important;
    }

    .dialog.trav47GoldStoreV2 #paymentWizard > .contentWrapper::-webkit-scrollbar,
    .dialog.trav47GoldStoreV2 .paymentWizardMenu::-webkit-scrollbar {
        display: none !important;
        width: 0 !important;
        height: 0 !important;
    }

    .dialog.trav47GoldStoreV2 .contentBorder,
    .dialog.trav47GoldStoreV2 .contentArea,
    .dialog.trav47GoldStoreV2 .infoArea,
    .dialog.trav47GoldStoreV2 .contentBorder-contents,
    .dialog.trav47GoldStoreV2 .paymentPopupDialogWrapper,
    .dialog.trav47GoldStoreV2 .featureCollection {
        position: static !important;
        float: none !important;
        width: 100% !important;
        min-width: 0 !important;
        max-width: none !important;
        height: auto !important;
        min-height: 0 !important;
        max-height: none !important;
        margin: 0 !important;
        padding: 0 !important;
        overflow: visible !important;
        border: 0 !important;
        border-radius: 0 !important;
        background: transparent !important;
        box-shadow: none !important;
        transform: none !important;
        box-sizing: border-box !important;
    }

    /* Buy gold */
    .dialog.trav47GoldStoreV2 #paymentWizard.buyGold > .contentWrapper {
        display: flex !important;
        flex-direction: column !important;
        padding: 0 !important;
        overflow-x: hidden !important;
        overflow-y: auto !important;
        border-top: 1px solid rgba(255,255,255,.72) !important;
        background: #e7ddcb !important;
        box-shadow: none !important;
        touch-action: pan-y !important;
    }

    .dialog.trav47GoldStoreV2 #paymentWizard.buyGold .trav47GoldStoreGoldArea {
        --trav47-gold-phone-card: min(130px, calc((100vw - 24px) / 3));
        position: relative !important;
        display: block !important;
        flex: 0 0 auto !important;
        width: 100% !important;
        height: auto !important;
        min-height: 0 !important;
        margin: 0 auto !important;
        padding: 3px 3px 7px !important;
        overflow: visible !important;
        border: 1px solid #34220d !important;
        border-radius: 4px !important;
        background: linear-gradient(to bottom, #cba467 5%, #f3e2ae 13%, #efbf7b 32%, #aa8050 48%, #835e35 72%, #ad8a54 93%, #d7b672 100%) !important;
        box-sizing: border-box !important;
    }

    .dialog.trav47GoldStoreV2 #paymentWizard.buyGold .trav47GoldStoreGoldArea::before {
        content: "" !important;
        position: absolute !important;
        inset: 2px !important;
        z-index: 0 !important;
        border: 1px solid #44321d !important;
        border-radius: 1px !important;
        background: #dfe9df url("../../images/shop/boxBackground.png") center / 100% 100% no-repeat !important;
        pointer-events: none !important;
    }

    .dialog.trav47GoldStoreV2 .trav47GoldOfferStrip {
        position: absolute !important;
        top: 7px !important;
        right: 50% !important;
        z-index: 4 !important;
        flex: 0 0 20px !important;
        gap: 4px !important;
        width: auto !important;
        min-width: min(260px, calc(100% - 18px)) !important;
        height: 20px !important;
        min-height: 20px !important;
        margin: 0 !important;
        padding: 0 5px !important;
        border-radius: 4px !important;
        font: 700 8.5px/18px Tahoma, Arial, sans-serif !important;
        transform: translateX(50%) !important;
    }

    .dialog.trav47GoldStoreV2 .trav47GoldStorePackageGrid {
        position: relative !important;
        z-index: 1 !important;
        display: grid !important;
        grid-template-columns: repeat(3, var(--trav47-gold-phone-card)) !important;
        grid-template-rows: repeat(2, auto) !important;
        align-content: start !important;
        align-items: start !important;
        justify-content: space-between !important;
        flex: 0 0 auto !important;
        column-gap: 2px !important;
        row-gap: clamp(23px, 7vw, 30px) !important;
        width: calc(100% - 8px) !important;
        height: auto !important;
        min-height: 0 !important;
        margin: 0 auto !important;
        padding: 35px 0 2px !important;
        overflow: visible !important;
        box-sizing: border-box !important;
        direction: rtl !important;
    }

    .dialog.trav47GoldStoreV2 .trav47GoldStorePackage {
        position: relative !important;
        display: block !important;
        grid-column: auto !important;
        width: var(--trav47-gold-phone-card) !important;
        min-width: 0 !important;
        max-width: 130px !important;
        height: auto !important;
        min-height: 0 !important;
        max-height: none !important;
        aspect-ratio: 1 / 2 !important;
        margin: 0 auto !important;
        padding: 0 !important;
        gap: 0 !important;
        overflow: visible !important;
        border: 1px solid #34220d !important;
        border-radius: 4px !important;
        color: #e3d8c4 !important;
        background: linear-gradient(to bottom, #05393b, #196e70 50%, #196e70) !important;
        box-shadow: inset 0 0 1px 2px #118188 !important;
        text-align: center !important;
        text-decoration: none !important;
        box-sizing: border-box !important;
        -webkit-tap-highlight-color: transparent !important;
        isolation: auto !important;
    }

    .dialog.trav47GoldStoreV2 .trav47BestSellerBadge {
        position: absolute !important;
        top: 5px !important;
        right: 6px !important;
        left: auto !important;
        z-index: 4 !important;
        display: flex !important;
        align-items: center !important;
        justify-content: center !important;
        width: calc(100% - 12px) !important;
        min-width: 0 !important;
        height: 25px !important;
        min-height: 0 !important;
        padding: 0 5px !important;
        border: 2px solid #f4c24f !important;
        border-radius: 2px !important;
        color: #fff1b6 !important;
        background: linear-gradient(180deg, #bd2018 0%, #8b0d0b 100%) !important;
        box-shadow: inset 0 0 0 1px rgba(255, 230, 143, .28), 0 1px 2px rgba(50, 15, 4, .45) !important;
        font: 700 clamp(8px, 2.5vw, 10px)/1.2 Tahoma, Arial, sans-serif !important;
        text-align: center !important;
        text-shadow: 1px 0 1px #572121, 0 1px 1px #572121, -1px 0 1px #572121, 0 -1px 1px #572121 !important;
        white-space: normal !important;
        box-sizing: border-box !important;
        transform: none !important;
        clip-path: none !important;
    }

    .dialog.trav47GoldStoreV2 .trav47BestValueBadge {
        position: absolute !important;
        top: clamp(-30px, -7vw, -22px) !important;
        right: 4px !important;
        z-index: 4 !important;
        display: flex !important;
        align-items: center !important;
        justify-content: center !important;
        width: calc(100% - 8px) !important;
        height: clamp(48px, 15vw, 64px) !important;
        padding: 0 5px clamp(10px, 3.3vw, 14px) !important;
        color: #e8f2b4 !important;
        background: url("../../images/shop/bestValue.png") center / 100% 100% no-repeat !important;
        font: 700 clamp(8px, 2.5vw, 10px)/1.2 Tahoma, Arial, sans-serif !important;
        text-align: center !important;
        text-shadow: 1px 0 1px #254014, 0 1px 1px #254014, -1px 0 1px #254014, 0 -1px 1px #254014 !important;
        white-space: normal !important;
        box-sizing: border-box !important;
    }

    .dialog.trav47GoldStoreV2 .trav47GoldOfferBadge {
        top: 100% !important;
        right: auto !important;
        left: -3px !important;
        min-width: 38px !important;
        min-height: 14px !important;
        padding: 0 8px 0 3px !important;
        border-radius: 0 2px 2px 0 !important;
        font: 800 8px/11px Tahoma, Arial, sans-serif !important;
        transform: none !important;
        clip-path: polygon(0 0, calc(100% - 6px) 0, 100% 50%, calc(100% - 6px) 100%, 0 100%) !important;
    }

    .dialog.trav47GoldStoreV2 .trav47GoldStorePackage:is(.trav47BestSellerPackage, .trav47BestValuePackage) {
        background: linear-gradient(to bottom, #8b460b, #b58b2d 50%, #b58b2d) !important;
        box-shadow: inset 0 0 1px 2px #e8b723 !important;
        animation: none !important;
    }

    .dialog.trav47GoldStoreV2 .trav47GoldStorePackage.trav47BestSellerPackage {
        border: 2px solid #ffd15a !important;
    }

    .dialog.trav47GoldStoreV2 .trav47GoldStorePackageGlow {
        display: none !important;
    }

    .dialog.trav47GoldStoreV2 .trav47GoldStorePackageName {
        display: none !important;
    }

    .dialog.trav47GoldStoreV2 .trav47GoldStorePackageMeta {
        position: absolute !important;
        right: 50% !important;
        bottom: 73% !important;
        z-index: 3 !important;
        display: inline-flex !important;
        align-items: center !important;
        justify-content: center !important;
        gap: 3px !important;
        direction: ltr !important;
        width: auto !important;
        height: 12.5% !important;
        min-height: 0 !important;
        margin: 0 !important;
        padding: 0 !important;
        color: #e3d8c4 !important;
        font: 700 clamp(18px, 5.8vw, 25px)/1 Arial, Helvetica, Verdana, sans-serif !important;
        text-shadow: 1px 0 1px #190000, 0 1px 1px #190000, -1px 0 1px #190000, 0 -1px 1px #190000 !important;
        white-space: nowrap !important;
        box-sizing: border-box !important;
        transform: translateX(50%) !important;
    }

    .dialog.trav47GoldStoreV2 .trav47GoldStorePackageAmount {
        color: #e3d8c4 !important;
        font: inherit !important;
    }

    .dialog.trav47GoldStoreV2 .trav47GoldStorePackageGoldIcon {
        width: clamp(22px, 7vw, 30px) !important;
        height: clamp(22px, 7vw, 30px) !important;
        margin: 0 !important;
        object-fit: contain !important;
    }

    .dialog.trav47GoldStoreV2 .trav47GoldStorePackageImage {
        position: absolute !important;
        right: 0 !important;
        bottom: 8.85% !important;
        left: 0 !important;
        z-index: 2 !important;
        display: flex !important;
        align-items: center !important;
        justify-content: center !important;
        width: 100% !important;
        height: 59.25% !important;
        margin: 0 !important;
        padding: 6.5% 0 !important;
        overflow: visible !important;
        border: 0 !important;
        border-radius: 0 !important;
        background: url("../../images/shop/glare.png") center / 129% 100% no-repeat !important;
        box-sizing: border-box !important;
    }

    .dialog.trav47GoldStoreV2 .trav47GoldStorePackageImage img {
        display: block !important;
        width: 92% !important;
        max-width: 120px !important;
        height: auto !important;
        max-height: 100% !important;
        margin: 0 auto !important;
        object-fit: contain !important;
        filter: none !important;
        pointer-events: none !important;
    }

    .dialog.trav47GoldStoreV2 .trav47GoldStorePackagePrice {
        position: absolute !important;
        top: auto !important;
        right: 4% !important;
        bottom: 2% !important;
        left: 4% !important;
        z-index: 3 !important;
        display: inline-flex !important;
        align-items: center !important;
        justify-content: center !important;
        width: auto !important;
        height: 13% !important;
        margin: 0 !important;
        padding: 3.5% 0 0 !important;
        gap: 2px !important;
        direction: ltr !important;
        border-radius: 0 0 1px 1px !important;
        color: #e3d8c4 !important;
        background: #0f4344 !important;
        font: 700 clamp(11px, 3.6vw, 15px)/1 Arial, Helvetica, Verdana, sans-serif !important;
        text-shadow: 1px 0 1px #190000, 0 1px 1px #190000, -1px 0 1px #190000, 0 -1px 1px #190000 !important;
        white-space: nowrap !important;
        box-sizing: border-box !important;
    }

    .dialog.trav47GoldStoreV2 .trav47GoldStorePackagePriceCurrency {
        color: inherit !important;
        font-family: Arial, sans-serif !important;
        font-weight: 800 !important;
    }

    .dialog.trav47GoldStoreV2 .trav47GoldStorePackage:is(.trav47BestSellerPackage, .trav47BestValuePackage) .trav47GoldStorePackageImage {
        background-image: url("../../images/shop/glareHighlight.png") !important;
    }

    .dialog.trav47GoldStoreV2 .trav47GoldStorePackage.trav47BestSellerPackage .trav47GoldStorePackageImage {
        background-image: none !important;
    }

    .dialog.trav47GoldStoreV2 .trav47GoldStorePackage:is(.trav47BestSellerPackage, .trav47BestValuePackage) .trav47GoldStorePackagePrice {
        background: #6d531b !important;
    }

    .dialog.trav47GoldStoreV2 .trav47GoldStorePackage:active {
        transform: translateY(1px) !important;
        filter: brightness(.97) !important;
    }

    /* Premium benefits: the only phone layout owner for this tab. */
    .dialog.trav47GoldStoreV2 #paymentWizard.pros > .contentWrapper {
        padding: 0 !important;
        overflow-x: hidden !important;
        overflow-y: auto !important;
        border: 0 !important;
        background: #dfe9df url("../../images/shop/boxBackground.png") center / 100% 100% no-repeat !important;
        box-shadow: none !important;
    }

    .dialog.trav47GoldStoreV2 #paymentWizard.pros .infoArea,
    .dialog.trav47GoldStoreV2 #paymentWizard.pros .subHeadline,
    .dialog.trav47GoldStoreV2 #paymentWizard.pros .dynamicContent,
    .dialog.trav47GoldStoreV2 #paymentWizard.pros .highlightArrow {
        display: none !important;
    }

    .dialog.trav47GoldStoreV2 #paymentWizard.pros .featureCollection {
        display: grid !important;
        grid-template-columns: minmax(0, 1fr) !important;
        gap: 4px !important;
        width: calc(100% - 8px) !important;
        margin: 4px auto !important;
        padding: 0 2px !important;
        box-sizing: border-box !important;
    }

    .dialog.trav47GoldStoreV2 #paymentWizard.pros .featureCollection > .feature {
        position: relative !important;
        float: none !important;
        display: block !important;
        width: 100% !important;
        min-width: 0 !important;
        height: 64px !important;
        min-height: 64px !important;
        max-height: 64px !important;
        margin: 0 !important;
        padding: 0 !important;
        overflow: hidden !important;
        border: 1px solid #34220d !important;
        border-radius: 4px !important;
        color: #f8edc0 !important;
        background: linear-gradient(
            to bottom,
            var(--trav47-pros-tone-a),
            var(--trav47-pros-tone-b) 50%,
            var(--trav47-pros-tone-b)
        ) !important;
        box-shadow:
            inset 0 0 1px 2px var(--trav47-pros-inner),
            0 2px 5px rgba(38,35,27,.22) !important;
        box-sizing: border-box !important;
        isolation: auto !important;
    }

    .dialog.trav47GoldStoreV2 #paymentWizard.pros .featureCollection > .feature::before,
    .dialog.trav47GoldStoreV2 #paymentWizard.pros .featureCollection > .feature::after {
        content: none !important;
        display: none !important;
        background: none !important;
        box-shadow: none !important;
    }

    .dialog.trav47GoldStoreV2 #paymentWizard.pros .featureCollection > .feature:nth-child(1) {
        --trav47-pros-tone-a: #8b460b;
        --trav47-pros-tone-b: #b58b2d;
        --trav47-pros-inner: #e8b723;
    }

    .dialog.trav47GoldStoreV2 #paymentWizard.pros .featureCollection > .feature:nth-child(2) {
        --trav47-pros-tone-a: #05393b;
        --trav47-pros-tone-b: #196e70;
        --trav47-pros-inner: #118188;
    }

    .dialog.trav47GoldStoreV2 #paymentWizard.pros .featureCollection > .feature:nth-child(3) {
        --trav47-pros-tone-a: #245c38;
        --trav47-pros-tone-b: #4b8c50;
        --trav47-pros-inner: #73af69;
    }

    .dialog.trav47GoldStoreV2 #paymentWizard.pros .featureCollection > .feature:nth-child(4) {
        --trav47-pros-tone-a: #7a3d24;
        --trav47-pros-tone-b: #b86e45;
        --trav47-pros-inner: #d59a70;
    }

    .dialog.trav47GoldStoreV2 #paymentWizard.pros .featureCollection > .feature:nth-child(5) {
        --trav47-pros-tone-a: #334d61;
        --trav47-pros-tone-b: #69889c;
        --trav47-pros-inner: #8eb0c0;
    }

    .dialog.trav47GoldStoreV2 #paymentWizard.pros .featureCollection > .feature:nth-child(6) {
        --trav47-pros-tone-a: #6e5b1c;
        --trav47-pros-tone-b: #a98a2d;
        --trav47-pros-inner: #d5b95d;
    }

    .dialog.trav47GoldStoreV2 #paymentWizard.pros .featureContent {
        position: relative !important;
        float: none !important;
        display: grid !important;
        grid-template-columns: minmax(0, .9fr) minmax(100px, 1.1fr) 72px !important;
        grid-template-rows: 28px 26px !important;
        grid-template-areas:
            "title title button"
            "duration state button" !important;
        align-items: center !important;
        column-gap: 4px !important;
        width: 100% !important;
        min-width: 0 !important;
        height: 62px !important;
        min-height: 62px !important;
        max-height: 62px !important;
        margin: 0 !important;
        padding: 4px 59px 4px 4px !important;
        overflow: hidden !important;
        border: 0 !important;
        background: transparent !important;
        box-sizing: border-box !important;
    }

    .dialog.trav47GoldStoreV2 #paymentWizard.pros .featureContent::before {
        position: absolute !important;
        z-index: 2 !important;
        top: 7px !important;
        right: 11px !important;
        left: auto !important;
        width: 48px !important;
        height: 48px !important;
        margin: 0 !important;
        content: "" !important;
        background-position: center !important;
        background-size: contain !important;
        background-repeat: no-repeat !important;
        filter: drop-shadow(0 1px 1px rgba(32,25,9,.45)) !important;
        transform: none !important;
        pointer-events: none !important;
    }

    .dialog.trav47GoldStoreV2 #paymentWizard.pros .feature:nth-child(1) .featureContent::before { background-image: url("../../images/goldClub.png") !important; }
    .dialog.trav47GoldStoreV2 #paymentWizard.pros .feature:nth-child(2) .featureContent::before { background-image: url("../../images/travianPlus.png") !important; }
    .dialog.trav47GoldStoreV2 #paymentWizard.pros .feature:nth-child(3) .featureContent::before { background-image: url("../../images/lumber.png") !important; }
    .dialog.trav47GoldStoreV2 #paymentWizard.pros .feature:nth-child(4) .featureContent::before { background-image: url("../../images/clay.png") !important; }
    .dialog.trav47GoldStoreV2 #paymentWizard.pros .feature:nth-child(5) .featureContent::before { background-image: url("../../images/iron.png") !important; }
    .dialog.trav47GoldStoreV2 #paymentWizard.pros .feature:nth-child(6) .featureContent::before { background-image: url("../../images/crop.png") !important; }

    .dialog.trav47GoldStoreV2 #paymentWizard.pros .featureTitle {
        grid-area: title !important;
        align-self: center !important;
        min-width: 0 !important;
        margin: 0 !important;
        padding: 0 !important;
        overflow: hidden !important;
        color: #fffdf4 !important;
        font: 700 11px/20px Tahoma, Arial, sans-serif !important;
        text-align: right !important;
        text-shadow: 0 1px 2px rgba(20,15,4,.96) !important;
        -webkit-text-fill-color: #fffdf4 !important;
        text-overflow: clip !important;
        white-space: nowrap !important;
    }

    .dialog.trav47GoldStoreV2 #paymentWizard.pros .featureTitle::after {
        content: none !important;
        display: none !important;
    }

    .dialog.trav47GoldStoreV2 #paymentWizard.pros .featureContent:not(:has(.featureRemainingTime)) .featureTitle {
        grid-column: 1 / 3 !important;
    }

    .dialog.trav47GoldStoreV2 #paymentWizard.pros .featureContent:not(:has(.featureRemainingTime)) .featureDuration,
    .dialog.trav47GoldStoreV2 #paymentWizard.pros .featureContent:not(:has(.featureRemainingTime)) .featureRenewal {
        grid-column: 1 / 3 !important;
    }

    .dialog.trav47GoldStoreV2 #paymentWizard.pros .featureRemainingTime {
        position: static !important;
        top: auto !important;
        right: auto !important;
        bottom: auto !important;
        left: auto !important;
        grid-area: state !important;
        justify-self: center !important;
        min-width: 0 !important;
        margin: 0 !important;
        padding: 0 5px !important;
        overflow: hidden !important;
        border: 1px solid rgba(255,255,255,.24) !important;
        border-radius: 3px !important;
        background: rgba(21,52,18,.56) !important;
        color: #75df58 !important;
        font: 700 9px/18px Tahoma, Arial, sans-serif !important;
        text-align: right !important;
        text-shadow: 0 1px 2px rgba(17,31,8,.92) !important;
        text-overflow: clip !important;
        white-space: nowrap !important;
        box-shadow: inset 0 1px 0 rgba(255,255,255,.08), 0 1px 2px rgba(12,18,7,.34) !important;
        box-sizing: border-box !important;
    }

    .dialog.trav47GoldStoreV2 #paymentWizard.pros .featureDuration,
    .dialog.trav47GoldStoreV2 #paymentWizard.pros .featureRenewal {
        position: static !important;
        top: auto !important;
        right: auto !important;
        bottom: auto !important;
        left: auto !important;
        grid-area: duration !important;
        align-self: center !important;
        min-width: 0 !important;
        width: 100% !important;
        margin: 0 !important;
        padding: 0 10px 0 0 !important;
        overflow: hidden !important;
        transform: none !important;
        box-sizing: border-box !important;
        color: #fffdf4 !important;
        font: 400 9px/18px Tahoma, Arial, sans-serif !important;
        text-align: right !important;
        text-shadow: 0 1px 2px rgba(20,15,4,.94) !important;
        -webkit-text-fill-color: #fffdf4 !important;
        text-overflow: ellipsis !important;
        white-space: nowrap !important;
    }

    .dialog.trav47GoldStoreV2 #paymentWizard.pros .featureRenewal input.checkbox {
        width: 12px !important;
        height: 12px !important;
        margin: 0 0 0 3px !important;
        vertical-align: -2px !important;
    }

    .dialog.trav47GoldStoreV2 #paymentWizard.pros .enumerableElementsCheckboxLabel {
        color: inherit !important;
        font: inherit !important;
        white-space: nowrap !important;
        -webkit-text-fill-color: #fffdf4 !important;
    }

    .dialog.trav47GoldStoreV2 #paymentWizard.pros .featureRemainingTime .renewalActive {
        color: #75df58 !important;
        -webkit-text-fill-color: #75df58 !important;
        -webkit-text-stroke: .3px rgba(255,255,255,.82) !important;
        paint-order: stroke fill !important;
        text-shadow: 0 1px 2px rgba(17,31,8,.94) !important;
    }

    .dialog.trav47GoldStoreV2 #paymentWizard.pros .featureButton {
        position: static !important;
        grid-area: button !important;
        align-self: center !important;
        display: flex !important;
        align-items: center !important;
        justify-content: center !important;
        width: 72px !important;
        min-width: 72px !important;
        height: 30px !important;
        margin: 0 !important;
        padding: 0 !important;
        transform: none !important;
    }

    html#mainLayout[data-trav47-layout="mobile"] .dialog.trav47GoldStoreV2 #paymentWizard.pros .featureButton {
        transform: translateX(-4px) !important;
    }

    /* Plus features: inner navigation and item lists. */
    .dialog.trav47GoldStoreV2 #paymentWizard.paymentFeatures > .contentWrapper {
        display: flex !important;
        flex-direction: column !important;
        gap: 4px !important;
        width: 100% !important;
        min-width: 0 !important;
        margin: 0 !important;
        padding: 4px !important;
        overflow-x: hidden !important;
        border: 0 !important;
        background: url("../../images/ui/gold-shop-panel-bg-v1.jpg") center / cover no-repeat !important;
        box-shadow: inset 0 0 0 1px rgba(111, 98, 61, .18) !important;
        box-sizing: border-box !important;
    }

    .dialog.trav47GoldStoreV2 #paymentWizard.paymentFeatures .infoArea,
    .dialog.trav47GoldStoreV2 #paymentWizard.paymentFeatures .contentArea {
        float: none !important;
        width: 100% !important;
        min-width: 0 !important;
        height: auto !important;
        margin: 0 !important;
        padding: 0 !important;
        border: 0 !important;
        border-radius: 0 !important;
        background: transparent !important;
        box-shadow: none !important;
        box-sizing: border-box !important;
    }

    .dialog.trav47GoldStoreV2 #paymentWizard.paymentFeatures .infoArea {
        position: sticky !important;
        top: 0 !important;
        z-index: 3 !important;
        flex: 0 0 auto !important;
        background: url("../../images/ui/gold-shop-panel-bg-v1.jpg") center top / cover no-repeat !important;
    }

    .dialog.trav47GoldStoreV2 #paymentWizard.paymentFeatures .infoArea .contentBorder-contents,
    .dialog.trav47GoldStoreV2 #paymentWizard.paymentFeatures .contentArea .contentBorder-contents {
        position: relative !important;
        float: none !important;
        width: 100% !important;
        min-width: 0 !important;
        height: auto !important;
        margin: 0 !important;
        padding: 0 !important;
        border: 0 !important;
        background: transparent !important;
        box-shadow: none !important;
        box-sizing: border-box !important;
    }

    .dialog.trav47GoldStoreV2 #paymentWizard.paymentFeatures .infoArea .contentBorder-contents {
        display: grid !important;
        grid-template-columns: repeat(3, minmax(0, 1fr)) !important;
        gap: 3px !important;
        direction: rtl !important;
    }

    .dialog.trav47GoldStoreV2 #paymentWizard.paymentFeatures .infoArea .contentBorder-contents::before,
    .dialog.trav47GoldStoreV2 #paymentWizard.paymentFeatures .infoArea .contentBorder-contents::after {
        display: none !important;
        content: none !important;
    }

    .dialog.trav47GoldStoreV2 .trav47GoldFeatureTab {
        display: flex !important;
        float: none !important;
        align-items: stretch !important;
        justify-content: stretch !important;
        width: 100% !important;
        max-width: none !important;
        min-width: 0 !important;
        min-height: 40px !important;
        margin: 0 !important;
        padding: 0 !important;
        overflow: hidden !important;
        border: 1px solid #806a31 !important;
        border-radius: 4px 4px 1px 1px !important;
        color: #f5e8be !important;
        background:
            linear-gradient(rgba(95, 70, 39, .84), rgba(54, 39, 24, .92)),
            url("../../images/ui/gold-package-card-bg-v3.jpg") center / cover no-repeat !important;
        box-shadow: inset 0 1px 0 rgba(255, 255, 255, .24), 0 1px 2px rgba(50, 37, 22, .18) !important;
        font-family: Tahoma, Arial, sans-serif !important;
        text-shadow: 0 1px 1px rgba(0, 0, 0, .62) !important;
        cursor: pointer !important;
        box-sizing: border-box !important;
        -webkit-appearance: none !important;
        appearance: none !important;
        -webkit-tap-highlight-color: transparent !important;
        pointer-events: auto !important;
    }

    .dialog.trav47GoldStoreV2 .trav47GoldFeatureTab.active {
        border-color: #638b31 !important;
        color: #fff !important;
        background:
            linear-gradient(rgba(139, 181, 71, .94), rgba(83, 125, 38, .97)),
            url("../../images/ui/gold-package-card-bg-v3.jpg") center / cover no-repeat !important;
        box-shadow: inset 0 1px 0 rgba(255,255,255,.32), 0 1px 2px rgba(50, 37, 22, .2) !important;
    }

    .dialog.trav47GoldStoreV2 .trav47GoldFeatureTab .buyGoldInfoStep,
    .dialog.trav47GoldStoreV2 .trav47GoldFeatureTab .buyGoldInfoStep.active {
        display: flex !important;
        flex: 1 1 auto !important;
        flex-direction: column !important;
        align-items: center !important;
        justify-content: center !important;
        width: 100% !important;
        min-width: 0 !important;
        height: auto !important;
        min-height: 40px !important;
        margin: 0 !important;
        padding: 3px !important;
        gap: 1px !important;
        border: 0 !important;
        color: #fff !important;
        background: transparent !important;
        box-shadow: none !important;
        box-sizing: border-box !important;
        text-shadow: 0 1px 1px rgba(0, 0, 0, .72) !important;
        -webkit-text-fill-color: #fff !important;
        pointer-events: none !important;
    }

    .dialog.trav47GoldStoreV2 .trav47GoldFeatureTab .buyGoldInfoStepLabel {
        margin: 0 !important;
        padding: 0 !important;
        color: #fff !important;
        font: 700 10px/16px Tahoma, Arial, sans-serif !important;
        white-space: nowrap !important;
        -webkit-text-fill-color: #fff !important;
    }

    .dialog.trav47GoldStoreV2 .trav47GoldFeatureTab .buyGoldInfoStepContent {
        width: 100% !important;
        margin: 0 !important;
        padding: 0 !important;
        overflow: hidden !important;
        color: #fff !important;
        font: 400 8px/12px Tahoma, Arial, sans-serif !important;
        opacity: .85 !important;
        text-overflow: ellipsis !important;
        white-space: nowrap !important;
        -webkit-text-fill-color: #fff !important;
    }

    .dialog.trav47GoldStoreV2 #paymentWizard.paymentFeatures .contentArea {
        flex: 1 1 auto !important;
        overflow: visible !important;
    }

    .dialog.trav47GoldStoreV2 #paymentWizard.paymentFeatures .paymentPopupDialogWrapper {
        width: 100% !important;
        min-width: 0 !important;
        height: auto !important;
        min-height: 0 !important;
        margin: 0 !important;
        padding: 0 !important;
        border: 0 !important;
        background: transparent !important;
        box-shadow: none !important;
        box-sizing: border-box !important;
    }

    .dialog.trav47GoldStoreV2 .paymentWizardMenu {
        display: grid !important;
        grid-template-columns: minmax(0, 1fr) !important;
        gap: 5px !important;
        width: 100% !important;
        min-width: 0 !important;
        height: auto !important;
        min-height: 0 !important;
        margin: 0 !important;
        padding: 0 0 8px !important;
        overflow: visible !important;
        scrollbar-width: none !important;
        box-sizing: border-box !important;
    }

    .dialog.trav47GoldStoreV2 .paymentWizardMenu.hide,
    .dialog.trav47GoldStoreV2 .paymentWizardMenu[hidden] {
        display: none !important;
    }

    /* Phone-only Plus Features cards. These rules fully replace the old
       desktop 560px feature skin and its image-built buttons. */
    .dialog.trav47GoldStoreV2 #paymentWizard.paymentFeatures .paymentWizardMenu > .feature,
    .dialog.trav47GoldStoreV2 #paymentWizard.paymentFeatures .paymentWizardMenu > .featureBooking {
        position: relative !important;
        float: none !important;
        display: block !important;
        align-self: stretch !important;
        width: 100% !important;
        max-width: none !important;
        min-width: 0 !important;
        height: auto !important;
        min-height: 70px !important;
        max-height: none !important;
        margin: 0 !important;
        padding: 0 !important;
        overflow: hidden !important;
        border: 1px solid #8e762f !important;
        border-radius: 6px !important;
        color: #f7edc5 !important;
        background:
            linear-gradient(rgba(87, 66, 39, .82), rgba(48, 36, 25, .91)),
            url("../../images/ui/gold-package-card-bg-v3.jpg") center / cover no-repeat !important;
        box-shadow:
            inset 0 1px 0 rgba(255, 255, 255, .28),
            0 1px 2px rgba(46, 33, 19, .24) !important;
        box-sizing: border-box !important;
    }

    .dialog.trav47GoldStoreV2 #paymentWizard.paymentFeatures .featureBooking .featureContent {
        position: relative !important;
        float: none !important;
        display: grid !important;
        direction: ltr !important;
        grid-template-columns: 72px minmax(0, 1fr) !important;
        grid-template-rows: minmax(28px, auto) minmax(28px, auto) !important;
        grid-template-areas:
            "action title"
            "details description" !important;
        align-items: center !important;
        column-gap: 6px !important;
        width: 100% !important;
        min-width: 0 !important;
        height: auto !important;
        min-height: 68px !important;
        margin: 0 !important;
        padding: 5px 7px !important;
        overflow: hidden !important;
        border: 0 !important;
        background: transparent !important;
        box-shadow: none !important;
        box-sizing: border-box !important;
    }

    .dialog.trav47GoldStoreV2 #paymentWizard.paymentFeatures .featureBooking .featureTitle {
        position: static !important;
        grid-area: title !important;
        align-self: end !important;
        min-width: 0 !important;
        margin: 0 !important;
        padding: 0 !important;
        overflow: hidden !important;
        color: #fff0bc !important;
        font: 700 10px/16px Tahoma, Arial, sans-serif !important;
        direction: rtl !important;
        text-align: right !important;
        text-shadow: 0 1px 1px rgba(25, 18, 8, .88) !important;
        text-overflow: ellipsis !important;
        white-space: nowrap !important;
        -webkit-text-fill-color: #fff0bc !important;
    }

    .dialog.trav47GoldStoreV2 #paymentWizard.paymentFeatures .featureBooking .featureRemainingTime {
        position: static !important;
        grid-area: description !important;
        align-self: start !important;
        min-width: 0 !important;
        max-height: 30px !important;
        margin: 0 !important;
        padding: 0 !important;
        overflow: hidden !important;
        color: #ded5b8 !important;
        font: 400 8.5px/14px Tahoma, Arial, sans-serif !important;
        direction: rtl !important;
        text-align: right !important;
        text-shadow: 0 1px 1px rgba(25, 18, 8, .72) !important;
        white-space: normal !important;
        -webkit-text-fill-color: #ded5b8 !important;
    }

    .dialog.trav47GoldStoreV2 #paymentWizard.paymentFeatures .featureBooking .featureDuration,
    .dialog.trav47GoldStoreV2 #paymentWizard.paymentFeatures .featureBooking .featureRenewal {
        position: static !important;
        top: auto !important;
        right: auto !important;
        bottom: auto !important;
        left: auto !important;
        grid-area: details !important;
        align-self: start !important;
        width: 100% !important;
        min-width: 0 !important;
        margin: 0 !important;
        padding: 0 !important;
        overflow: hidden !important;
        color: #cce589 !important;
        font: 700 8px/14px Tahoma, Arial, sans-serif !important;
        direction: rtl !important;
        text-align: center !important;
        text-shadow: 0 1px 1px rgba(25, 18, 8, .78) !important;
        text-overflow: ellipsis !important;
        white-space: nowrap !important;
        transform: none !important;
        -webkit-text-fill-color: #cce589 !important;
        box-sizing: border-box !important;
    }

    .dialog.trav47GoldStoreV2 .trav47PhoneStorageCount {
        display: inline-block !important;
        direction: ltr !important;
        unicode-bidi: isolate !important;
        white-space: nowrap !important;
    }

    .dialog.trav47GoldStoreV2 #paymentWizard.paymentFeatures .featureBooking .featureButton {
        position: static !important;
        top: auto !important;
        right: auto !important;
        bottom: auto !important;
        left: auto !important;
        grid-area: action !important;
        align-self: end !important;
        justify-self: center !important;
        display: flex !important;
        align-items: center !important;
        justify-content: center !important;
        width: 72px !important;
        min-width: 72px !important;
        height: 30px !important;
        margin: 0 !important;
        padding: 0 !important;
        transform: none !important;
    }

    .dialog.trav47GoldStoreV2 #paymentWizard:is(.pros, .paymentFeatures) .featureButton {
        transform: translateX(10px) !important;
    }

    .dialog.trav47GoldStoreV2 #paymentWizard.paymentFeatures #buyResources .featureContent table {
        grid-column: 2 !important;
        grid-row: 1 / span 2 !important;
        align-self: center !important;
    }

    .dialog.trav47GoldStoreV2 #paymentWizard.paymentFeatures #moreProtection > h5.round {
        width: 100% !important;
        margin: 0 !important;
        padding: 5px 7px !important;
        border: 1px solid rgba(119, 142, 82, .55) !important;
        border-radius: 5px !important;
        color: #435833 !important;
        background: rgba(238, 245, 226, .9) !important;
        font: 700 9px/16px Tahoma, Arial, sans-serif !important;
        text-align: center !important;
        box-sizing: border-box !important;
    }

    .dialog.trav47GoldStoreV2 #paymentWizard.paymentFeatures #moreProtection > br {
        display: none !important;
    }

    .dialog.trav47GoldStoreV2 #buyResources .featureContent table {
        width: 100% !important;
        margin: 3px 0 0 !important;
        table-layout: fixed !important;
        border-collapse: separate !important;
        border-spacing: 2px !important;
    }

    .dialog.trav47GoldStoreV2 #buyResources .featureContent td {
        min-width: 0 !important;
        padding: 2px !important;
        overflow: hidden !important;
        border: 1px solid #d5ddd0 !important;
        border-radius: 3px !important;
        background: #f4f7f1 !important;
        font: 700 9px/18px Arial, sans-serif !important;
        text-align: center !important;
        text-overflow: ellipsis !important;
        white-space: nowrap !important;
    }

    /* Keep the four resource amounts visible on phones.  Older shop rules
       flattened both table rows into one line, so the numbers were clipped
       outside the compact feature card. */
    .dialog.trav47GoldStoreV2 #paymentWizard.paymentFeatures #buyResources .featureContent table {
        display: table !important;
        width: 100% !important;
        max-width: none !important;
        table-layout: fixed !important;
        visibility: visible !important;
        opacity: 1 !important;
    }

    .dialog.trav47GoldStoreV2 #paymentWizard.paymentFeatures #buyResources .featureContent table tbody {
        display: table-row-group !important;
        width: auto !important;
    }

    .dialog.trav47GoldStoreV2 #paymentWizard.paymentFeatures #buyResources .featureContent table tr {
        display: table-row !important;
    }

    .dialog.trav47GoldStoreV2 #paymentWizard.paymentFeatures #buyResources .featureContent table td {
        display: table-cell !important;
        width: 50% !important;
        padding: 1px 2px !important;
        overflow: visible !important;
        vertical-align: middle !important;
        text-overflow: clip !important;
    }

    .dialog.trav47GoldStoreV2 #paymentWizard.paymentFeatures #buyResources .inlineIcon.resources {
        display: flex !important;
        align-items: center !important;
        justify-content: center !important;
        gap: 2px !important;
        width: 100% !important;
        min-width: 0 !important;
        overflow: visible !important;
        color: #4a321b !important;
        direction: rtl !important;
        font: 700 clamp(7px, 2.15vw, 9px)/14px Arial, sans-serif !important;
        text-shadow: 0 1px 0 rgba(255, 255, 255, .78) !important;
        white-space: nowrap !important;
        -webkit-text-fill-color: #4a321b !important;
    }

    .dialog.trav47GoldStoreV2 #paymentWizard.paymentFeatures #buyResources .inlineIcon.resources i {
        display: inline-block !important;
        flex: 0 0 auto !important;
    }

    .dialog.trav47GoldStoreV2 #paymentWizard.paymentFeatures #buyResources .inlineIcon.resources .value {
        position: static !important;
        display: inline-flex !important;
        align-items: center !important;
        justify-content: center !important;
        gap: 3px !important;
        float: none !important;
        width: auto !important;
        min-width: 68px !important;
        height: 16px !important;
        margin: 0 !important;
        padding: 0 4px !important;
        overflow: visible !important;
        border: 1px solid #ad936b !important;
        border-radius: 3px !important;
        color: #4a321b !important;
        background: linear-gradient(#fffdf5, #e9ddc4) !important;
        box-shadow: inset 0 1px 0 rgba(255, 255, 255, .92), 0 1px 1px rgba(35, 24, 13, .22) !important;
        font: inherit !important;
        line-height: 14px !important;
        visibility: visible !important;
        opacity: 1 !important;
        text-align: center !important;
        text-overflow: clip !important;
        white-space: nowrap !important;
        -webkit-text-fill-color: #4a321b !important;
        box-sizing: border-box !important;
    }

    .dialog.trav47GoldStoreV2 #paymentWizard.paymentFeatures #buyResources .trav47PhoneResourceNumber {
        direction: ltr !important;
        unicode-bidi: isolate !important;
    }

    .dialog.trav47GoldStoreV2 #paymentWizard.paymentFeatures #buyResources .trav47PhoneResourceUnit {
        direction: rtl !important;
        font-family: Tahoma, Arial, sans-serif !important;
        font-size: 8px !important;
        font-weight: 700 !important;
        white-space: nowrap !important;
    }

    /* Compact action buttons shared by the general Pros tab and all three
       Plus Features views.  The label gets exactly 2px breathing room on
       both sides without making the button wider than its 72px slot. */
    .dialog.trav47GoldStoreV2 #paymentWizard:is(.pros, .paymentFeatures) .featureButton > button.prosButton {
        width: auto !important;
        min-width: 0 !important;
        max-width: 72px !important;
        margin: 0 !important;
        padding-right: 0 !important;
        padding-left: 0 !important;
        box-sizing: border-box !important;
    }

    .dialog.trav47GoldStoreV2 #paymentWizard.pros .featureButton > button.prosButton {
        display: inline-flex !important;
        align-items: center !important;
        justify-content: center !important;
        direction: rtl !important;
        height: 30px !important;
        min-height: 30px !important;
        padding-right: 5px !important;
        padding-left: 5px !important;
        border: 1px solid #36571a !important;
        border-radius: 5px !important;
        color: #fff !important;
        background: linear-gradient(to bottom, #a2cf55 0%, #73aa35 48%, #4d7e22 100%) !important;
        box-shadow: inset 0 1px 0 rgba(255, 255, 255, .55), inset 0 -1px 0 rgba(37, 69, 15, .42), 0 1px 2px rgba(20, 31, 12, .38) !important;
        font: 700 10px/28px Tahoma, Arial, sans-serif !important;
        text-shadow: 0 1px 1px #315416 !important;
        appearance: none !important;
        -webkit-appearance: none !important;
        box-sizing: border-box !important;
    }

    /* Pros buttons use direct children.  The legacy button-container,
       button-background and button-content layers were removed from their
       markup so the old payment button rules cannot collapse the label/price. */
    .dialog.trav47GoldStoreV2 #paymentWizard.pros .featureButton > button.prosButton > .trav47ProsAction,
    .dialog.trav47GoldStoreV2 #paymentWizard.pros .featureButton > button.prosButton > .trav47ProsPrice {
        position: static !important;
        float: none !important;
        display: inline-flex !important;
        align-items: center !important;
        flex: 0 0 auto !important;
        width: auto !important;
        margin: 0 !important;
        padding: 0 !important;
        white-space: nowrap !important;
    }

    .dialog.trav47GoldStoreV2 #paymentWizard.pros .featureButton > button.prosButton > .trav47ProsAction {
        margin-left: 9px !important;
    }

    .dialog.trav47GoldStoreV2 #paymentWizard.pros .featureButton > button.prosButton > .trav47ProsPrice {
        gap: 2px !important;
        direction: ltr !important;
    }

    .dialog.trav47GoldStoreV2 #paymentWizard.pros .featureButton > button.prosButton > .trav47ProsPrice .goldIcon {
        flex: 0 0 13px !important;
        width: 13px !important;
        height: 13px !important;
        margin: 0 !important;
    }

    .dialog.trav47GoldStoreV2 #paymentWizard.pros .featureButton > button.prosButton > .trav47ProsPrice .goldValue {
        color: #fff2a3 !important;
        font: 700 10px/28px Arial, sans-serif !important;
        -webkit-text-fill-color: #fff2a3 !important;
    }

    .dialog.trav47GoldStoreV2 #paymentWizard:is(.pros, .paymentFeatures) .featureButton > button.prosButton .button-container {
        width: auto !important;
        min-width: 0 !important;
        max-width: 72px !important;
        box-sizing: border-box !important;
    }

    .dialog.trav47GoldStoreV2 #paymentWizard:is(.pros, .paymentFeatures) .featureButton > button.prosButton .button-content {
        display: flex !important;
        align-items: center !important;
        justify-content: center !important;
        gap: 2px !important;
        width: auto !important;
        min-width: 0 !important;
        max-width: 72px !important;
        padding-right: 2px !important;
        padding-left: 2px !important;
        overflow: hidden !important;
        text-overflow: ellipsis !important;
        white-space: nowrap !important;
        box-sizing: border-box !important;
    }

    .dialog.trav47GoldStoreV2 .enumerableElementsCheckboxLabel {
        display: inline !important;
        margin: 0 3px 0 0 !important;
        font-size: 9px !important;
        white-space: nowrap !important;
    }

    .dialog.trav47GoldStoreV2 input.checkbox {
        position: static !important;
        width: 13px !important;
        height: 13px !important;
        margin: 0 !important;
        vertical-align: middle !important;
    }

    .dialog.trav47GoldStoreV2 .trav47GoldStoreNotice {
        position: sticky !important;
        top: 0 !important;
        z-index: 5 !important;
        display: block !important;
        width: 100% !important;
        min-height: 29px !important;
        margin: 0 0 5px !important;
        padding: 5px 8px !important;
        border: 1px solid #83a95d !important;
        border-radius: 5px !important;
        color: #3f6425 !important;
        background: #eaf5dd !important;
        box-shadow: 0 1px 2px rgba(54,85,34,.12) !important;
        font: 700 10px/17px Tahoma, Arial, sans-serif !important;
        text-align: center !important;
        box-sizing: border-box !important;
        animation: trav47GoldStoreNoticeIn .18s ease-out !important;
    }

    .dialog.trav47GoldStoreV2 .trav47GoldActionBusy,
    .dialog.trav47GoldStoreV2 .trav47GoldStorePackage.trav47GoldActionBusy {
        transform: translateY(1px) scale(.98) !important;
        filter: brightness(.9) saturate(.8) !important;
        pointer-events: none !important;
    }

    .dialog.trav47GoldStoreV2.trav47GoldStoreSwitching::after {
        content: "" !important;
        position: absolute !important;
        top: 75px !important;
        right: 0 !important;
        z-index: 8 !important;
        width: 34% !important;
        height: 2px !important;
        background: linear-gradient(to left, transparent, #8eb74a, transparent) !important;
        animation: trav47GoldStoreLoading .65s linear infinite !important;
        pointer-events: none !important;
    }

    @keyframes trav47GoldStoreNoticeIn {
        from { opacity: 0; transform: translateY(-3px); }
        to { opacity: 1; transform: translateY(0); }
    }

    @keyframes trav47GoldStoreLoading {
        from { transform: translateX(300%); }
        to { transform: translateX(-300%); }
    }
}

/* Purchase feedback belongs to the card that initiated the action.  Keeping
   it absolutely positioned prevents success/error text from changing the
   feature grid height on desktop or on any of the phone layouts. */
.dialog.trav47GoldStoreV2 .trav47GoldFeedbackHost,
.dialog.premiumFeatureGoldclub .trav47GoldFeedbackHost {
    position: relative !important;
}

.dialog.trav47GoldStoreV2 .trav47GoldCardNotice,
.dialog.premiumFeatureGoldclub .trav47GoldCardNotice {
    position: absolute !important;
    top: 3px !important;
    left: 50% !important;
    z-index: 30 !important;
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    width: max-content !important;
    max-width: calc(100% - 8px) !important;
    min-height: 21px !important;
    margin: 0 !important;
    padding: 2px 8px !important;
    overflow: hidden !important;
    border: 1px solid #799f54 !important;
    border-radius: 11px !important;
    color: #315b1d !important;
    background: rgba(237, 248, 226, .97) !important;
    box-shadow: 0 2px 5px rgba(31, 47, 23, .24) !important;
    font: 700 10px/15px Tahoma, Arial, sans-serif !important;
    text-align: center !important;
    white-space: normal !important;
    box-sizing: border-box !important;
    pointer-events: none !important;
    transform: translateX(-50%) !important;
    animation: trav47GoldCardNoticeIn .18s ease-out !important;
}

.dialog.trav47GoldStoreV2 .trav47GoldCardNotice--error,
.dialog.premiumFeatureGoldclub .trav47GoldCardNotice--error {
    border-color: #c3776d !important;
    color: #912d22 !important;
    background: rgba(255, 240, 236, .98) !important;
    box-shadow: 0 2px 5px rgba(88, 27, 19, .2) !important;
}

@media screen and (min-width: 1025px) {
    .dialog.trav47GoldStoreV2 .trav47GoldCardNotice,
    .dialog.premiumFeatureGoldclub .trav47GoldCardNotice {
        min-height: 23px !important;
        padding: 3px 9px !important;
        font-size: 11px !important;
        line-height: 15px !important;
    }
}

@keyframes trav47GoldCardNoticeIn {
    from { opacity: 0; transform: translate(-50%, -3px); }
    to { opacity: 1; transform: translate(-50%, 0); }
}

/* The Payment Wizard prints the cost as a number.  Keep this fallback broad
   enough to cover both the direct Pros markup and the legacy Buy wrappers. */
.dialog.trav47GoldStoreV2 #paymentWizard .featureButton button.prosButton .goldIcon {
    display: none !important;
    width: 0 !important;
    height: 0 !important;
    margin: 0 !important;
    padding: 0 !important;
    background: none !important;
}

.dialog.trav47GoldStoreV2 #paymentWizard.pros .trav47ProsPrice {
    gap: 0 !important;
}

/* Desktop keeps the approved phone visual language, but uses the available
   width for one uninterrupted row of all six packages.  It is a true overlay
   window without a backdrop or any html/body scroll lock, so opening it never
   shifts or compresses the page underneath. */
@media screen and (min-width: 1025px) {
    html.trav47GoldStoreOpen,
    html.trav47GoldStoreOpen body,
    body.trav47GoldStoreOpen {
        height: auto !important;
        overflow: visible !important;
        overscroll-behavior: auto !important;
    }

    .dialog.trav47GoldStoreV2 {
        top: var(--trav47-gold-store-desktop-top, 130px) !important;
        right: auto !important;
        bottom: auto !important;
        left: 50% !important;
        width: min(880px, calc(100vw - 28px)) !important;
        max-width: 880px !important;
        height: min(450px, calc(100vh - 34px)) !important;
        min-height: 380px !important;
        max-height: 450px !important;
        border: 0 !important;
        border-radius: 8px !important;
        outline: 0 !important;
        background: transparent !important;
        box-shadow: 0 9px 28px rgba(32, 23, 14, .38) !important;
        transform: translateX(-50%) !important;
    }

    .dialog.trav47GoldStoreV2::before,
    .dialog.trav47GoldStoreV2::after {
        content: none !important;
        display: none !important;
    }

    .dialog.trav47GoldStoreV2 .dialog-container,
    .dialog.trav47GoldStoreV2 .dialogContainer,
    .dialog.trav47GoldStoreV2 .dialog-contents,
    .dialog.trav47GoldStoreV2 .dialogContents,
    .dialog.trav47GoldStoreV2 form,
    .dialog.trav47GoldStoreV2 #dialogContent {
        border-radius: 6px !important;
    }

    .dialog.trav47GoldStoreV2 #paymentWizard.trav47GoldStorePanel {
        overflow: hidden !important;
        border: 2px solid #5d4732 !important;
        border-radius: 6px !important;
        background: #f4f6ef !important;
        box-shadow: none !important;
    }

    .dialog.trav47GoldStoreV2 .trav47GoldStoreTopbar {
        flex-basis: 42px !important;
        height: 42px !important;
        min-height: 42px !important;
        border-right: 0 !important;
        border-left: 0 !important;
        border-radius: 4px 4px 0 0 !important;
    }

    .dialog.trav47GoldStoreV2 .trav47GoldStoreTopbar h2 {
        font-size: 15px !important;
        line-height: 40px !important;
    }

    .dialog.trav47GoldStoreV2 .trav47PaymentClose {
        top: 7px !important;
        left: 7px !important;
        width: 27px !important;
        min-width: 27px !important;
        height: 27px !important;
    }

    .dialog.trav47GoldStoreV2 .trav47GoldStoreBalance {
        top: 8px !important;
        left: 43px !important;
        font-size: 12px !important;
    }

    .dialog.trav47GoldStoreV2 #paymentWizard > .header,
    .dialog.trav47GoldStoreV2 #paymentWizard > .header li:not(.clear),
    .dialog.trav47GoldStoreV2 #paymentWizard > .header li.active,
    .dialog.trav47GoldStoreV2 #paymentWizard > .header .tabButton,
    .dialog.trav47GoldStoreV2 #paymentWizard > .header li.active .tabButton {
        height: 40px !important;
        min-height: 40px !important;
    }

    .dialog.trav47GoldStoreV2 #paymentWizard > .header {
        flex-basis: 40px !important;
    }

    .dialog.trav47GoldStoreV2 #paymentWizard > .header .tabButton,
    .dialog.trav47GoldStoreV2 #paymentWizard > .header li.active .tabButton {
        font-size: 12px !important;
        line-height: 38px !important;
    }

    .dialog.trav47GoldStoreV2 #paymentWizard > .contentWrapper {
        padding: 8px !important;
        scrollbar-width: thin !important;
    }

    .dialog.trav47GoldStoreV2 #paymentWizard.buyGold > .contentWrapper {
        align-items: center !important;
        justify-content: center !important;
        padding: 7px !important;
        overflow-y: hidden !important;
        background: #e7ddcb !important;
        touch-action: none !important;
    }

    .dialog.trav47GoldStoreV2 #paymentWizard.buyGold .trav47GoldStoreGoldArea {
        position: relative !important;
        flex: 0 0 306px !important;
        width: 846px !important;
        max-width: 100% !important;
        height: 306px !important;
        min-height: 306px !important;
        margin: 0 auto !important;
        padding: 3px !important;
        overflow: visible !important;
        border: 1px solid #34220d !important;
        border-radius: 4px !important;
        background: linear-gradient(to bottom, #cba467 5%, #f3e2ae 13%, #efbf7b 32%, #aa8050 48%, #835e35 72%, #ad8a54 93%, #d7b672 100%) !important;
        box-sizing: border-box !important;
    }

    .dialog.trav47GoldStoreV2 #paymentWizard.buyGold .trav47GoldStoreGoldArea::before {
        content: "" !important;
        position: absolute !important;
        inset: 2px !important;
        z-index: 0 !important;
        border: 1px solid #44321d !important;
        border-radius: 1px !important;
        background: #dfe9df url("../../images/shop/boxBackground.png") center top / 846px 300px no-repeat !important;
        pointer-events: none !important;
    }

    .dialog.trav47GoldStoreV2 .trav47GoldOfferStrip {
        position: absolute !important;
        top: 7px !important;
        right: 50% !important;
        z-index: 4 !important;
        flex-basis: 24px !important;
        width: auto !important;
        min-width: 260px !important;
        height: 24px !important;
        min-height: 24px !important;
        margin: 0 !important;
        font-size: 10px !important;
        line-height: 22px !important;
        transform: translateX(50%) !important;
    }

    .dialog.trav47GoldStoreV2 .trav47GoldStorePackageGrid {
        position: relative !important;
        z-index: 1 !important;
        grid-template-columns: repeat(6, 132px) !important;
        grid-template-rows: 260px !important;
        align-content: start !important;
        align-items: start !important;
        justify-content: space-between !important;
        flex: 0 0 100% !important;
        gap: 0 !important;
        width: 100% !important;
        height: 100% !important;
        padding: 35px 0 0 !important;
        overflow: visible !important;
    }

    .dialog.trav47GoldStoreV2 .trav47GoldStorePackage {
        position: relative !important;
        display: block !important;
        width: 130px !important;
        min-width: 130px !important;
        max-width: 130px !important;
        height: 260px !important;
        min-height: 260px !important;
        max-height: 260px !important;
        margin: 0 auto !important;
        padding: 0 !important;
        overflow: visible !important;
        border: 1px solid #34220d !important;
        border-radius: 4px !important;
        color: #e3d8c4 !important;
        background: linear-gradient(to bottom, #05393b, #196e70 50%, #196e70) !important;
        box-shadow: inset 0 0 1px 2px #118188 !important;
        text-align: center !important;
        transition: filter 150ms ease !important;
        animation: none !important;
    }

    .dialog.trav47GoldStoreV2 .trav47GoldStorePackage:hover {
        filter: brightness(1.3) !important;
    }

    .dialog.trav47GoldStoreV2 .trav47GoldStorePackageName {
        display: none !important;
    }

    .dialog.trav47GoldStoreV2 .trav47GoldStorePackageImage {
        position: absolute !important;
        right: 0 !important;
        bottom: 23px !important;
        left: 0 !important;
        z-index: 2 !important;
        width: 100% !important;
        height: 154px !important;
        margin: 0 !important;
        padding: 17px 0 !important;
        overflow: visible !important;
        background: url("../../images/shop/glare.png") center / 168px 154px no-repeat !important;
        box-sizing: border-box !important;
    }

    .dialog.trav47GoldStoreV2 .trav47GoldStorePackageImage img {
        width: 120px !important;
        max-width: 120px !important;
        height: 120px !important;
        max-height: 120px !important;
        margin: 0 auto !important;
        object-fit: contain !important;
        pointer-events: none !important;
    }

    .dialog.trav47GoldStoreV2 .trav47GoldStorePackageMeta {
        position: absolute !important;
        right: 50% !important;
        bottom: 190px !important;
        z-index: 3 !important;
        display: inline-flex !important;
        width: auto !important;
        height: 32px !important;
        margin: 0 !important;
        padding: 0 !important;
        gap: 3px !important;
        color: #e3d8c4 !important;
        font: 700 25px/30px Arial, Helvetica, Verdana, sans-serif !important;
        text-shadow: 1px 0 1px #190000, 1px 1px 1px #190000, 0 1px 1px #190000, -1px 1px 1px #190000, -1px 0 1px #190000, -1px -1px 1px #190000, 0 -1px 1px #190000, 1px -1px 1px #190000 !important;
        transform: translateX(50%) !important;
    }

    .dialog.trav47GoldStoreV2 .trav47GoldStorePackageAmount {
        color: #e3d8c4 !important;
        font: inherit !important;
    }

    .dialog.trav47GoldStoreV2 .trav47GoldStorePackageGoldIcon {
        width: 30px !important;
        height: 30px !important;
    }

    .dialog.trav47GoldStoreV2 .trav47GoldStorePackagePrice {
        position: absolute !important;
        top: auto !important;
        right: 5px !important;
        bottom: 5px !important;
        left: 5px !important;
        z-index: 3 !important;
        display: inline-flex !important;
        width: auto !important;
        height: 34px !important;
        margin: 0 !important;
        padding: 9px 0 0 !important;
        border-radius: 0 0 1px 1px !important;
        color: #e3d8c4 !important;
        background: #0f4344 !important;
        font: 700 15px/18px Arial, Helvetica, Verdana, sans-serif !important;
        text-shadow: 1px 0 1px #190000, 1px 1px 1px #190000, 0 1px 1px #190000, -1px 1px 1px #190000, -1px 0 1px #190000, -1px -1px 1px #190000, 0 -1px 1px #190000, 1px -1px 1px #190000 !important;
        box-sizing: border-box !important;
    }

    .dialog.trav47GoldStoreV2 .trav47BestSellerBadge {
        top: 5px !important;
        right: 6px !important;
        left: auto !important;
        z-index: 4 !important;
        display: flex !important;
        align-items: center !important;
        justify-content: center !important;
        width: calc(100% - 12px) !important;
        min-width: 0 !important;
        height: 25px !important;
        min-height: 25px !important;
        padding: 0 5px !important;
        border: 2px solid #f4c24f !important;
        border-radius: 2px !important;
        color: #fff1b6 !important;
        background: linear-gradient(180deg, #bd2018 0%, #8b0d0b 100%) !important;
        box-shadow: inset 0 0 0 1px rgba(255, 230, 143, .28), 0 1px 2px rgba(50, 15, 4, .45) !important;
        clip-path: none !important;
        font: 700 10px/12px Tahoma, Arial, sans-serif !important;
        text-align: center !important;
        text-shadow: 1px 0 1px #572121, 1px 1px 1px #572121, 0 1px 1px #572121, -1px 1px 1px #572121, -1px 0 1px #572121, -1px -1px 1px #572121, 0 -1px 1px #572121, 1px -1px 1px #572121 !important;
        outline: 0 !important;
        white-space: normal !important;
        box-sizing: border-box !important;
        transform: none !important;
    }

    .dialog.trav47GoldStoreV2 .trav47BestValueBadge {
        position: absolute !important;
        top: -30px !important;
        right: 4px !important;
        z-index: 4 !important;
        display: flex !important;
        align-items: center !important;
        justify-content: center !important;
        width: 123px !important;
        height: 64px !important;
        padding: 0 7px 14px !important;
        color: #e8f2b4 !important;
        background: url("../../images/shop/bestValue.png") center / 123px 64px no-repeat !important;
        font: 700 10px/12px Tahoma, Arial, sans-serif !important;
        text-align: center !important;
        text-shadow: 1px 0 1px #254014, 1px 1px 1px #254014, 0 1px 1px #254014, -1px 1px 1px #254014, -1px 0 1px #254014, -1px -1px 1px #254014, 0 -1px 1px #254014, 1px -1px 1px #254014 !important;
        box-shadow: none !important;
        outline: 0 !important;
        white-space: normal !important;
        box-sizing: border-box !important;
    }

    .dialog.trav47GoldStoreV2 .trav47GoldStorePackage:is(.trav47BestSellerPackage, .trav47BestValuePackage) {
        background: linear-gradient(to bottom, #8b460b, #b58b2d 50%, #b58b2d) !important;
        box-shadow: inset 0 0 1px 2px #e8b723 !important;
        animation: none !important;
    }

    .dialog.trav47GoldStoreV2 .trav47GoldStorePackage:is(.trav47BestSellerPackage, .trav47BestValuePackage) .trav47GoldStorePackageImage {
        background-image: url("../../images/shop/glareHighlight.png") !important;
    }

    .dialog.trav47GoldStoreV2 .trav47GoldStorePackage.trav47BestSellerPackage .trav47GoldStorePackageImage {
        background-image: none !important;
    }

    .dialog.trav47GoldStoreV2 .trav47GoldStorePackage:is(.trav47BestSellerPackage, .trav47BestValuePackage) .trav47GoldStorePackagePrice {
        background: #6d531b !important;
    }

    .dialog.trav47GoldStoreV2 .trav47GoldOfferBadge {
        top: 100% !important;
        left: -4px !important;
        min-width: 38px !important;
        min-height: 14px !important;
        font-size: 8px !important;
        line-height: 11px !important;
    }

    /* Desktop Pros tab: the two account-wide services form the first row;
       the four resource boosts share the second row.  Every card uses the
       clean package surface while each service receives its own colour. */
    .dialog.trav47GoldStoreV2 #paymentWizard.pros > .contentWrapper {
        padding: 8px 8px 20px !important;
        overflow: hidden !important;
        border: 0 !important;
        background: #dfe9df url("../../images/shop/boxBackground.png") center / 100% 100% no-repeat !important;
        box-shadow: none !important;
    }

    .dialog.trav47GoldStoreV2 #paymentWizard.pros .contentArea,
    .dialog.trav47GoldStoreV2 #paymentWizard.pros .contentArea > .contentBorder-contents,
    .dialog.trav47GoldStoreV2 #paymentWizard.pros .paymentPopupDialogWrapper {
        height: 100% !important;
        min-height: 0 !important;
    }

    .dialog.trav47GoldStoreV2 #paymentWizard.pros .featureCollection {
        display: grid !important;
        grid-template-columns: repeat(4, minmax(0, 1fr)) !important;
        grid-template-rows: 108px minmax(0, 1fr) !important;
        gap: 8px !important;
        width: 100% !important;
        height: 100% !important;
        padding: 0 !important;
        direction: rtl !important;
    }

    .dialog.trav47GoldStoreV2 #paymentWizard.pros .featureCollection > .feature {
        width: auto !important;
        height: 100% !important;
        min-height: 0 !important;
        max-height: none !important;
        border: 1px solid #34220d !important;
        border-radius: 4px !important;
        background: linear-gradient(
            to bottom,
            var(--trav47-pros-tone-a),
            var(--trav47-pros-tone-b) 50%,
            var(--trav47-pros-tone-b)
        ) !important;
        box-shadow:
            inset 0 0 1px 2px var(--trav47-pros-inner),
            0 2px 5px rgba(38, 35, 27, .22) !important;
    }

    .dialog.trav47GoldStoreV2 #paymentWizard.pros .featureCollection > .feature:nth-child(1) {
        grid-column: 1 / span 2 !important;
        --trav47-pros-tone-a: #8b460b;
        --trav47-pros-tone-b: #b58b2d;
        --trav47-pros-inner: #e8b723;
    }

    .dialog.trav47GoldStoreV2 #paymentWizard.pros .featureCollection > .feature:nth-child(2) {
        grid-column: 3 / span 2 !important;
        --trav47-pros-tone-a: #05393b;
        --trav47-pros-tone-b: #196e70;
        --trav47-pros-inner: #118188;
    }

    .dialog.trav47GoldStoreV2 #paymentWizard.pros .featureCollection > .feature:nth-child(3) {
        --trav47-pros-tone-a: #245c38;
        --trav47-pros-tone-b: #4b8c50;
        --trav47-pros-inner: #73af69;
    }

    .dialog.trav47GoldStoreV2 #paymentWizard.pros .featureCollection > .feature:nth-child(4) {
        --trav47-pros-tone-a: #7a3d24;
        --trav47-pros-tone-b: #b86e45;
        --trav47-pros-inner: #d59a70;
    }

    .dialog.trav47GoldStoreV2 #paymentWizard.pros .featureCollection > .feature:nth-child(5) {
        --trav47-pros-tone-a: #334d61;
        --trav47-pros-tone-b: #69889c;
        --trav47-pros-inner: #8eb0c0;
    }

    .dialog.trav47GoldStoreV2 #paymentWizard.pros .featureCollection > .feature:nth-child(6) {
        --trav47-pros-tone-a: #6e5b1c;
        --trav47-pros-tone-b: #a98a2d;
        --trav47-pros-inner: #d5b95d;
    }

    .dialog.trav47GoldStoreV2 #paymentWizard.pros .featureCollection > .feature:nth-child(-n+2) .featureContent {
        grid-template-columns: minmax(0, 1fr) minmax(112px, .8fr) 82px !important;
        grid-template-rows: 52px 34px !important;
        height: 100% !important;
        min-height: 0 !important;
        max-height: none !important;
        padding: 10px 76px 10px 8px !important;
    }

    .dialog.trav47GoldStoreV2 #paymentWizard.pros .featureCollection > .feature:nth-child(-n+2) .featureContent::before {
        top: 25px !important;
        right: 13px !important;
        width: 54px !important;
        height: 54px !important;
    }

    .dialog.trav47GoldStoreV2 #paymentWizard.pros .featureCollection > .feature:nth-child(-n+2) .featureTitle {
        font-size: 14px !important;
        line-height: 24px !important;
    }

    .dialog.trav47GoldStoreV2 #paymentWizard.pros .featureCollection > .feature:nth-child(n+3) .featureContent {
        grid-template-columns: minmax(0, 1fr) !important;
        grid-template-rows: 28px 22px 21px 34px !important;
        grid-template-areas:
            "title"
            "state"
            "duration"
            "button" !important;
        align-content: center !important;
        row-gap: 3px !important;
        height: 100% !important;
        min-height: 0 !important;
        max-height: none !important;
        padding: 68px 8px 10px !important;
    }

    .dialog.trav47GoldStoreV2 #paymentWizard.pros .featureCollection > .feature:nth-child(n+3) .featureContent::before {
        top: 11px !important;
        right: 50% !important;
        width: 50px !important;
        height: 50px !important;
        transform: translateX(50%) !important;
    }

    .dialog.trav47GoldStoreV2 #paymentWizard.pros .featureCollection > .feature:nth-child(n+3) .featureTitle,
    .dialog.trav47GoldStoreV2 #paymentWizard.pros .featureCollection > .feature:nth-child(n+3) .featureDuration,
    .dialog.trav47GoldStoreV2 #paymentWizard.pros .featureCollection > .feature:nth-child(n+3) .featureRenewal {
        grid-column: 1 !important;
        justify-self: center !important;
        padding: 0 !important;
        text-align: center !important;
    }

    .dialog.trav47GoldStoreV2 #paymentWizard.pros .featureCollection > .feature:nth-child(n+3) .featureTitle {
        width: 100% !important;
        font-size: 12px !important;
        line-height: 22px !important;
    }

    .dialog.trav47GoldStoreV2 #paymentWizard.pros .featureCollection > .feature:nth-child(n+3) .featureRemainingTime {
        justify-self: center !important;
        max-width: 100% !important;
        font-size: 9px !important;
    }

    .dialog.trav47GoldStoreV2 #paymentWizard.pros .featureCollection > .feature:nth-child(n+3) .featureButton {
        justify-self: center !important;
    }

    /* The V2 dialog no longer carries paymentShopV3, therefore the old image
       button skin is not available here.  Give Pros actions a complete native
       surface instead of leaving their black label floating on the card. */
    .dialog.trav47GoldStoreV2 #paymentWizard.pros .featureButton {
        width: 82px !important;
        min-width: 82px !important;
        height: 32px !important;
    }

    .dialog.trav47GoldStoreV2 #paymentWizard.pros .featureButton > button.prosButton {
        position: relative !important;
        display: inline-flex !important;
        align-items: center !important;
        justify-content: center !important;
        width: 80px !important;
        min-width: 80px !important;
        max-width: 80px !important;
        height: 30px !important;
        min-height: 30px !important;
        margin: 0 !important;
        padding: 0 !important;
        overflow: hidden !important;
        border: 1px solid #36571a !important;
        border-radius: 5px !important;
        outline: 0 !important;
        color: #fff !important;
        background: linear-gradient(to bottom, #a2cf55 0%, #73aa35 48%, #4d7e22 100%) !important;
        box-shadow:
            inset 0 1px 0 rgba(255, 255, 255, .55),
            inset 0 -1px 0 rgba(37, 69, 15, .42),
            0 1px 2px rgba(20, 31, 12, .38) !important;
        font: 700 10px/28px Tahoma, Arial, sans-serif !important;
        text-align: center !important;
        text-shadow: 0 1px 1px #315416 !important;
        cursor: pointer !important;
        appearance: none !important;
        -webkit-appearance: none !important;
        box-sizing: border-box !important;
    }

    .dialog.trav47GoldStoreV2 #paymentWizard.pros .featureButton > button.prosButton:hover:not(.disabled) {
        background: linear-gradient(to bottom, #b2df65 0%, #82b943 48%, #5b8d2a 100%) !important;
        filter: brightness(1.03) !important;
    }

    .dialog.trav47GoldStoreV2 #paymentWizard.pros .featureButton > button.prosButton:active:not(.disabled) {
        background: linear-gradient(to bottom, #5c8d2a 0%, #72a837 100%) !important;
        box-shadow: inset 0 2px 3px rgba(31, 57, 13, .38) !important;
        transform: translateY(1px) !important;
    }

    .dialog.trav47GoldStoreV2 #paymentWizard.pros .featureButton > button.prosButton.disabled,
    .dialog.trav47GoldStoreV2 #paymentWizard.pros .featureButton > button.prosButton:disabled {
        border-color: #66705e !important;
        background: linear-gradient(to bottom, #9eaa91, #718068) !important;
        box-shadow: inset 0 1px 0 rgba(255, 255, 255, .32) !important;
        cursor: default !important;
        opacity: .78 !important;
    }

    .dialog.trav47GoldStoreV2 #paymentWizard.pros .trav47ProsAction {
        color: #fff !important;
        -webkit-text-fill-color: #fff !important;
    }

    .dialog.trav47GoldStoreV2 #paymentWizard.pros .trav47ProsPrice {
        display: inline-flex !important;
        align-items: center !important;
        gap: 2px !important;
        margin: 0 !important;
        color: #fff2a3 !important;
        direction: ltr !important;
        -webkit-text-fill-color: #fff2a3 !important;
    }

    .dialog.trav47GoldStoreV2 #paymentWizard.pros .trav47ProsPrice .goldValue {
        color: #fff2a3 !important;
        font: 700 10px/28px Arial, sans-serif !important;
        -webkit-text-fill-color: #fff2a3 !important;
    }

    .dialog.trav47GoldStoreV2 #paymentWizard.pros .trav47ProsPrice .goldIcon {
        flex: 0 0 13px !important;
        width: 13px !important;
        height: 13px !important;
        margin: 0 !important;
    }

    /* The running desktop response can still contain the legacy Pros button
       body (plain action text + direct goldValue span).  Scope the proven 3px
       spacing to that value only; never alter the site's global span reset. */
    #paymentWizard.pros .featureButton > .prosButton .button-content > .goldValue {
        padding-right: 3px !important;
        padding-left: 3px !important;
    }

    .dialog.trav47GoldStoreV2 #paymentWizard.paymentFeatures .paymentWizardMenu {
        gap: 5px !important;
    }

    /* Desktop resources: keep wood, clay, iron and crop in one horizontal
       line inside every package.  The source table stays 2x2 for phones. */
    .dialog.trav47GoldStoreV2 #paymentWizard.paymentFeatures #buyResources .featureContent table {
        display: grid !important;
        grid-template-columns: repeat(4, minmax(0, 1fr)) !important;
        align-items: center !important;
        width: 100% !important;
        direction: rtl !important;
        border: 0 !important;
        border-radius: 0 !important;
        background: transparent !important;
        box-shadow: none !important;
    }

    .dialog.trav47GoldStoreV2 #paymentWizard.paymentFeatures #buyResources .featureContent table > tbody,
    .dialog.trav47GoldStoreV2 #paymentWizard.paymentFeatures #buyResources .featureContent table > tbody > tr {
        display: contents !important;
    }

    .dialog.trav47GoldStoreV2 #paymentWizard.paymentFeatures #buyResources .featureContent table td {
        display: block !important;
        width: auto !important;
        min-width: 0 !important;
        padding: 1px 3px !important;
        border: 0 !important;
        border-radius: 0 !important;
        background: transparent !important;
        box-shadow: none !important;
    }

    /* Phone resources use small framed capsules.  On desktop the four values
       sit directly in the package row, so none of those inner layers remain. */
    .dialog.trav47GoldStoreV2 #paymentWizard.paymentFeatures #buyResources .inlineIcon.resources,
    .dialog.trav47GoldStoreV2 #paymentWizard.paymentFeatures #buyResources .inlineIcon.resources .value {
        border: 0 !important;
        border-radius: 0 !important;
        background: transparent !important;
        background-image: none !important;
        box-shadow: none !important;
        outline: 0 !important;
    }

    /* Desktop Plus Features shares the silver package backdrop.  Remove the
       former brown image layers from both its local navigation and cards. */
    .dialog.trav47GoldStoreV2 #paymentWizard.paymentFeatures > .contentWrapper {
        gap: 5px !important;
        padding: 5px !important;
        border: 0 !important;
        background: #dfe9df url("../../images/shop/boxBackground.png") center / 100% 100% no-repeat !important;
        box-shadow: none !important;
    }

    .dialog.trav47GoldStoreV2 #paymentWizard.paymentFeatures .infoArea {
        background: transparent !important;
    }

    .dialog.trav47GoldStoreV2 #paymentWizard.paymentFeatures .trav47GoldFeatureTab {
        border-color: #9ba99a !important;
        color: #34463b !important;
        background: linear-gradient(to bottom, rgba(252, 254, 251, .96), rgba(211, 222, 211, .96)) !important;
        box-shadow: inset 0 1px 0 #fff, 0 1px 2px rgba(55, 69, 58, .16) !important;
        text-shadow: none !important;
    }

    .dialog.trav47GoldStoreV2 #paymentWizard.paymentFeatures .trav47GoldFeatureTab.active {
        border-color: #6f923e !important;
        color: #fff !important;
        background: linear-gradient(to bottom, #a9cc68, #6f9d36) !important;
        box-shadow: inset 0 1px 0 rgba(255, 255, 255, .58), 0 1px 2px rgba(55, 69, 58, .2) !important;
        text-shadow: 0 1px 1px #4d7127 !important;
    }

    .dialog.trav47GoldStoreV2 #paymentWizard.paymentFeatures .trav47GoldFeatureTab .buyGoldInfoStep,
    .dialog.trav47GoldStoreV2 #paymentWizard.paymentFeatures .trav47GoldFeatureTab .buyGoldInfoStep.active {
        color: inherit !important;
        text-shadow: inherit !important;
        -webkit-text-fill-color: currentColor !important;
    }

    .dialog.trav47GoldStoreV2 #paymentWizard.paymentFeatures .trav47GoldFeatureTab .buyGoldInfoStepLabel {
        color: inherit !important;
        font-size: 12px !important;
        line-height: 18px !important;
        -webkit-text-fill-color: currentColor !important;
    }

    .dialog.trav47GoldStoreV2 #paymentWizard.paymentFeatures .trav47GoldFeatureTab .buyGoldInfoStepContent {
        display: none !important;
    }

    .dialog.trav47GoldStoreV2 #paymentWizard.paymentFeatures .trav47GoldFeatureTab .buyGoldInfoStep,
    .dialog.trav47GoldStoreV2 #paymentWizard.paymentFeatures .trav47GoldFeatureTab .buyGoldInfoStep.active {
        min-height: 34px !important;
        padding: 0 4px !important;
    }

    .dialog.trav47GoldStoreV2 #paymentWizard.paymentFeatures .paymentWizardMenu > .feature,
    .dialog.trav47GoldStoreV2 #paymentWizard.paymentFeatures .paymentWizardMenu > .featureBooking {
        min-height: 66px !important;
        border-color: #a3afa2 !important;
        color: #34463b !important;
        background: linear-gradient(to bottom, rgba(251, 253, 249, .97), rgba(219, 228, 217, .97)) !important;
        box-shadow: inset 0 1px 0 #fff, 0 1px 3px rgba(55, 69, 58, .18) !important;
    }

    .dialog.trav47GoldStoreV2 #paymentWizard.paymentFeatures .featureBooking .featureContent {
        grid-template-columns: 112px minmax(0, 1fr) !important;
        min-height: 64px !important;
        padding: 3px 6px !important;
    }

    .dialog.trav47GoldStoreV2 #paymentWizard.paymentFeatures .featureBooking .featureTitle {
        color: #314438 !important;
        font-size: 12px !important;
        line-height: 18px !important;
        text-shadow: none !important;
        -webkit-text-fill-color: #314438 !important;
    }

    .dialog.trav47GoldStoreV2 #paymentWizard.paymentFeatures .featureBooking .featureRemainingTime {
        color: #58675d !important;
        font-size: 10px !important;
        line-height: 15px !important;
        text-shadow: none !important;
        -webkit-text-fill-color: #58675d !important;
    }

    .dialog.trav47GoldStoreV2 #paymentWizard.paymentFeatures .featureBooking .featureDuration,
    .dialog.trav47GoldStoreV2 #paymentWizard.paymentFeatures .featureBooking .featureRenewal {
        color: #52762e !important;
        font-size: 10px !important;
        line-height: 15px !important;
        overflow: visible !important;
        text-shadow: none !important;
        text-overflow: clip !important;
        -webkit-text-fill-color: #52762e !important;
    }

    .dialog.trav47GoldStoreV2 #paymentWizard.paymentFeatures .featureBooking .featureButton {
        width: 84px !important;
        min-width: 84px !important;
        height: 32px !important;
        transform: none !important;
    }

    .dialog.trav47GoldStoreV2 #paymentWizard.paymentFeatures .featureButton > button.prosButton {
        position: relative !important;
        display: inline-flex !important;
        align-items: center !important;
        justify-content: center !important;
        width: 82px !important;
        min-width: 82px !important;
        max-width: 82px !important;
        height: 30px !important;
        min-height: 30px !important;
        margin: 0 !important;
        padding: 0 !important;
        overflow: hidden !important;
        border: 1px solid #36571a !important;
        border-radius: 5px !important;
        outline: 0 !important;
        color: #fff !important;
        background: linear-gradient(to bottom, #a2cf55 0%, #73aa35 48%, #4d7e22 100%) !important;
        box-shadow: inset 0 1px 0 rgba(255, 255, 255, .55), inset 0 -1px 0 rgba(37, 69, 15, .42), 0 1px 2px rgba(20, 31, 12, .38) !important;
        font: 700 10px/28px Tahoma, Arial, sans-serif !important;
        text-align: center !important;
        text-shadow: 0 1px 1px #315416 !important;
        appearance: none !important;
        -webkit-appearance: none !important;
        box-sizing: border-box !important;
    }

    .dialog.trav47GoldStoreV2 #paymentWizard.paymentFeatures .featureButton > button.prosButton .button-background {
        display: none !important;
    }

    .dialog.trav47GoldStoreV2 #paymentWizard.paymentFeatures .featureButton > button.prosButton .button-container,
    .dialog.trav47GoldStoreV2 #paymentWizard.paymentFeatures .featureButton > button.prosButton .button-content {
        position: static !important;
        display: flex !important;
        align-items: center !important;
        justify-content: center !important;
        width: 100% !important;
        min-width: 0 !important;
        max-width: none !important;
        height: 100% !important;
        margin: 0 !important;
        padding: 0 !important;
        gap: 3px !important;
        overflow: hidden !important;
        color: #fff !important;
        background: transparent !important;
        font: inherit !important;
        line-height: 28px !important;
        text-shadow: inherit !important;
        white-space: nowrap !important;
        box-sizing: border-box !important;
    }

    .dialog.trav47GoldStoreV2 #paymentWizard.paymentFeatures .featureButton > button.prosButton .goldValue {
        color: #fff2a3 !important;
        font: 700 10px/28px Arial, sans-serif !important;
        -webkit-text-fill-color: #fff2a3 !important;
    }

    .dialog.trav47GoldStoreV2 #paymentWizard.paymentFeatures .featureButton > button.prosButton .goldIcon {
        flex: 0 0 13px !important;
        width: 13px !important;
        height: 13px !important;
        margin: 0 !important;
    }

    .dialog.trav47GoldStoreV2 #paymentWizard.paymentFeatures #buyResources .inlineIcon.resources {
        gap: 4px !important;
        font: 700 12px/18px Arial, sans-serif !important;
    }

    .dialog.trav47GoldStoreV2 #paymentWizard.paymentFeatures #buyResources .inlineIcon.resources .value {
        min-width: 92px !important;
        height: 22px !important;
        padding: 0 6px !important;
        font-size: 12px !important;
        line-height: 20px !important;
    }

    .dialog.trav47GoldStoreV2 #paymentWizard.paymentFeatures #buyResources .trav47PhoneResourceNumber {
        font-size: 12px !important;
    }

    .dialog.trav47GoldStoreV2 #paymentWizard.paymentFeatures #buyResources .trav47PhoneResourceUnit {
        font-size: 11px !important;
        line-height: 18px !important;
    }

    .dialog.trav47GoldStoreV2 #paymentWizard > .contentWrapper,
    .dialog.trav47GoldStoreV2 .paymentWizardMenu,
    .dialog.trav47GoldStoreV2 .dialog-contents,
    .dialog.trav47GoldStoreV2 .dialogContents {
        scrollbar-width: thin !important;
        scrollbar-color: #7e9d58 rgba(219, 229, 218, .72) !important;
    }

    .dialog.trav47GoldStoreV2 #paymentWizard > .contentWrapper::-webkit-scrollbar,
    .dialog.trav47GoldStoreV2 .paymentWizardMenu::-webkit-scrollbar,
    .dialog.trav47GoldStoreV2 .dialog-contents::-webkit-scrollbar,
    .dialog.trav47GoldStoreV2 .dialogContents::-webkit-scrollbar {
        display: block !important;
        width: 6px !important;
        height: 6px !important;
    }

    .dialog.trav47GoldStoreV2 #paymentWizard > .contentWrapper::-webkit-scrollbar-track,
    .dialog.trav47GoldStoreV2 .paymentWizardMenu::-webkit-scrollbar-track,
    .dialog.trav47GoldStoreV2 .dialog-contents::-webkit-scrollbar-track,
    .dialog.trav47GoldStoreV2 .dialogContents::-webkit-scrollbar-track {
        border-radius: 6px !important;
        background: rgba(219, 229, 218, .72) !important;
    }

    .dialog.trav47GoldStoreV2 #paymentWizard > .contentWrapper::-webkit-scrollbar-thumb,
    .dialog.trav47GoldStoreV2 .paymentWizardMenu::-webkit-scrollbar-thumb,
    .dialog.trav47GoldStoreV2 .dialog-contents::-webkit-scrollbar-thumb,
    .dialog.trav47GoldStoreV2 .dialogContents::-webkit-scrollbar-thumb {
        min-height: 28px !important;
        border: 1px solid rgba(255, 255, 255, .58) !important;
        border-radius: 6px !important;
        background: linear-gradient(to bottom, #9fbe73, #668d3e) !important;
        box-shadow: inset 0 1px 0 rgba(255, 255, 255, .45) !important;
    }
}

@media screen and (max-width: 350px) {
    .dialog.trav47GoldStoreV2 .trav47GoldStoreTopbar {
        grid-template-columns: 52px minmax(0, 1fr) 58px !important;
    }

    .dialog.trav47GoldStoreV2 #paymentWizard > .header .tabButton,
    .dialog.trav47GoldStoreV2 #paymentWizard > .header li.active .tabButton {
        font-size: 9.5px !important;
    }

}

/* Phone Plus Features — use the same silver shop surface as the modern
   packages and Pros tab.  This block deliberately owns only phone widths so
   the desktop layout remains unchanged. */
@media screen and (max-width: 1024px) {
    .dialog.trav47GoldStoreV2 #paymentWizard.paymentFeatures > .contentWrapper {
        gap: 5px !important;
        padding: 5px !important;
        border: 0 !important;
        background: #dfe9df url("../../images/shop/boxBackground.png") center / 100% 100% no-repeat !important;
        box-shadow: none !important;
    }

    .dialog.trav47GoldStoreV2 #paymentWizard.paymentFeatures .infoArea,
    .dialog.trav47GoldStoreV2 #paymentWizard.paymentFeatures .infoArea .contentBorder-contents,
    .dialog.trav47GoldStoreV2 #paymentWizard.paymentFeatures .contentArea,
    .dialog.trav47GoldStoreV2 #paymentWizard.paymentFeatures .contentArea .contentBorder-contents,
    .dialog.trav47GoldStoreV2 #paymentWizard.paymentFeatures .paymentPopupDialogWrapper,
    .dialog.trav47GoldStoreV2 #paymentWizard.paymentFeatures .paymentWizardMenu {
        border: 0 !important;
        background: transparent !important;
        background-image: none !important;
        box-shadow: none !important;
        outline: 0 !important;
    }

    .dialog.trav47GoldStoreV2 #paymentWizard.paymentFeatures .trav47GoldFeatureTab {
        border: 1px solid #9ba99a !important;
        border-radius: 5px !important;
        color: #34463b !important;
        background: linear-gradient(to bottom, rgba(253, 254, 252, .98), rgba(213, 224, 213, .98)) !important;
        background-image: linear-gradient(to bottom, rgba(253, 254, 252, .98), rgba(213, 224, 213, .98)) !important;
        box-shadow: inset 0 1px 0 #fff, 0 1px 2px rgba(55, 69, 58, .15) !important;
        text-shadow: none !important;
    }

    .dialog.trav47GoldStoreV2 #paymentWizard.paymentFeatures .trav47GoldFeatureTab[data-target="generalOptions"].active {
        border-color: #6d913f !important;
        background: linear-gradient(to bottom, #acd06d, #709f38) !important;
    }

    .dialog.trav47GoldStoreV2 #paymentWizard.paymentFeatures .trav47GoldFeatureTab[data-target="buyResources"].active {
        border-color: #a2773e !important;
        background: linear-gradient(to bottom, #d8b76d, #a6793c) !important;
    }

    .dialog.trav47GoldStoreV2 #paymentWizard.paymentFeatures .trav47GoldFeatureTab[data-target="moreProtection"].active {
        border-color: #4f826f !important;
        background: linear-gradient(to bottom, #7db59c, #4f846f) !important;
    }

    .dialog.trav47GoldStoreV2 #paymentWizard.paymentFeatures .trav47GoldFeatureTab.active {
        color: #fff !important;
        box-shadow: inset 0 1px 0 rgba(255, 255, 255, .48), 0 1px 2px rgba(48, 66, 52, .2) !important;
        text-shadow: 0 1px 1px rgba(42, 61, 38, .55) !important;
    }

    .dialog.trav47GoldStoreV2 #paymentWizard.paymentFeatures .trav47GoldFeatureTab .buyGoldInfoStep,
    .dialog.trav47GoldStoreV2 #paymentWizard.paymentFeatures .trav47GoldFeatureTab .buyGoldInfoStep.active,
    .dialog.trav47GoldStoreV2 #paymentWizard.paymentFeatures .trav47GoldFeatureTab .buyGoldInfoStepLabel,
    .dialog.trav47GoldStoreV2 #paymentWizard.paymentFeatures .trav47GoldFeatureTab .buyGoldInfoStepContent {
        color: inherit !important;
        background: transparent !important;
        background-image: none !important;
        box-shadow: none !important;
        text-shadow: inherit !important;
        -webkit-text-fill-color: currentColor !important;
    }

    .dialog.trav47GoldStoreV2 #paymentWizard.paymentFeatures .paymentWizardMenu > .feature,
    .dialog.trav47GoldStoreV2 #paymentWizard.paymentFeatures .paymentWizardMenu > .featureBooking {
        overflow: hidden !important;
        border: 1px solid #a3afa2 !important;
        border-radius: 6px !important;
        color: #34463b !important;
        background: linear-gradient(to bottom, rgba(252, 254, 250, .98), rgba(220, 229, 218, .98)) !important;
        background-image: linear-gradient(to bottom, rgba(252, 254, 250, .98), rgba(220, 229, 218, .98)) !important;
        box-shadow: inset 0 1px 0 #fff, 0 1px 3px rgba(55, 69, 58, .16) !important;
        isolation: auto !important;
    }

    .dialog.trav47GoldStoreV2 #paymentWizard.paymentFeatures #buyResources > .feature,
    .dialog.trav47GoldStoreV2 #paymentWizard.paymentFeatures #buyResources > .featureBooking {
        border-color: #b8a17c !important;
        background: linear-gradient(to bottom, #fffdf7, #eadfc9) !important;
        background-image: linear-gradient(to bottom, #fffdf7, #eadfc9) !important;
    }

    .dialog.trav47GoldStoreV2 #paymentWizard.paymentFeatures #moreProtection > .feature,
    .dialog.trav47GoldStoreV2 #paymentWizard.paymentFeatures #moreProtection > .featureBooking {
        border-color: #96ad87 !important;
        background: linear-gradient(to bottom, #f9fcf5, #d8e8ce) !important;
        background-image: linear-gradient(to bottom, #f9fcf5, #d8e8ce) !important;
    }

    .dialog.trav47GoldStoreV2 #paymentWizard.paymentFeatures .paymentWizardMenu > .feature::before,
    .dialog.trav47GoldStoreV2 #paymentWizard.paymentFeatures .paymentWizardMenu > .feature::after,
    .dialog.trav47GoldStoreV2 #paymentWizard.paymentFeatures .featureBooking::before,
    .dialog.trav47GoldStoreV2 #paymentWizard.paymentFeatures .featureBooking::after,
    .dialog.trav47GoldStoreV2 #paymentWizard.paymentFeatures .featureBooking .featureContent::before,
    .dialog.trav47GoldStoreV2 #paymentWizard.paymentFeatures .featureBooking .featureContent::after {
        display: none !important;
        content: none !important;
        border: 0 !important;
        background: none !important;
        box-shadow: none !important;
    }

    .dialog.trav47GoldStoreV2 #paymentWizard.paymentFeatures .featureBooking .featureContent {
        border: 0 !important;
        background: transparent !important;
        background-image: none !important;
        box-shadow: none !important;
    }

    .dialog.trav47GoldStoreV2 #paymentWizard.paymentFeatures .featureBooking .featureTitle {
        color: #304439 !important;
        font-size: 11px !important;
        line-height: 17px !important;
        text-shadow: none !important;
        -webkit-text-fill-color: #304439 !important;
    }

    .dialog.trav47GoldStoreV2 #paymentWizard.paymentFeatures .featureBooking .featureRemainingTime {
        color: #58685f !important;
        font-size: 9.5px !important;
        line-height: 15px !important;
        text-shadow: none !important;
        -webkit-text-fill-color: #58685f !important;
    }

    .dialog.trav47GoldStoreV2 #paymentWizard.paymentFeatures .featureBooking .featureDuration,
    .dialog.trav47GoldStoreV2 #paymentWizard.paymentFeatures .featureBooking .featureRenewal {
        color: #52762e !important;
        text-shadow: none !important;
        -webkit-text-fill-color: #52762e !important;
    }

    .dialog.trav47GoldStoreV2 #paymentWizard.paymentFeatures #buyResources .featureDuration,
    .dialog.trav47GoldStoreV2 #paymentWizard.paymentFeatures #buyResources .featureRenewal {
        color: #896328 !important;
        -webkit-text-fill-color: #896328 !important;
    }

    .dialog.trav47GoldStoreV2 #paymentWizard.paymentFeatures #moreProtection .featureDuration,
    .dialog.trav47GoldStoreV2 #paymentWizard.paymentFeatures #moreProtection .featureRenewal {
        color: #3e7359 !important;
        -webkit-text-fill-color: #3e7359 !important;
    }

    /* Keep the action and its delivery/duration line as one vertically
       centred group opposite the feature specification. */
    .dialog.trav47GoldStoreV2 #paymentWizard.paymentFeatures .featureBooking .featureContent {
        position: relative !important;
    }

    .dialog.trav47GoldStoreV2 #paymentWizard.paymentFeatures .featureBooking .featureButton {
        position: absolute !important;
        top: 50% !important;
        right: auto !important;
        bottom: auto !important;
        left: 7px !important;
        z-index: 2 !important;
        grid-area: auto !important;
        grid-column: auto !important;
        grid-row: auto !important;
        align-self: auto !important;
        justify-self: auto !important;
        margin: 0 !important;
        transform: translateY(-23px) !important;
    }

    .dialog.trav47GoldStoreV2 #paymentWizard.paymentFeatures .featureBooking .featureDuration,
    .dialog.trav47GoldStoreV2 #paymentWizard.paymentFeatures .featureBooking .featureRenewal {
        position: absolute !important;
        top: 50% !important;
        right: auto !important;
        bottom: auto !important;
        left: 7px !important;
        z-index: 2 !important;
        grid-area: auto !important;
        grid-column: auto !important;
        grid-row: auto !important;
        width: 72px !important;
        min-width: 72px !important;
        margin: 0 !important;
        padding: 0 !important;
        line-height: 14px !important;
        text-align: center !important;
        white-space: nowrap !important;
        transform: translateY(10px) !important;
    }

    .dialog.trav47GoldStoreV2 #paymentWizard.paymentFeatures #buyResources .trav47PhoneResourceNumber {
        font-size: 11px !important;
        line-height: 15px !important;
    }

    .dialog.trav47GoldStoreV2 #paymentWizard.paymentFeatures #buyResources .trav47PhoneResourceUnit {
        font-size: 9px !important;
        line-height: 15px !important;
    }
}

/* Desktop Plus Features uses the same official purple action language as the
   fast/max-level upgrade button.  Keep the active inner section darker so the
   currently selected category remains immediately visible. */
@media screen and (min-width: 1025px) {
    .dialog.trav47GoldStoreV2 #paymentWizard > .header .tabButton.paymentFeatures,
    .dialog.trav47GoldStoreV2 #paymentWizard > .header li.active .tabButton.paymentFeatures,
    .dialog.trav47GoldStoreV2 #paymentWizard.paymentFeatures .trav47GoldFeatureTab,
    .dialog.trav47GoldStoreV2 #paymentWizard.paymentFeatures .featureButton > button.prosButton {
        color: #f2f2f2 !important;
        border-color: #200532 !important;
        background-color: #ad73c5 !important;
        background-image: linear-gradient(180deg, #ad73c5, #805d8f) !important;
        box-shadow: inset -2px 0 1px -1px #88579d,
                    inset 3px 0 1px -1px #87569b,
                    inset 0 3px 1px -1px #d68ef6,
                    inset 0 -3px 1px -1px rgba(66, 29, 83, 0.6) !important;
        text-shadow: -1px 1px 1px rgba(0, 0, 0, 0.5) !important;
        -webkit-text-fill-color: #f2f2f2 !important;
    }

    .dialog.trav47GoldStoreV2 #paymentWizard.paymentFeatures .trav47GoldFeatureTab.active {
        color: #fff !important;
        border-color: #4c1a6e !important;
        background-color: #805d8f !important;
        background-image: linear-gradient(0deg, #9b6dae, #64327c) !important;
        box-shadow: inset -2px 0 1px -1px #88579d,
                    inset 3px 0 1px -1px #87569b,
                    inset 0 1px 0 rgba(255, 255, 255, 0.38) !important;
        text-shadow: -1px 1px 1px rgba(0, 0, 0, 0.5) !important;
        -webkit-text-fill-color: #fff !important;
    }

    .dialog.trav47GoldStoreV2 #paymentWizard.paymentFeatures .trav47GoldFeatureTab:hover:not(.active),
    .dialog.trav47GoldStoreV2 #paymentWizard.paymentFeatures .featureButton > button.prosButton:hover:not(.disabled):not(:disabled) {
        color: #333 !important;
        border-color: #4c1a6e !important;
        background-color: #ad73c5 !important;
        background-image: linear-gradient(180deg, transparent, #a87bbe) !important;
        box-shadow: inset 0 20px 25px -10px rgba(255, 255, 255, 0.7) !important;
        text-shadow: none !important;
        -webkit-text-fill-color: #333 !important;
    }

    .dialog.trav47GoldStoreV2 #paymentWizard.paymentFeatures .featureButton > button.prosButton:active:not(.disabled):not(:disabled) {
        color: #333 !important;
        background-color: #805d8f !important;
        background-image: linear-gradient(0deg, #9b6dae, #64327c) !important;
        box-shadow: inset -2px 0 1px -1px #88579d,
                    inset 3px 0 1px -1px #87569b !important;
        text-shadow: none !important;
        -webkit-text-fill-color: #333 !important;
    }

    .dialog.trav47GoldStoreV2 #paymentWizard.paymentFeatures .featureButton > button.prosButton.disabled,
    .dialog.trav47GoldStoreV2 #paymentWizard.paymentFeatures .featureButton > button.prosButton:disabled {
        color: #333 !important;
        border-color: #665a6f !important;
        background-color: #7c7182 !important;
        background-image: none !important;
        box-shadow: none !important;
        text-shadow: none !important;
        -webkit-text-fill-color: #333 !important;
    }

    .dialog.trav47GoldStoreV2 #paymentWizard.paymentFeatures .trav47GoldFeatureTab .buyGoldInfoStep,
    .dialog.trav47GoldStoreV2 #paymentWizard.paymentFeatures .trav47GoldFeatureTab .buyGoldInfoStepLabel {
        color: inherit !important;
        text-shadow: inherit !important;
        -webkit-text-fill-color: currentColor !important;
    }

    /* The clean action markup intentionally removes the legacy image node.
       Restore the 14px coin only for desktop Plus Features, after the value
       so RTL flex places it immediately to the value's left. */
    .dialog.trav47GoldStoreV2 #paymentWizard.paymentFeatures .featureButton > button.prosButton {
        direction: rtl !important;
        gap: 3px !important;
    }

    .dialog.trav47GoldStoreV2 #paymentWizard.paymentFeatures .featureButton > button.prosButton .trav47CleanGoldActionLabel {
        order: 0 !important;
    }

    .dialog.trav47GoldStoreV2 #paymentWizard.paymentFeatures .featureButton > button.prosButton .trav47CleanGoldPrice {
        display: inline-flex !important;
        direction: rtl !important;
        align-items: center !important;
        justify-content: center !important;
        gap: 0 !important;
        height: 15px !important;
        margin: 0 !important;
        padding: 0 !important;
        line-height: 15px !important;
        order: 1 !important;
    }

    .dialog.trav47GoldStoreV2 #paymentWizard.paymentFeatures .featureButton > button.prosButton .trav47CleanGoldValue {
        display: inline-flex !important;
        align-items: center !important;
        height: 15px !important;
        margin: 0 !important;
        padding: 0 !important;
        line-height: 15px !important;
        direction: ltr !important;
    }

    .dialog.trav47GoldStoreV2 #paymentWizard.paymentFeatures .featureButton > button.prosButton .trav47CleanGoldPrice::after {
        content: "" !important;
        display: inline-block !important;
        flex: 0 0 14px !important;
        box-sizing: border-box !important;
        width: 14px !important;
        min-width: 14px !important;
        height: 14px !important;
        margin: 0 3px 0 0 !important;
        padding: 0 !important;
        background: transparent url("../../images/ui/buttons/button/content/goldInner-rtl.png") center / 14px 14px no-repeat !important;
    }
}