/* =========================================================
   5TV VIP Page
========================================================= */

.ftv-vip-page {
    padding-block:
        clamp(1.5rem, 3vw, 2.5rem)
        5rem;
}

.ftv-vip-container {
    width: min(
        calc(100% - 2rem),
        92rem
    );

    margin-inline: auto;
}


/* Hero
--------------------------------------------------------- */

.ftv-vip-hero {
    margin-block-end: 1.5rem;

    padding: 1.6rem;

    border: 1px solid var(--border);
    border-radius: 1.2rem;

    background:
        linear-gradient(
            135deg,
            rgb(255 210 70 / 8%),
            transparent
        ),
        var(--surface);
}

.ftv-vip-eyebrow {
    color: var(--accent);

    font-size: .75rem;
    font-weight: 800;
}

.ftv-vip-hero h1 {
    margin:
        .4rem
        0
        .6rem;

    font-size: clamp(
        2rem,
        4vw,
        3rem
    );
}

.ftv-vip-hero p {
    margin: 0;

    max-width: 42rem;

    color: var(--text-muted);

    line-height: 1.8;
}

.ftv-vip-current {
    margin-block-start: 1rem;

    display: inline-flex;
    flex-direction: column;

    gap: .25rem;

    padding:
        .65rem
        .85rem;

    border: 1px solid
        color-mix(
            in srgb,
            var(--accent) 40%,
            var(--border)
        );

    border-radius: .8rem;

    background:
        color-mix(
            in srgb,
            var(--accent) 7%,
            var(--surface)
        );
}

.ftv-vip-current strong {
    color: var(--accent);
}

.ftv-vip-current span {
    color: var(--text-muted);

    font-size: .72rem;
}


/* Plans
--------------------------------------------------------- */

.ftv-vip-plans {
    display: grid;

    grid-template-columns:
        repeat(5, minmax(0, 1fr));

    gap: .7rem;
}

.ftv-vip-plan {
    position: relative;

    min-width: 0;

    padding: 1.15rem;

    border: 1px solid var(--border);
    border-radius: 1rem;

    background: var(--surface);
}

.ftv-vip-plan.is-current {
    border-color:
        color-mix(
            in srgb,
            var(--accent) 65%,
            var(--border)
        );
}

.ftv-vip-plan__current {
    display: inline-flex;

    margin-block-end: .65rem;

    padding:
        .28rem
        .5rem;

    border-radius: 999px;

    background: var(--accent);

    color: #111;

    font-size: .6rem;
    font-weight: 800;
}

.ftv-vip-plan h2 {
    margin: 0;

    font-size: 1rem;
}

.ftv-vip-plan__price {
    margin-block:
        .85rem
        1rem;
}

.ftv-vip-plan__price strong {
    color: var(--accent);

    font-size: 1.75rem;
}

.ftv-vip-plan ul {
    margin:
        0
        0
        1rem;

    padding: 0;

    list-style: none;
}

.ftv-vip-plan li {
    padding-block: .35rem;

    color: var(--text-muted);

    font-size: .72rem;
}

.ftv-vip-plan__action a,
.ftv-vip-plan__action button {
    width: 100%;

    min-height: 2.6rem;

    display: inline-flex;
    align-items: center;
    justify-content: center;

    border: 1px solid var(--border);
    border-radius: .7rem;

    background: var(--surface-2);

    color: var(--text);

    font-size: .72rem;
    font-weight: 700;

    text-decoration: none;

    cursor: pointer;
}

.ftv-vip-plan__action button.ftv-vip-buy {
    border-color: var(--accent);

    color: var(--accent);
}

.ftv-vip-plan__action button:disabled {
    cursor: default;
    opacity: .6;
}


/* Responsive
--------------------------------------------------------- */

@media (max-width: 1150px) {

    .ftv-vip-plans {
        grid-template-columns:
            repeat(3, minmax(0, 1fr));
    }
}


