/* صفحات پروفایل (عکس‌های من، خرید سکه)؛ روی ph.css ساخته شده. پیشوند pf- */

.pf {
    display: grid;
    grid-template-columns: 280px minmax(0, 1fr);
    gap: 24px;
    align-items: start;
    padding-top: 24px;
}

/* ---------- کارت حساب ---------- */
.pf-card {
    position: sticky;
    top: 20px;
    display: flex;
    flex-direction: column;
    gap: 14px;
    padding: 18px;
    border-radius: var(--ph-r-lg);
    background: var(--ph-card);
    border: 1px solid var(--ph-line);
}

.pf-user {
    display: flex;
    align-items: center;
    gap: 12px;
}

.pf-avatar {
    flex: none;
    display: grid;
    place-items: center;
    width: 46px;
    height: 46px;
    border-radius: 50%;
    background: var(--ph-teal-soft);
    color: var(--ph-teal-ink);
}

    .pf-avatar svg,
    .pf-nav svg {
        width: 22px;
        height: 22px;
        fill: none;
        stroke: currentColor;
        stroke-width: 1.8;
        stroke-linecap: round;
        stroke-linejoin: round;
    }

.pf-user-text b {
    display: block;
    font-size: 15px;
    text-align: right;
    letter-spacing: .02em;
}

.pf-user-text small {
    color: var(--ph-muted);
    font-size: 12px;
}

.pf-balance {
    display: grid;
    grid-template-columns: 1fr auto;
    align-items: center;
    gap: 2px 10px;
    padding: 14px;
    border-radius: 16px;
    background: radial-gradient(240px 120px at 0% 0%, rgba(0, 172, 148, .35), transparent 70%), var(--ph-ink);
    color: #fff;
}

.pf-balance-label {
    display: flex;
    align-items: center;
    gap: 6px;
    font-size: 12.5px;
    color: #b7c2d6;
}

    .pf-balance-label img {
        width: 16px;
        height: 16px;
    }

.pf-balance b {
    grid-column: 1;
    font-size: 26px;
    line-height: 1.3;
}

    .pf-balance b small {
        font-size: 13px;
        font-weight: normal;
        color: #b7c2d6;
    }

.pf-balance-btn {
    grid-column: 2;
    grid-row: 1 / span 2;
    padding: 9px 12px;
    border-radius: 12px;
    background: var(--ph-teal);
    color: #fff !important;
    font-size: 12.5px;
    font-weight: bold;
    white-space: nowrap;
}

.pf-nav {
    display: flex;
    flex-direction: column;
    gap: 2px;
}

    .pf-nav a {
        display: flex;
        align-items: center;
        gap: 10px;
        padding: 10px 12px;
        border-radius: 12px;
        color: var(--ph-ink-2);
        font-size: 14px;
        font-weight: 500;
        transition: background .15s, color .15s;
    }

        .pf-nav a:hover {
            background: var(--ph-paper);
        }

        .pf-nav a.is-active {
            background: var(--ph-teal-soft);
            color: var(--ph-teal-ink);
            font-weight: bold;
        }

    .pf-nav svg {
        width: 20px;
        height: 20px;
    }

.pf-nav-logout {
    margin-top: 6px;
    border-top: 1px dashed var(--ph-line);
    border-radius: 0 0 12px 12px !important;
    color: #b4323d !important;
}

/* ---------- محتوای اصلی ---------- */
.pf-main {
    min-width: 0;
}

.pf-head {
    display: flex;
    align-items: flex-end;
    justify-content: space-between;
    gap: 16px;
    margin-bottom: 16px;
}

    .pf-head h1 {
        font-size: 26px;
        font-weight: bold;
    }

    .pf-head p {
        margin: 4px 0 0;
        color: var(--ph-muted);
        font-size: 14px;
    }

