:root {
    --pm-primary: #0d6efd;
    --pm-dark: #0b2545;
    --pm-accent: #ff7a00;
    --pm-bg: #f6f8fb;
}

html, body {
    font-family: 'Cairo', 'Segoe UI', Tahoma, sans-serif;
    background-color: var(--pm-bg);
}

a {
    color: var(--pm-primary);
    text-decoration: none;
}
a:hover { text-decoration: underline; }

h1:focus { outline: none; }

/* ---------- لمسات عامّة ---------- */
.btn { border-radius: .55rem; }
.card { border-radius: .75rem; border-color: #e7ecf3; }
.pm-navbar .navbar-brand { letter-spacing: .5px; }
.form-control, .form-select { border-radius: .5rem; }
.pagination .page-link { color: var(--pm-dark); border-radius: .4rem; margin: 0 .1rem; }
.pagination .page-item.active .page-link { background: var(--pm-primary); border-color: var(--pm-primary); }
/* تحسينات الجوال */
@media (max-width: 576px) {
    .container { padding-inline: .75rem; }
    .product-thumb { height: 150px; }
    .display-6 { font-size: 1.6rem; }
}

/* ---------- شريط التنقّل ---------- */
.pm-navbar {
    background: var(--pm-dark);
}
.pm-navbar .navbar-brand { font-weight: 700; color: #fff; }
.pm-navbar .nav-link { color: #dbe4f0 !important; }
.pm-navbar .nav-link:hover { color: #fff !important; }

.pm-cart-badge {
    background: var(--pm-accent);
    font-size: .7rem;
}

/* ---------- بطاقة المنتج ---------- */
.product-card {
    border: 1px solid #e7ecf3;
    border-radius: .75rem;
    background: #fff;
    overflow: hidden;
    transition: box-shadow .15s ease, transform .15s ease;
    height: 100%;
}
.product-card:hover { box-shadow: 0 .5rem 1.25rem rgba(11,37,69,.12); transform: translateY(-2px); }
.product-thumb {
    width: 100%; height: 190px; object-fit: cover; background: #eef2f7;
    display: flex; align-items: center; justify-content: center; color: #9bb0c7;
}
.price-now { color: var(--pm-dark); font-weight: 700; font-size: 1.15rem; }
.price-old { color: #9aa6b2; text-decoration: line-through; font-size: .9rem; }
.discount-badge {
    background: var(--pm-accent); color: #fff; border-radius: .5rem;
    padding: .1rem .5rem; font-size: .8rem; font-weight: 600;
}

/* ---------- منتج غير متوفّر ---------- */
.product-unavailable .product-thumb,
.product-unavailable .price-now,
.product-unavailable .price-old { filter: grayscale(1); opacity: .6; }
.unavailable-ribbon {
    position: absolute; top: 10px; inset-inline-start: 10px;
    background: #6c757d; color: #fff; font-size: .75rem; font-weight: 600;
    padding: .15rem .5rem; border-radius: .4rem;
}

/* ---------- فئة ---------- */
.category-tile {
    display: block; border-radius: .75rem; overflow: hidden; background: #fff;
    border: 1px solid #e7ecf3; text-align: center; padding: 1rem; height: 100%;
}
.category-tile:hover { box-shadow: 0 .4rem 1rem rgba(11,37,69,.1); text-decoration: none; }
.category-icon { width: 64px; height: 64px; object-fit: cover; border-radius: 50%; background: #eef2f7; }

/* ---------- السلايدر الرئيسي ---------- */
.hero-carousel { border-radius: 1rem; overflow: hidden; box-shadow: 0 .5rem 1.5rem rgba(11,37,69,.15); }
.hero-slide {
    min-height: 340px; color: #fff; display: flex; align-items: center;
}
/* هامش جانبي كافٍ حتى لا يتداخل النص مع أزرار التنقّل (الأسهم) */
.hero-slide-body { padding: 2.5rem 4.5rem; max-width: 640px; }
.hero-slide-body h2 { font-size: clamp(1.6rem, 4vw, 2.6rem); }
/* تصغير منطقة أزرار التنقّل وإبرازها على دائرة شبه شفافة */
.hero-carousel .carousel-control-prev,
.hero-carousel .carousel-control-next { width: 3.5rem; }
.hero-carousel .carousel-control-prev-icon,
.hero-carousel .carousel-control-next-icon {
    background-color: rgba(0,0,0,.35); border-radius: 50%; padding: 1rem;
    background-size: 50%;
}
@media (max-width: 576px) {
    .hero-slide { min-height: 240px; }
    .hero-slide-body { padding: 1.5rem 3rem; }
    .hero-carousel .carousel-control-prev,
    .hero-carousel .carousel-control-next { width: 2.5rem; }
}

/* ---------- بانر العروض ---------- */
.offer-banner {
    border-radius: 1rem; color: #fff; padding: 2.5rem 2rem; min-height: 220px;
    display: flex; flex-direction: column; justify-content: center;
    background: linear-gradient(120deg, var(--pm-dark), var(--pm-primary));
    background-size: cover; background-position: center;
}

/* ---------- لوحة التحكم ---------- */
.admin-sidebar { background: var(--pm-dark); min-height: 100vh; }
/* تثبيت الشريط الجانبي على الشاشات المتوسطة فأكبر، مع تمرير مستقل عند الحاجة */
@media (min-width: 768px) {
    .admin-sidebar {
        position: sticky;
        top: 0;
        height: 100vh;
        overflow-y: auto;
    }
}
.admin-sidebar .nav-link { color: #cdd9e8; border-radius: .4rem; }
.admin-sidebar .nav-link:hover, .admin-sidebar .nav-link.active { background: rgba(255,255,255,.12); color: #fff; }

/* ---------- قائمة افتراضية (Virtualize) ---------- */
.admin-virtual-list { height: 560px; overflow-y: auto; }
.admin-row:hover { background: #f6f8fb; }

/* ---------- ودجة الدردشة ---------- */
.pm-chat-fab {
    position: fixed; bottom: 20px; inset-inline-start: 20px; z-index: 1085;
    width: 56px; height: 56px; font-size: 1.5rem; line-height: 1;
}
/* وميض أيقونة الدردشة لتنبيه الزائر */
.pm-chat-flash { animation: pmFlash 0.6s ease-in-out 5; }
@keyframes pmFlash {
    0%   { transform: scale(1);    box-shadow: 0 0 0 0 rgba(255,122,0,.7); }
    50%  { transform: scale(1.15); box-shadow: 0 0 0 12px rgba(255,122,0,0); }
    100% { transform: scale(1);    box-shadow: 0 0 0 0 rgba(255,122,0,0); }
}
.pm-chat-panel {
    position: fixed; bottom: 88px; inset-inline-start: 20px; z-index: 1085;
    width: 330px; max-width: calc(100vw - 40px); height: 440px; max-height: 70vh;
    background: #fff; border-radius: .75rem; display: flex; flex-direction: column; overflow: hidden;
}
.pm-chat-header {
    background: var(--pm-dark); color: #fff; padding: .6rem .9rem;
    display: flex; justify-content: space-between; align-items: center; font-weight: 600;
}
.pm-chat-body { flex: 1; overflow-y: auto; padding: .75rem; background: #f6f8fb; }
.pm-chat-input { display: flex; gap: .4rem; padding: .5rem; border-top: 1px solid #e7ecf3; }
.pm-msg { margin-bottom: .5rem; display: flex; flex-direction: column; }
.pm-msg.from-me { align-items: flex-start; }
.pm-msg.from-admin { align-items: flex-end; }
.pm-msg-bubble { padding: .4rem .7rem; border-radius: .75rem; max-width: 80%; font-size: .9rem; }
.pm-msg.from-me .pm-msg-bubble { background: var(--pm-primary); color: #fff; border-bottom-inline-start-radius: .15rem; }
.pm-msg.from-admin .pm-msg-bubble { background: #e7ecf3; color: #11233f; border-bottom-inline-end-radius: .15rem; }
.pm-msg-time { font-size: .65rem; color: #9aa6b2; margin-top: .1rem; }
/* أيقونات حالة الرسالة (✓ / ✓✓) */
.msg-ticks { font-size: .8rem; letter-spacing: -3px; margin-inline-start: .25rem; }
.msg-ticks.read { color: #2196f3; }      /* أزرق: تمت القراءة */
.msg-ticks.delivered { color: #9aa6b2; } /* رمادي: تم التسليم */
.msg-ticks.sent { color: #9aa6b2; letter-spacing: normal; } /* رمادي: صحّ واحد */
/* شارة العدّاد على زر الدردشة العائم (الزر ثابت = مرجع للتموضع المطلق) */
.pm-fab-badge { position: absolute; top: -2px; inset-inline-end: -2px; font-size: .7rem; }
/* صندوق محادثة المشرف بارتفاع محدّد بالنافذة (بلا تمرير للصفحة) */
.admin-chat-body { flex: none !important; height: calc(100vh - 280px); min-height: 240px; }

/* ---------- نماذج / تحقّق ---------- */
.valid.modified:not([type=checkbox]) { outline: 1px solid #26b050; }
.invalid { outline: 1px solid #e50000; }
.validation-message { color: #e50000; font-size: .85rem; }

.blazor-error-boundary {
    background: #b32121; padding: 1rem; color: white; border-radius: .5rem;
}
.blazor-error-boundary::after { content: "حدث خطأ ما."; }