@media (max-width: 700px) {

    .ftv-vip-page {
        padding-block-start: .8rem;
        padding-block-end: 6rem;
    }

    .ftv-vip-container {
        width: calc(100% - 1rem);
    }

    .ftv-vip-hero {
        padding: 1rem;

        border-radius: .9rem;
    }

    .ftv-vip-hero h1 {
        font-size: 1.65rem;
    }

    .ftv-vip-hero p {
        font-size: .75rem;
    }

    .ftv-vip-plans {
        grid-template-columns:
            1fr;

        gap: .55rem;
    }

    .ftv-vip-plan {
        padding: .95rem;
    }
}


/* =========================================================
   VIP PayPal Checkout
========================================================= */

.ftv-vip-plan.is-paying {
    border-color: var(--accent);

    box-shadow:
        0 0 0 1px
        color-mix(
            in srgb,
            var(--accent) 35%,
            transparent
        );
}


.ftv-vip-payment-box {
    margin-block-start: 1rem;
}

.ftv-vip-payment-box[hidden] {
    display: none !important;
}

.ftv-vip-payment-box__inner {
    width: min(100%, 34rem);

    margin-inline: auto;

    padding: 1.2rem;

    border: 1px solid var(--border);
    border-radius: 1rem;

    background: var(--surface);
}

.ftv-vip-payment-box h2 {
    margin:
        0
        0
        .35rem;

    font-size: 1.1rem;
}

.ftv-vip-payment-box p {
    margin:
        0
        0
        1rem;

    color: var(--text-muted);

    font-size: .75rem;
}


.ftv-vip-payment-status {
    min-height: 1.4rem;

    margin-block-start: .7rem;

    color: var(--text-muted);

    font-size: .72rem;

    text-align: center;
}

.ftv-vip-payment-status[data-type="error"] {
    color: #ef6666;
}

.ftv-vip-payment-status[data-type="success"] {
    color: #4ecb71;
}


/* VIP checkout buttons interaction */
.ftv-vip-buy {
    touch-action: manipulation;
}

.ftv-vip-buy:active {
    transform: translateY(1px);
}

.ftv-vip-payment-box {
    scroll-margin-top: 6rem;
}