.pf-head-btn {
    flex: none;
    padding: 10px 16px;
    border-radius: 12px;
    background: var(--ph-teal-soft);
    color: var(--ph-teal-ink) !important;
    font-size: 13.5px;
    font-weight: bold;
}

.pf-notes {
    display: flex;
    flex-direction: column;
    gap: 8px;
    margin-bottom: 18px;
}

.pf-note {
    display: flex;
    align-items: center;
    gap: 10px;
    margin: 0;
    padding: 10px 14px;
    border-radius: 12px;
    background: var(--ph-card);
    border: 1px solid var(--ph-line);
    color: #3b475c;
    font-size: 13.5px;
    line-height: 1.8;
}

    .pf-note .ph-ico {
        width: 18px;
        height: 18px;
        color: var(--ph-muted);
    }

.pf-note--warn {
    background: #fff7ec;
    border-color: #f5dcb5;
    color: #7a4f12;
}

    .pf-note--warn .ph-ico {
        color: #c27c1a;
    }

.pf-note--info {
    background: var(--ph-teal-soft);
    border-color: transparent;
    color: var(--ph-teal-ink);
}

.pf-note--error {
    margin-bottom: 14px;
    background: #fdecee;
    border-color: #f5c6cb;
    color: #b4323d;
}

.pf-note--ok {
    margin-bottom: 14px;
    background: var(--ph-teal-soft);
    border-color: transparent;
    color: var(--ph-teal-ink);
}

.pf-spin {
    flex: none;
    width: 16px;
    height: 16px;
    border-radius: 50%;
    border: 2px solid rgba(0, 128, 110, .25);
    border-top-color: var(--ph-teal-ink);
    animation: pfSpin .8s linear infinite;
}

@keyframes pfSpin {
    to { transform: rotate(360deg); }
}

/* ---------- عکس‌ها ---------- */
.pf-grid {
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(210px, 1fr));
    gap: 16px;
}

.pf-shot {
    position: relative;
    overflow: hidden;
    aspect-ratio: 4 / 5;
    border-radius: var(--ph-r-md);
    background: #1b2233;
    isolation: isolate;
}

.pf-shot-img,
.pf-shot-img img {
    display: block;
    width: 100%;
    height: 100%;
}

    .pf-shot-img img {
        object-fit: cover;
        transition: transform .5s;
    }

.pf-shot.is-done:hover .pf-shot-img img {
    transform: scale(1.04);
}

/* ویدیوها: پیش‌نمایش بی‌صدا که با رفتن ماوس پخش می‌شود */
.pf-shot-img video,
.pf-shot-img .pf-shot-poster {
    display: block;
    width: 100%;
    height: 100%;
    object-fit: cover;
    background: #0f172b;
}

.pf-shot-play {
    position: absolute;
    top: 42px;
    right: 10px;
    z-index: 3;
    display: inline-flex;
    align-items: center;
    gap: 4px;
    padding: 2px 9px;
    border-radius: 99px;
    background: rgba(15, 23, 43, .72);
    color: #fff;
    font-size: 11px;
    font-weight: bold;
}

    .pf-shot-play .ph-ico {
        width: 14px;
        height: 14px;
    }

.pf-act--video {
    background: #00806e;
}

    .pf-act--video:hover {
        background: #006b5c;
    }

.pf-shot::after {
    content: "";
    position: absolute;
    inset: 0;
    z-index: 1;
    background: linear-gradient(180deg, rgba(10, 16, 32, .35) 0%, transparent 25%, transparent 55%, rgba(10, 16, 32, .88));
    pointer-events: none;
}

.pf-shot-wait,
.pf-shot-fail {
    position: absolute;
    inset: 0;
    z-index: 2;
    display: none;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    gap: 10px;
    padding: 16px;
    color: #fff;
    text-align: center;
    font-size: 13.5px;
}

