:root {
    --public-navy: #062f6d;
    --public-blue: #2563eb;
    --public-teal: #0f766e;
    --public-bg: #f5f8fc;
    --public-text: #0f1f44;
    --public-muted: #64748b;
    --public-line: #dce5f0;
}

body.payment-public-body {
    margin: 0;
    background: radial-gradient(circle at top right, rgba(37,99,235,.07), transparent 28rem), var(--public-bg);
    color: var(--public-text);
    font-family: "Cairo", "Segoe UI", Tahoma, Arial, sans-serif;
}

.payment-public-shell {
    min-height: 100vh;
    display: flex;
    flex-direction: column;
}

.payment-public-topbar {
    width: min(1480px, calc(100% - 32px));
    min-height: 82px;
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 18px;
    margin: 18px auto 0;
    padding: 12px 18px;
    border: 1px solid rgba(220,229,240,.92);
    border-radius: 22px;
    background: rgba(255,255,255,.96);
    box-shadow: 0 18px 45px rgba(15,31,68,.08);
}

.payment-public-brand {
    display: inline-flex;
    align-items: center;
}

    .payment-public-brand img {
        width: auto;
        height: 54px;
        max-width: min(290px, 42vw);
        object-fit: contain;
    }

.payment-public-actions {
    display: flex;
    align-items: center;
    gap: 10px;
}

.payment-public-home-link,
.payment-public-security {
    min-height: 42px;
    display: inline-flex;
    align-items: center;
    gap: 7px;
    padding: 8px 13px;
    border-radius: 999px;
    font-size: 12px;
    font-weight: 800;
}

.payment-public-home-link {
    border: 1px solid var(--public-line);
    background: #fff;
    color: var(--public-navy);
    text-decoration: none;
}

.payment-public-security {
    border: 1px solid rgba(15,118,110,.20);
    background: #ecfdf5;
    color: #0f766e;
}

.payment-public-content {
    flex: 1;
    width: min(1480px, calc(100% - 32px));
    margin: 0 auto;
    padding: 15px 0 34px;
}

/* لا نضيف Hero هنا.
   الـHome View عندك فيه Hero أصلاً. */

.payment-public-footer {
    width: min(1480px, calc(100% - 32px));
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 16px;
    margin: 0 auto 18px;
    padding: 16px 20px;
    border: 1px solid var(--public-line);
    border-radius: 18px;
    background: #fff;
    color: var(--public-muted);
    font-size: 11.5px;
}

    .payment-public-footer a {
        color: var(--public-blue);
        font-weight: 800;
        text-decoration: none;
    }

.payment-footer-security {
    display: inline-flex;
    align-items: center;
    gap: 7px;
    color: var(--public-teal);
    font-weight: 800;
}

@media (max-width: 767.98px) {

    .payment-public-topbar,
    .payment-public-content,
    .payment-public-footer {
        width: calc(100% - 20px);
    }

    .payment-public-topbar {
        margin-top: 10px;
        padding-inline: 13px;
    }

    .payment-public-brand img {
        height: 44px;
    }

    .payment-public-security span,
    .payment-public-home-link span {
        display: none;
    }

    .payment-public-security,
    .payment-public-home-link {
        width: 40px;
        min-height: 40px;
        justify-content: center;
        padding: 0;
    }

    .payment-public-footer {
        flex-direction: column;
        text-align: center;
    }
}

/* كومنت | 03-11-2026 | كومنت: تنسيق إشعارات الدعم للمستخدم دون تغيير تنسيق أزرار الدفع. */
.support-user-notification-link { min-height:42px; display:inline-flex; align-items:center; gap:7px; padding:.35rem .7rem; border:1px solid #dbe5f1; border-radius:999px; background:#fff; color:var(--public-navy,#073a79); text-decoration:none; font-size:.82rem; font-weight:800; transition:.15s ease; }
.support-user-notification-link:hover { border-color:#93c5fd; background:#eff6ff; color:var(--public-blue,#0d6efd); }
.support-user-notification-icon { width:27px; height:27px; display:inline-flex; align-items:center; justify-content:center; border-radius:50%; background:#eff6ff; color:var(--public-blue,#0d6efd); font-size:.95rem; }
.support-user-notification-count { min-width:22px; height:22px; display:inline-flex; align-items:center; justify-content:center; padding:0 6px; border:2px solid #fff; border-radius:999px; background:#dc3545; color:#fff; font-size:.7rem; font-weight:800; line-height:1; }
@media(max-width:767.98px) { .support-user-notification-label { display:none; } .support-user-notification-link { width:40px; min-height:40px; padding:0; justify-content:center; } }

/* المطور: كومنت | تاريخ التعديل: 2026-11-09 | شارة الإشعارات فوق كلمة صفحتي دون إضافة زر مستقل. */
.payment-public-actions .special-my-page-label .support-user-notification-count {
    position: absolute;
    top: -17px;
    right: 50%;
    transform: translateX(50%);
    z-index: 2;
    box-shadow: 0 2px 6px rgba(0,0,0,.18);
}