/* ===== FTV VIP 2026 — Scoped redesign, inherits the site's real accent ===== */
.ftv-vip-page{direction:rtl;text-align:right;color:var(--text,#f4f4f4)}
.ftv-vip-page .ftv-vip-container{width:min(calc(100% - 32px),1320px);margin-inline:auto}
.ftv-vip-page .ftv-vip-hero{background:var(--surface,#15171b);border:1px solid var(--border,#292b30);border-radius:14px;padding:clamp(22px,3vw,40px);margin-block-end:28px}
.ftv-vip-page .ftv-vip-eyebrow{display:inline-block;font-size:12px;color:var(--accent,#e6b94f);margin-bottom:9px}
.ftv-vip-page .ftv-vip-hero h1{font-size:clamp(27px,3vw,43px);font-weight:800;line-height:1.35;margin:0 0 10px}
.ftv-vip-page .ftv-vip-hero h1 em{font-style:normal;color:var(--accent,#e6b94f)}
.ftv-vip-page .ftv-vip-hero p{font-size:clamp(13px,1.2vw,16px);line-height:1.8;max-width:660px}
.ftv-vip-benefits{margin:0 0 32px}
.ftv-vip-benefits__heading,.ftv-vip-plans__heading{display:flex;align-items:baseline;gap:16px;justify-content:space-between;margin:0 0 16px}
.ftv-vip-benefits__heading h2,.ftv-vip-plans__heading h2{font-size:clamp(19px,2vw,24px);font-weight:800;color:var(--text,#fff);margin:0}
.ftv-vip-benefits__heading p,.ftv-vip-plans__heading p{font-size:12px;color:var(--text-muted,#999);margin:0}
.ftv-vip-benefits__grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:10px}
.ftv-vip-benefit{display:flex;align-items:center;gap:12px;min-width:0;min-height:68px;padding:13px 15px;border:1px solid var(--border,#2d3035);border-radius:11px;background:var(--surface,#15171b);font-size:13px;line-height:1.65;color:var(--text,#ededed)}
.ftv-vip-benefit__icon{display:grid;place-items:center;flex:0 0 28px;width:28px;height:28px;color:var(--accent,#e6b94f)}
.ftv-vip-benefit__icon svg{width:22px;height:22px;fill:none;stroke:currentColor;stroke-width:1.65;stroke-linecap:round;stroke-linejoin:round}
.ftv-vip-page .ftv-vip-plans{direction:rtl;grid-template-columns:repeat(5,minmax(0,1fr));gap:10px;align-items:stretch}
.ftv-vip-page .ftv-vip-plan{background:var(--surface,#15171b);border:1px solid var(--border,#292c32);border-radius:12px;min-width:0;padding:18px 14px;box-shadow:none;min-height:100%}
.ftv-vip-page .ftv-vip-plan.is-permanent{border-color:var(--accent,#e6b94f)}
.ftv-vip-page .ftv-vip-plan__permanent-badge{display:inline-block;color:var(--accent,#e6b94f);font-weight:700;font-size:11px;line-height:1.65;margin:0 0 9px}
.ftv-vip-page .ftv-vip-plan h2{font-size:17px;font-weight:800}
.ftv-vip-page .ftv-offer-price__value{color:var(--accent,#e6b94f);font-size:29px}
.ftv-vip-page .ftv-vip-plan-features li{font-size:12px;line-height:1.8}
.ftv-vip-page .ftv-vip-check{color:var(--accent,#e6b94f)}
.ftv-vip-page .ftv-vip-contact>summary{color:var(--accent,#e6b94f);border-color:var(--border,#333);background:var(--surface-2,#1b1e23)}
.ftv-vip-page .ftv-vip-contact>summary:hover{background:var(--surface-2,#1b1e23)}
@media(max-width:1150px){.ftv-vip-page .ftv-vip-plans{grid-template-columns:repeat(3,minmax(0,1fr))}.ftv-vip-benefits__grid{grid-template-columns:repeat(3,minmax(0,1fr))}}
@media(max-width:800px){.ftv-vip-page .ftv-vip-plans{grid-template-columns:repeat(2,minmax(0,1fr))}.ftv-vip-benefits__grid{grid-template-columns:repeat(2,minmax(0,1fr))}.ftv-vip-benefit{padding:12px;font-size:12px;min-height:72px}}
@media(max-width:700px){.ftv-vip-page .ftv-vip-container{width:calc(100% - 20px)}.ftv-vip-page .ftv-vip-hero{padding:22px 17px;margin-block-end:22px}.ftv-vip-page .ftv-vip-hero h1{font-size:27px}.ftv-vip-benefits__heading,.ftv-vip-plans__heading{display:block}.ftv-vip-benefits__heading p,.ftv-vip-plans__heading p{margin-top:5px}.ftv-vip-benefits__grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:8px}.ftv-vip-benefit{align-items:flex-start;flex-direction:column;gap:8px;font-size:11px;padding:12px;min-height:102px}.ftv-vip-page .ftv-vip-plans{grid-template-columns:1fr;gap:12px}.ftv-vip-page .ftv-vip-plan{padding:20px 18px}.ftv-vip-page .ftv-vip-plan-features li{font-size:13px}.ftv-vip-page .ftv-vip-contact>summary{min-height:48px}}
@media(prefers-reduced-motion:reduce){.ftv-vip-page *{scroll-behavior:auto!important}}


/* ===== 5TV VIP layout refinement v2: wide desktop / compact mobile ===== */
@media (min-width: 1200px) {
  .ftv-vip-page .ftv-vip-container {
    width: min(calc(100% - 64px), 1500px);
  }
  .ftv-vip-page .ftv-vip-hero {
    padding: 26px 34px;
    margin-block-end: 26px;
    min-height: 0;
  }
  .ftv-vip-page .ftv-vip-hero h1 {
    font-size: clamp(30px, 2.65vw, 43px);
  }
  .ftv-vip-benefits__grid { gap: 10px 12px; }
  .ftv-vip-benefit {
    min-height: 62px;
    padding: 11px 15px;
  }
  .ftv-vip-page .ftv-vip-plans { gap: 12px; }
  .ftv-vip-page .ftv-vip-plan { padding-inline: 17px; }
}
@media (min-width: 1600px) {
  .ftv-vip-page .ftv-vip-container {
    width: min(calc(100% - 84px), 1580px);
  }
}
@media (max-width: 700px) {
  .ftv-vip-page {
    padding-block-start: 9px;
    padding-block-end: 5rem;
  }
  .ftv-vip-page .ftv-vip-container { width: calc(100% - 20px); }
  .ftv-vip-page .ftv-vip-hero {
    padding: 15px 14px;
    margin-block-end: 17px;
    border-radius: 12px;
  }
  .ftv-vip-page .ftv-vip-eyebrow { margin-bottom: 5px; }
  .ftv-vip-page .ftv-vip-hero h1 {
    font-size: clamp(23px, 6.3vw, 28px);
    line-height: 1.3;
    margin-bottom: 6px;
  }
  .ftv-vip-page .ftv-vip-hero p {
    font-size: 12px;
    line-height: 1.6;
  }
  .ftv-vip-page .ftv-vip-current {
    margin-block-start: 9px;
    padding: 7px 10px;
  }
  .ftv-vip-benefits { margin-block-end: 20px; }
  .ftv-vip-benefits__heading, .ftv-vip-plans__heading {
    margin-block-end: 10px;
  }
  .ftv-vip-benefits__heading h2, .ftv-vip-plans__heading h2 {
    font-size: 19px;
  }
  .ftv-vip-benefits__heading p, .ftv-vip-plans__heading p {
    margin-block-start: 3px;
    font-size: 11px;
  }
  .ftv-vip-benefits__grid { gap: 7px; }
  .ftv-vip-benefit {
    display: flex;
    flex-direction: row;
    align-items: center;
    gap: 8px;
    min-height: 62px;
    padding: 9px 10px;
    border-radius: 9px;
    font-size: 11.5px;
    line-height: 1.5;
  }
  .ftv-vip-benefit__icon {
    flex: 0 0 22px;
    width: 22px;
    height: 22px;
  }
  .ftv-vip-benefit__icon svg { width: 19px; height: 19px; }
  .ftv-vip-page .ftv-vip-plans { gap: 8px; }
  .ftv-vip-page .ftv-vip-plan {
    padding: 13px 13px;
    border-radius: 10px;
  }
  .ftv-vip-page .ftv-vip-plan h2 { font-size: 16px; }
  .ftv-vip-page .ftv-vip-plan__price { margin-block: 8px 10px; }
  .ftv-vip-page .ftv-offer-price__value { font-size: 26px; }
  .ftv-vip-page .ftv-vip-plan-features li {
    font-size: 12px;
    line-height: 1.55;
    padding-block: 3px;
  }
  .ftv-vip-page .ftv-vip-plan ul { margin-block-end: 10px; }
  .ftv-vip-page .ftv-vip-contact > summary { min-height: 42px; }
}
@media (max-width: 360px) {
  .ftv-vip-benefit { font-size: 10.5px; padding-inline: 8px; }
}

/* FTV VIP polish v3: title and description aligned in RTL */
.ftv-vip-page .ftv-vip-benefits__heading {
  display: flex;
  flex-direction: column;
  justify-content: flex-start;
  align-items: flex-start;
  gap: 5px;
  direction: rtl;
}
.ftv-vip-page .ftv-vip-benefits__heading p {
  margin: 0;
  text-align: right;
}
@media(min-width: 1000px) {
  .ftv-vip-page .ftv-vip-benefits__grid { grid-template-columns: repeat(4, minmax(0, 1fr)); }
}

/* 5TV VIP heading polish v4 */
.ftv-vip-page .ftv-vip-plans__heading {
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  justify-content: flex-start;
  gap: 6px;
  direction: rtl;
}
.ftv-vip-page .ftv-vip-plans__heading p {
  margin: 0;
  text-align: right;
  max-width: 100%;
}
@media(max-width:700px) {
  .ftv-vip-page .ftv-vip-plans__heading { gap: 4px; }
}

/* BEGIN 5TV VIP v6 compact refinement — scoped UI only */
@media (min-width: 801px) {
  .ftv-vip-page .ftv-vip-hero {
    padding: 23px 30px;
    margin-block-end: 24px;
  }
  .ftv-vip-page .ftv-vip-hero h1 {
    font-size: clamp(30px, 2.45vw, 39px);
    line-height: 1.28;
    margin-block-end: 5px;
  }
  .ftv-vip-page .ftv-vip-hero p { line-height: 1.6; }
  .ftv-vip-page .ftv-vip-current { margin-block-start: 11px; padding: 7px 11px; }
  .ftv-vip-benefits { margin-block-end: 23px; }
  .ftv-vip-benefits__grid { gap: 9px 11px; }
  .ftv-vip-benefit { min-height: 57px; padding: 10px 14px; border-radius: 10px; }
  .ftv-vip-page .ftv-vip-plans { gap: 12px; }
  .ftv-vip-page .ftv-vip-plan {
    display: flex; flex-direction: column;
    padding: 20px 17px 15px;
    border-radius: 12px;
  }
  .ftv-vip-page .ftv-vip-plan__price { margin-block: 9px 12px; }
  .ftv-vip-page .ftv-offer-price__value { font-size: clamp(25px, 1.9vw, 31px); }
  .ftv-vip-page .ftv-vip-plan__renewal-note {
    margin-block: 10px 16px;
    font-size: 12px;
    color: var(--text-muted,#a4a8ae);
    line-height: 1.65;
  }
  .ftv-vip-page .ftv-vip-plan__action { margin-block-start: auto; }
  .ftv-vip-page .ftv-vip-plan.is-permanent { border-width: 1px; }
  .ftv-vip-page .ftv-vip-plan__permanent-badge { font-size: 11px; }
}
@media (max-width: 800px) {
  .ftv-vip-page .ftv-vip-hero { padding: 17px 15px; margin-block-end: 18px; }
  .ftv-vip-page .ftv-vip-hero h1 { line-height: 1.3; }
  .ftv-vip-benefits { margin-block-end: 18px; }
  .ftv-vip-page .ftv-vip-plan { display: flex; flex-direction: column; }
  .ftv-vip-page .ftv-vip-plan__action { margin-block-start: auto; }
}
@media (max-width: 700px) {
  .ftv-vip-page .ftv-vip-hero { padding: 14px 13px; margin-block-end: 16px; }
  .ftv-vip-page .ftv-vip-hero h1 { font-size: clamp(23px, 6.2vw, 27px); margin-bottom: 5px; }
  .ftv-vip-page .ftv-vip-hero p { line-height: 1.55; }
  .ftv-vip-benefits__grid { gap: 7px; }
  .ftv-vip-benefit { min-height: 56px; padding: 8px 9px; gap: 7px; }
  .ftv-vip-page .ftv-vip-plans { gap: 8px; }
  .ftv-vip-page .ftv-vip-plan { padding: 13px 14px; }
  .ftv-vip-page .ftv-vip-plan__price { margin-block: 8px 9px; }
  .ftv-vip-page .ftv-vip-plan__renewal-note {
    font-size: 12px; margin: 4px 0 9px; color: var(--text-muted,#a4a8ae);
  }
  .ftv-vip-page .ftv-vip-contact > summary { min-height: 42px; }
}
/* END 5TV VIP v6 compact refinement */

/* FTV_VIP_CONTACT_LOGIN_GATE_V1: guest login CTA, matching the existing dropdown */
.ftv-vip-page .ftv-vip-contact-login {
    display:flex;align-items:center;justify-content:space-between;gap:8px;
    box-sizing:border-box;width:100%;min-height:48px;padding:10px 12px;
    border:1px solid #f2bd4650;border-radius:10px;background:#f2bd4610;
    color:#f4c65d!important;font-family:inherit;font-size:13px;font-weight:700;
    line-height:1.6;text-align:right;text-decoration:none!important;direction:rtl;
}
.ftv-vip-page .ftv-vip-contact-login small {
    display:inline;font-size:11px;font-weight:400;color:#d0bd91;
}
.ftv-vip-page .ftv-vip-contact-login svg {flex-shrink:0}
.ftv-vip-page .ftv-vip-contact-login:hover {background:#f2bd4620}
.ftv-vip-page .ftv-vip-contact-login:focus-visible {outline:2px solid #f2bd46;outline-offset:3px}