.pf-shot.is-pending .pf-shot-wait {
    display: flex;
    background: linear-gradient(160deg, #1b2640, #0f172b);
}

    .pf-shot.is-pending .pf-shot-wait .pf-spin {
        width: 34px;
        height: 34px;
        border-width: 3px;
        border-color: rgba(255, 255, 255, .2);
        border-top-color: #6ee7d3;
    }

.pf-shot.is-failed .pf-shot-fail {
    display: flex;
    background: #2a1a20;
}

    .pf-shot-fail b {
        font-size: 14px;
    }

    .pf-shot-fail span {
        color: #e5b8c0;
        font-size: 12.5px;
    }

.pf-shot-model {
    position: absolute;
    top: 10px;
    right: 10px;
    z-index: 3;
    max-width: calc(100% - 60px);
    overflow: hidden;
    padding: 2px 10px;
    border-radius: 99px;
    background: rgba(255, 255, 255, .9);
    color: var(--ph-ink);
    font-size: 11px;
    font-weight: bold;
    white-space: nowrap;
    text-overflow: ellipsis;
}

.pf-shot-del {
    position: absolute;
    top: 8px;
    left: 8px;
    z-index: 3;
    display: grid;
    place-items: center;
    width: 34px;
    height: 34px;
    border: 0;
    border-radius: 10px;
    background: rgba(15, 23, 43, .55);
    color: #fff;
    cursor: pointer;
    backdrop-filter: blur(4px);
    transition: background .15s;
}

    .pf-shot-del:hover {
        background: #c2303a;
    }

    .pf-shot-del .ph-ico {
        width: 17px;
        height: 17px;
    }

.pf-shot-foot {
    position: absolute;
    inset: auto 0 0 0;
    z-index: 3;
    display: flex;
    flex-direction: column;
    gap: 8px;
    padding: 12px;
}

.pf-shot.is-pending .pf-shot-foot,
.pf-shot.is-failed .pf-shot-actions {
    display: none;
}

.pf-shot-title {
    overflow: hidden;
    color: #fff;
    font-size: 13px;
    font-weight: bold;
    line-height: 1.6;
    display: -webkit-box;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
}

.pf-shot.is-failed .pf-shot-title {
    display: none;
}

.pf-shot-actions {
    display: flex;
    flex-wrap: wrap;
    gap: 6px;
}

/* ویرایش فقط برای عکس آماده؛ کارت در حال ساخت بعد از رسیدن نتیجه کلاس is-done می‌گیرد */
.pf-shot:not(.is-done) .pf-act--edit {
    display: none;
}

.pf-act--edit {
    background: var(--ph-blue);
}

    .pf-act--edit:hover {
        background: #2459bd;
    }

.pf-act {
    display: inline-flex;
    align-items: center;
    gap: 5px;
    height: 32px;
    padding: 0 11px;
    border: 0;
    border-radius: 10px;
    background: rgba(255, 255, 255, .16);
    color: #fff !important;
    font-family: inherit;
    font-size: 12.5px;
    font-weight: bold;
    cursor: pointer;
    backdrop-filter: blur(4px);
    transition: background .15s;
}

    .pf-act:hover {
        background: rgba(255, 255, 255, .28);
    }

    .pf-act .ph-ico {
        width: 15px;
        height: 15px;
    }

.pf-act--dl {
    background: var(--ph-teal);
}

    .pf-act--dl:hover {
        background: var(--ph-teal-ink);
    }

/* ---------- حالت خالی و مهمان ---------- */
.pf-empty,
.pf-guest {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 8px;
    padding: 48px 20px;
    border-radius: var(--ph-r-lg);
    background: var(--ph-card);
    border: 1px dashed var(--ph-line);
    text-align: center;
}

.pf-guest {
    grid-column: 1 / -1;
    max-width: 520px;
    margin: 20px auto;
    border-style: solid;
}

    .pf-empty h2,
    .pf-guest h1 {
        font-size: 19px;
        font-weight: bold;
    }

    .pf-empty p,
    .pf-guest p {
        max-width: 46ch;
        margin: 0 0 8px;
        color: var(--ph-muted);
        font-size: 14px;
        line-height: 1.9;
    }

.pf-empty-ico {
    display: grid;
    place-items: center;
    width: 60px;
    height: 60px;
    margin-bottom: 6px;
    border-radius: 18px;
    background: var(--ph-teal-soft);
    color: var(--ph-teal-ink);
}

    .pf-empty-ico .ph-ico {
        width: 28px;
        height: 28px;
    }

.pf-empty-actions {
    display: flex;
    flex-wrap: wrap;
    justify-content: center;
    gap: 8px;
}

.pf-btn {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    height: 46px;
    padding: 0 20px;
    border: 1px solid var(--ph-line);
    border-radius: 12px;
    background: var(--ph-card);
    color: var(--ph-ink) !important;
    font-family: inherit;
    font-size: 14px;
    font-weight: bold;
    cursor: pointer;
}

.pf-btn--primary {
    border-color: transparent;
    background: linear-gradient(135deg, #00b49b, #00806e);
    color: #fff !important;
}

.pf-btn--dark {
    border-color: transparent;
    background: var(--ph-ink);
    color: #fff !important;
}

/* ---------- خرید سکه ---------- */
.pf-wallet {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 20px;
    padding: 20px 22px;
    border-radius: var(--ph-r-lg);
    background: radial-gradient(420px 180px at 0% 0%, rgba(0, 172, 148, .3), transparent 70%), var(--ph-ink);
    color: #fff;
}

.pf-wallet-label {
    display: block;
    color: #b7c2d6;
    font-size: 13px;
}

.pf-wallet b {
    font-size: 32px;
    line-height: 1.3;
}

    .pf-wallet b small {
        font-size: 14px;
        font-weight: normal;
        color: #b7c2d6;
    }

.pf-wallet-msg {
    max-width: 50ch;
    padding: 10px 14px;
    border-radius: 12px;
    background: rgba(255, 255, 255, .07);
    color: #dfe6f2;
    font-size: 13.5px;
    line-height: 1.9;
}

.pf-sec {
    margin-top: 26px;
}

    .pf-sec h2 {
        margin-bottom: 12px;
        font-size: 18px;
        font-weight: bold;
    }

.pf-packs {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 14px;
}

.pf-pack {
    position: relative;
    display: flex;
    flex-direction: column;
    gap: 6px;
    padding: 20px;
    border-radius: var(--ph-r-lg);
    background: var(--ph-card);
    border: 1px solid var(--ph-line);
}

    .pf-pack.is-best {
        border: 2px solid var(--ph-teal);
        box-shadow: 0 16px 36px -22px rgba(0, 128, 110, .7);
    }

.pf-pack-flag {
    position: absolute;
    top: -12px;
    right: 18px;
    padding: 2px 12px;
    border-radius: 99px;
    background: var(--ph-teal);
    color: #fff;
    font-size: 12px;
    font-weight: bold;
}

.pf-pack-off {
    align-self: flex-start;
    padding: 1px 10px;
    border-radius: 99px;
    background: #ffece4;
    color: var(--ph-orange);
    font-size: 12px;
    font-weight: bold;
}

.pf-pack-coins {
    display: flex;
    align-items: center;
    gap: 8px;
    margin-top: 6px;
    font-size: 30px;
    font-weight: bold;
    line-height: 1.3;
}

    .pf-pack-coins .ph-ico {
        width: 26px;
        height: 26px;
        color: var(--ph-gold);
    }

    .pf-pack-coins small,
    .pf-pack-total small {
        font-size: 13px;
        font-weight: normal;
        color: var(--ph-muted);
    }

.pf-pack-unit {
    color: var(--ph-muted);
    font-size: 13px;
}

.pf-pack-total {
    margin: 6px 0 10px;
    padding-top: 10px;
    border-top: 1px dashed var(--ph-line);
    font-size: 18px;
    font-weight: bold;
}

.pf-pack .pf-btn {
    margin-top: auto;
}

.pf-custom {
    display: grid;
    grid-template-columns: minmax(0, 1fr) minmax(0, 1fr) auto;
    gap: 14px;
    align-items: end;
    padding: 20px;
    border-radius: var(--ph-r-lg);
    background: var(--ph-card);
    border: 1px solid var(--ph-line);
}

.pf-custom-field {
    display: flex;
    flex-direction: column;
    gap: 6px;
    font-size: 13px;
    font-weight: 500;
}

    .pf-custom-field input {
        width: 100%;
        height: 50px;
        padding: 0 14px;
        border-radius: 14px;
        border: 1.5px solid var(--ph-line);
        font-family: inherit;
        font-size: 16px;
        color: var(--ph-ink);
    }

        .pf-custom-field input:focus {
            outline: none;
            border-color: var(--ph-teal);
            box-shadow: 0 0 0 4px rgba(0, 172, 148, .14);
        }

.pf-custom-sum {
    display: flex;
    flex-direction: column;
    padding: 6px 14px;
    border-radius: 14px;
    background: var(--ph-paper);
}

    .pf-custom-sum span {
        color: var(--ph-muted);
        font-size: 12.5px;
    }

    .pf-custom-sum b {
        font-size: 18px;
    }

    .pf-custom-sum small {
        color: var(--ph-muted);
        font-size: 12px;
    }

.pf-custom .pf-btn {
    height: 50px;
    padding: 0 28px;
}

.pf-main > .pf-note--warn:last-child {
    margin-top: 18px;
}

/* صفحات قدیمی سفارش (در قالب جدید) */
.pf-main--legacy .ProfileMain {
    padding: 20px;
    border-radius: var(--ph-r-lg);
    background: var(--ph-card);
    border: 1px solid var(--ph-line);
}

/* ---------- تبلت و موبایل ---------- */
@media (max-width: 992px) {
    .pf {
        grid-template-columns: minmax(0, 1fr);
        gap: 16px;
        padding-top: 16px;
    }

    .pf-card {
        position: static;
        padding: 14px;
    }

    .pf-nav {
        flex-direction: row;
        overflow-x: auto;
        scrollbar-width: none;
    }

        .pf-nav::-webkit-scrollbar {
            display: none;
        }

        .pf-nav a {
            flex: none;
            padding: 8px 12px;
            font-size: 13.5px;
        }

    .pf-nav-logout {
        margin-top: 0;
        border-top: 0;
        border-radius: 12px !important;
    }

    .pf-packs {
        grid-template-columns: 1fr;
    }

    .pf-custom {
        grid-template-columns: 1fr;
    }
}

@media (max-width: 600px) {
    .pf-head {
        flex-wrap: wrap;
        align-items: center;
    }

        .pf-head h1 {
            font-size: 22px;
        }

    .pf-grid {
        grid-template-columns: repeat(2, minmax(0, 1fr));
        gap: 10px;
    }

    .pf-shot-foot {
        padding: 8px;
    }

    .pf-act {
        padding: 0 8px;
        font-size: 11.5px;
    }

    .pf-wallet {
        flex-direction: column;
        align-items: flex-start;
    }
}

@media (prefers-reduced-motion: reduce) {
    .pf-spin {
        animation-duration: 2s;
    }
}

/* ---------- پنجره عکس‌های ورودی ---------- */
.pf-inmodal {
    position: fixed;
    inset: 0;
    z-index: 1000;
    display: grid;
    place-items: center;
    padding: 16px;
}

    .pf-inmodal[hidden] {
        display: none;
    }

.pf-inmodal-back {
    position: absolute;
    inset: 0;
    background: rgba(15, 23, 43, .62);
    backdrop-filter: blur(6px);
    animation: pf-fade .2s ease;
}

.pf-inmodal-box {
    position: relative;
    display: flex;
    flex-direction: column;
    width: min(100%, calc(var(--n, 1) * 340px + 48px));
    min-width: min(100%, 420px);
    max-height: calc(100vh - 32px);
    border-radius: 26px;
    background: var(--ph-card);
    box-shadow: 0 40px 80px -30px rgba(15, 23, 43, .6);
    animation: pf-pop .25s cubic-bezier(.2, .8, .2, 1);
}

.pf-inmodal-head {
    display: flex;
    align-items: center;
    gap: 12px;
    padding: 18px 20px 14px;
    border-bottom: 1px solid var(--ph-line);
}

    .pf-inmodal-head > div {
        flex: 1;
        min-width: 0;
    }

    .pf-inmodal-head h3 {
        margin: 0;
        color: var(--ph-ink);
        font-size: 16.5px;
        font-weight: bold;
    }

    .pf-inmodal-head p {
        margin: 2px 0 0;
        color: var(--ph-muted);
        font-size: 12.5px;
    }

.pf-inmodal-ico {
    flex: none;
    display: grid;
    place-items: center;
    width: 42px;
    height: 42px;
    border-radius: 14px;
    background: var(--ph-teal-soft);
    color: var(--ph-teal-ink);
}

.pf-inmodal-x {
    flex: none;
    display: grid;
    place-items: center;
    width: 38px;
    height: 38px;
    border: 1px solid var(--ph-line);
    border-radius: 12px;
    background: #fff;
    color: var(--ph-ink);
    font-size: 22px;
    line-height: 1;
    cursor: pointer;
}

    .pf-inmodal-x:hover {
        border-color: var(--ph-ink);
    }

.pf-inmodal-grid {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(220px, 1fr));
    grid-auto-rows: max-content;
    gap: 14px;
    overflow-y: auto;
    padding: 18px 20px 22px;
}

.pf-incard {
    display: flex;
    flex-direction: column;
    margin: 0;
    overflow: hidden;
    border-radius: 18px;
    border: 1px solid var(--ph-line);
    background: var(--ph-paper);
}

    .pf-incard img,
    .pf-incard-miss {
        flex: none;
        width: 100%;
        height: min(56vh, 440px);
        object-fit: contain;
        background: repeating-conic-gradient(#eef1f6 0% 25%, #f7f9fc 0% 50%) 50% / 18px 18px;
    }

.pf-incard-miss {
    display: grid;
    place-items: center;
    padding: 20px;
    color: var(--ph-muted);
    font-size: 13px;
    text-align: center;
}

.pf-incard figcaption {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 10px;
    padding: 10px 14px;
    background: #fff;
    border-top: 1px solid var(--ph-line);
    font-size: 13px;
}

    .pf-incard figcaption span {
        font-weight: bold;
        color: var(--ph-ink);
    }

    .pf-incard figcaption a {
        color: var(--ph-teal-ink) !important;
        font-size: 12.5px;
        font-weight: bold;
    }

.pf-incard.is-result {
    border-color: var(--ph-teal);
    box-shadow: 0 0 0 3px rgba(0, 172, 148, .14);
}

    .pf-incard.is-result figcaption span {
        display: inline-flex;
        align-items: center;
        gap: 6px;
        color: var(--ph-teal-ink);
    }

        .pf-incard.is-result figcaption span::before {
            content: "";
            width: 8px;
            height: 8px;
            border-radius: 50%;
            background: var(--ph-teal);
        }

@keyframes pf-fade {
    from { opacity: 0; }
}

@keyframes pf-pop {
    from { opacity: 0; transform: translateY(14px) scale(.98); }
}

@media (max-width: 600px) {
    .pf-inmodal {
        place-items: end center;
        padding: 0;
    }

    .pf-inmodal-box {
        width: 100%;
        min-width: 0;
        max-height: 92vh;
        border-radius: 24px 24px 0 0;
    }

    .pf-inmodal-grid {
        grid-template-columns: repeat(auto-fit, minmax(140px, 1fr));
        gap: 10px;
        padding: 14px 14px calc(18px + env(safe-area-inset-bottom, 0px));
    }

    .pf-incard img,
    .pf-incard-miss {
        height: 36vh;
    }

    .pf-incard figcaption {
        flex-direction: column;
        align-items: flex-start;
        gap: 2px;
        padding: 8px 10px;
    }
}

/* ---------- کد هدیه و دعوت از دوستان ---------- */
.pf-code {
    display: grid;
    grid-template-columns: minmax(0, 1fr) auto;
    gap: 14px;
    align-items: end;
    padding: 20px;
    border-radius: var(--ph-r-lg);
    background: var(--ph-card);
    border: 1px dashed var(--ph-teal);
}

.pf-code-active {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 8px 14px;
    padding: 16px 20px;
    border-radius: var(--ph-r-lg);
    background: var(--ph-teal-soft);
    color: var(--ph-teal-ink);
    font-size: 14px;
    line-height: 1.9;
}

    .pf-code-active b[dir=ltr] {
        padding: 2px 10px;
        border-radius: 8px;
        background: #fff;
        letter-spacing: .5px;
    }

.pf-code-list {
    display: flex;
    flex-direction: column;
    gap: 8px;
    margin-top: 12px;
}

.pf-code-hint {
    margin: 8px 0 0;
    color: var(--ph-muted);
    font-size: 13px;
}

.pf-invite-banner {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 14px;
    margin-top: 26px;
    padding: 16px 20px;
    border-radius: var(--ph-r-lg);
    background: #fff7ec;
    border: 1px solid #ffe2bf;
    font-size: 14px;
    line-height: 1.9;
}

.pf-invite {
    display: grid;
    grid-template-columns: auto minmax(0, 1fr);
    gap: 14px 18px;
    align-items: end;
    margin-top: 20px;
    padding: 22px;
    border-radius: var(--ph-r-lg);
    background: var(--ph-card);
    border: 1px solid var(--ph-line);
}

.pf-invite-ico {
    display: grid;
    place-items: center;
    width: 56px;
    height: 56px;
    border-radius: 16px;
    background: var(--ph-teal-soft);
    color: var(--ph-teal-ink);
}

    .pf-invite-ico .ph-ico {
        width: 28px;
        height: 28px;
    }

.pf-invite-actions {
    grid-column: 1 / -1;
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
}

.pf-invite-code {
    grid-column: 1 / -1;
    margin: 0;
    color: var(--ph-muted);
    font-size: 13px;
}

.pf-invite-stats {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 14px;
}

    .pf-invite-stats > div {
        display: flex;
        flex-direction: column;
        gap: 4px;
        padding: 18px;
        border-radius: var(--ph-r-lg);
        background: var(--ph-card);
        border: 1px solid var(--ph-line);
    }

    .pf-invite-stats b {
        font-size: 28px;
        line-height: 1.3;
    }

    .pf-invite-stats span {
        color: var(--ph-muted);
        font-size: 13px;
    }

@media (max-width: 720px) {
    .pf-code {
        grid-template-columns: 1fr;
    }

    .pf-invite-banner {
        flex-direction: column;
        align-items: stretch;
    }

    .pf-invite-stats {
        grid-template-columns: 1fr;
    }

    .pf-invite-stats > div {
        flex-direction: row;
        align-items: baseline;
        justify-content: space-between;
    }
}

/* ---------- هدیه‌های من ---------- */
.pf-sec-link {
    margin-right: 10px;
    color: var(--ph-teal-ink);
    font-size: 13px;
    font-weight: normal;
}

.pf-rewards-total {
    display: flex;
    align-items: center;
    gap: 14px;
    margin-top: 20px;
    padding: 18px 22px;
    border-radius: var(--ph-r-lg);
    background: var(--ph-teal-soft);
    color: var(--ph-teal-ink);
    font-size: 14px;
}

    .pf-rewards-total b {
        font-size: 26px;
    }

.pf-table-wrap {
    overflow-x: auto;
    border-radius: var(--ph-r-lg);
    border: 1px solid var(--ph-line);
    background: var(--ph-card);
}

.pf-table {
    width: 100%;
    border-collapse: collapse;
    font-size: 14px;
}

    .pf-table th,
    .pf-table td {
        padding: 12px 16px;
        border-bottom: 1px solid var(--ph-line);
        text-align: right;
        white-space: nowrap;
    }

    .pf-table th {
        color: var(--ph-muted);
        font-size: 12.5px;
        font-weight: 500;
        background: rgba(15, 23, 43, .02);
    }

    .pf-table tr:last-child td {
        border-bottom: 0;
    }

    .pf-table td.pf-coins {
        color: var(--ph-teal-ink);
        font-weight: bold;
    }

.pf-tag {
    display: inline-block;
    padding: 1px 10px;
    border-radius: 99px;
    background: #eef2f7;
    color: var(--ph-ink);
    font-size: 12px;
}

    .pf-tag--muted {
        color: var(--ph-muted);
    }

    .pf-tag--ok {
        background: var(--ph-teal-soft);
        color: var(--ph-teal-ink);
    }

.pf-empty-note {
    padding: 22px;
    border-radius: var(--ph-r-lg);
    border: 1px dashed var(--ph-line);
    color: var(--ph-muted);
    font-size: 14px;
    text-align: center;
}

@media (max-width: 720px) {
    .pf-table th,
    .pf-table td {
        padding: 10px 12px;
        font-size: 13px;
    }
}

/* ---------- تخفیف کد ---------- */
.pf-discount {
    display: flex;
    align-items: center;
    gap: 16px;
    margin-top: 20px;
    padding: 16px 20px;
    border-radius: var(--ph-r-lg);
    background: linear-gradient(135deg, #fff4e6, #ffe8d6);
    border: 1px solid #ffd2a8;
    color: #7a3d00;
}

.pf-discount-badge {
    display: grid;
    place-items: center;
    flex: none;
    width: 64px;
    height: 64px;
    border-radius: 18px;
    background: var(--ph-orange, #f97316);
    color: #fff;
    font-size: 20px;
    font-weight: bold;
}

.pf-discount b {
    font-size: 16px;
}

.pf-discount p {
    margin: 4px 0 2px;
    font-size: 14px;
    line-height: 1.9;
}

    .pf-discount p b {
        font-size: 14px;
        padding: 0 6px;
        border-radius: 6px;
        background: rgba(255, 255, 255, .7);
    }

.pf-discount small {
    color: #9a5a1e;
    font-size: 12.5px;
}

.pf-discount-time {
    color: #c2410c;
    font-weight: bold;
}

.pf-old-price {
    color: var(--ph-muted);
    font-size: .8em;
    font-weight: normal;
}

/* پنجره پرامپت ویدیو در «ویدیوهای من» */
.pf-prompt-text {
    max-height: 45vh;
    overflow-y: auto;
    padding: 14px;
    border: 1px solid #e2e8f0;
    border-radius: 14px;
    background: #f8fafc;
    color: #0f172b;
    font-size: 14px;
    line-height: 2;
    text-align: right;
    white-space: pre-wrap;
    user-select: text;
}

/* انتخابگر قوی‌تر از .pmc-actions تا ترتیب لود فایل‌های CSS مهم نباشد */
.swal2-popup .swal2-actions.pmc-actions.pf-prompt-actions {
    flex-wrap: wrap;
}

    .swal2-popup .swal2-actions.pf-prompt-actions .pmc-btn {
        flex: 1 1 0;
        min-width: 0;
        white-space: nowrap;
        padding: 0 12px;
    }

    .swal2-popup .swal2-actions.pf-prompt-actions .pmc-btn--primary {
        flex: 1 1 100%;
    }
