/* ====================================================================
   UAE BARCODE — MAIN STYLESHEET
   ==================================================================== */

:root {
    /* هوية باركود الإمارات (مطابقة للتطبيق والكتيّب) */
    --bx-deep: #0E4D30;   --bx-night: #08331F;  --bx-green: #00A859;
    --bx-gold: #C89B3C;   --bx-gold2: #E9CF8C;  --bx-mint: #E3F1E8;
    --bx-bg: #F6F8F5;     --bx-ink: #12261C;    --bx-muted: #5B6B62;  --bx-line: #E1E8E3;

    /* المتغيرات القديمة (تستخدمها بقية الصفحات) مربوطة بالهوية الجديدة */
    --color-primary: #0E4D30;
    --color-primary-dark: #08331F;
    --color-primary-light: #E3F1E8;
    --color-accent-red: #EF3340;
    --color-secondary: #A57A22;
    --color-secondary-light: #E9CF8C;
    --color-headline: #0E4D30;
    --color-text: #12261C;
    --color-text-muted: #5B6B62;
    --color-background: #F6F8F5;
    --color-card-bg: #FFFFFF;
    --color-border: #E1E8E3;
    --gold-gradient-dark-bg: linear-gradient(135deg, #C89B3C 0%, #E9CF8C 50%, #C89B3C 100%);
    --gold-gradient-light-bg: linear-gradient(135deg, #A57A22 0%, #C89B3C 50%, #A57A22 100%);

    --bg-main: #F6F8F5;
    --bg-card: #FFFFFF;
    --text-main: #12261C;
    --text-muted: #5B6B62;
    --border-color: #E1E8E3;
    --header-bg: #FFFFFF;
    --features-bg: #FFFFFF;
    --focus-ring: #C89B3C;

    --shadow-sm: 0 4px 15px rgba(14, 77, 48, 0.06);
    --shadow-md: 0 14px 30px rgba(14, 77, 48, 0.10);

    --radius-md: 16px;
    --radius-lg: 22px;
    --transition: all 0.25s cubic-bezier(0.16, 1, 0.3, 1);
    --font-scale: 1;
}

html[data-theme="dark"] {
    --bg-main: #0b0f17;
    --bg-card: #131a26;
    --text-main: #F8FAFC;
    --text-muted: #94A3B8;
    --border-color: rgba(255,255,255,0.08);
    --header-bg: rgba(11, 15, 23, 0.95);
    --features-bg: rgba(255, 255, 255, 0.03);
    --shadow-sm: 0 4px 20px rgba(0, 0, 0, 0.3);
    --shadow-md: 0 10px 30px rgba(0, 0, 0, 0.5);
}

body.large-text { --font-scale: 1.15; }
body.x-large-text { --font-scale: 1.30; }

/* منع الوميض عند تحميل الثيم: نص وضع افتراضي فوراً عبر سكربت صغير في head قبل هذا الملف */
* { box-sizing: border-box; }

/* شبكة أمان: أي عنصر عليه [hidden] يجب أن يختفي دائماً، حتى لو كان لصنفه قاعدة display خاصة */
[hidden] { display: none !important; }

body {
    font-size: calc(1rem * var(--font-scale));
    font-family: 'Dubai', 'Segoe UI', Tahoma, Geneva, Verdana, sans-serif;
    margin: 0; padding: 0;
    line-height: 1.7;
    color: var(--text-main);
    background-color: var(--bg-main);
    -webkit-font-smoothing: antialiased;
    transition: background-color 0.3s ease, color 0.3s ease;
}

@media (prefers-reduced-motion: reduce) {
    *, *::before, *::after {
        animation-duration: 0.001ms !important;
        animation-iteration-count: 1 !important;
        transition-duration: 0.001ms !important;
        scroll-behavior: auto !important;
    }
}

img, svg { max-width: 100%; height: auto; }
.stat-number { font-variant-numeric: tabular-nums; }
.container { width: 90%; max-width: 1280px; margin: 0 auto; }
h1, h2, h3, h4 { color: var(--text-main); margin-top: 0; }
a { text-decoration: none; color: inherit; }

a:focus-visible,
button:focus-visible,
input:focus-visible {
    outline: 3px solid var(--focus-ring);
    outline-offset: 2px;
    border-radius: 4px;
}


.cta-group { display: flex; gap: 16px; flex-wrap: wrap; margin-bottom: 30px; }
.btn-primary-lg { background-color: var(--color-primary); color: #fff; padding: 13px 32px; border-radius: 12px; font-weight: 700; font-size: 1.05rem; transition: var(--transition); }
.btn-primary-lg:hover { background-color: var(--color-primary-dark); transform: translateY(-2px); color: #fff; }
.btn-outline-lg { background-color: transparent; color: var(--color-secondary); padding: 13px 32px; border-radius: 12px; font-weight: 700; font-size: 1.05rem; border: 1.5px solid var(--color-secondary); transition: var(--transition); }
.btn-outline-lg:hover { background: var(--color-secondary); color: #fff; transform: translateY(-2px); }
html[data-theme="dark"] .btn-outline-lg { color: var(--color-secondary-light); border-color: var(--color-secondary-light); }
html[data-theme="dark"] .btn-outline-lg:hover { background: var(--color-secondary-light); color: #0b0f17; }

/* صندوق التحقق السريع — الإجراء الأساسي للزائر */
.verify-box { display: flex; align-items: stretch; background: var(--bg-card); border: 1.5px solid var(--border-color); border-radius: 14px; box-shadow: var(--shadow-sm); overflow: hidden; max-width: 480px; }
.verify-box input { flex: 1; border: none; background: transparent; padding: 14px 18px; font-family: inherit; font-size: 1rem; color: var(--text-main); }
.verify-box input:focus { outline: none; }
.verify-box button { border: none; background: var(--color-primary); color: #fff; padding: 0 22px; font-weight: 700; cursor: pointer; display: flex; align-items: center; gap: 8px; transition: var(--transition); }
.verify-box button:hover { background: var(--color-primary-dark); }
.verify-hint { font-size: 0.85rem; color: var(--text-muted); margin-top: 10px; display: flex; align-items: center; gap: 6px; }

/* ==================================== */
/* شريط المميزات السريع */
/* ==================================== */
.hero-features-bar { background: var(--features-bg); backdrop-filter: blur(10px); border-top: 1px solid var(--border-color); border-bottom: 1px solid var(--border-color); padding: 18px 0; }
.feature-pills { display: flex; flex-wrap: wrap; justify-content: center; gap: 14px 30px; }
.feature-pill { display: inline-flex; align-items: center; gap: 8px; font-size: 0.92rem; font-weight: 600; color: var(--text-muted); }
.feature-pill i { color: var(--color-primary); font-size: 1rem; }

/* ==================================== */
/* عنوان القسم (مشترك) */
/* ==================================== */
.section-header { text-align: center; margin-bottom: 55px; }
.section-title { position: relative; display: inline-block; font-size: 2.1rem; font-weight: 800; margin-bottom: 14px; padding-bottom: 14px; }
.section-title::after { content: ''; position: absolute; bottom: 0; right: 50%; transform: translateX(50%); width: 56px; height: 3px; background: var(--color-primary); border-radius: 2px; }
.section-title.on-dark::after { background: var(--gold-gradient-dark-bg); }
.section-subtitle { font-size: 1.05rem; color: var(--text-muted); max-width: 620px; margin: 0 auto; }


/* ==================================== */
/* صفحة ملف الشريك (vip-profile.php)     */
/* ==================================== */
.vip-profile-wrap { min-height: 60vh; }
.vip-cover { height: 220px; background: radial-gradient(120% 160% at 85% 0%, #1B6B45 0%, #0E4D30 50%, #08331F 100%); background-size: cover; background-position: center; }
.vip-profile-inner { margin-top: -70px; position: relative; z-index: 1; padding-bottom: 90px; }
.vip-profile-header { display: flex; align-items: flex-end; gap: 22px; margin-bottom: 40px; flex-wrap: wrap; }
.vip-profile-logo { width: 120px; height: 120px; object-fit: contain; background: #fff; border-radius: 18px; padding: 12px; border: 4px solid var(--bg-main); box-shadow: var(--shadow-md); flex-shrink: 0; }
.vip-badge-inline { margin-bottom: 10px; }
.vip-profile-heading h1 { font-size: 1.8rem; margin: 0 0 6px; }
.vip-tagline { color: var(--text-muted); margin: 0; }

.vip-profile-grid { display: grid; grid-template-columns: 2fr 1fr; gap: 30px; align-items: start; }
.vip-profile-main .result-section:first-child { border-top: none; }
.vip-contact-card { background: var(--bg-card); border: 1px solid var(--border-color); border-radius: var(--radius-lg); padding: 24px; box-shadow: var(--shadow-sm); display: flex; flex-direction: column; gap: 12px; }
.vip-contact-link { transition: var(--transition); }
.vip-contact-link:hover { color: var(--color-primary); }
.vip-side-btn { text-align: center; margin: 6px 0; }

@media (max-width: 900px) {
    .vip-profile-grid { grid-template-columns: 1fr; }
    .vip-profile-header { flex-direction: column; align-items: center; text-align: center; }
}

/* ==================================== */
/* صفحة التحقق (verify.php)              */
/* ==================================== */
.verify-hero { padding: 70px 0 90px; background: var(--bg-main); min-height: 60vh; }
.verify-box-lg { max-width: 640px; margin: 0 auto; }
.verify-box-lg input { font-size: 1.05rem; }
.verify-scan-btn { border: none; border-inline-start: 1px solid var(--border-color); background: transparent; color: var(--text-muted); width: 52px; cursor: pointer; font-size: 1.1rem; transition: var(--transition); }
.verify-scan-btn:hover { color: var(--color-primary); }
#scan-unsupported-hint { justify-content: center; text-align: center; max-width: 640px; margin: 12px auto 0; }

.verify-result { max-width: 720px; margin: 40px auto 0; }

.result-state { text-align: center; padding: 50px 20px; color: var(--text-muted); }
.result-state i { font-size: 1.8rem; display: block; margin-bottom: 14px; }
.result-loading i { color: var(--color-primary); }
.result-notfound { background: var(--bg-card); border: 1px solid var(--border-color); border-radius: var(--radius-lg); }
.result-notfound i { color: var(--color-accent-red); }
.result-notfound h3 { color: var(--text-main); margin-bottom: 8px; }
.result-notfound p { margin: 0; max-width: 420px; margin-inline: auto; }

.result-card { background: var(--bg-card); border: 1px solid var(--border-color); border-radius: var(--radius-lg); box-shadow: var(--shadow-md); padding: 30px; position: relative; overflow: hidden; }
.result-verified-badge { display: inline-flex; align-items: center; gap: 8px; background: var(--color-primary-light); color: var(--color-primary-dark); font-weight: 700; font-size: 0.85rem; padding: 6px 16px; border-radius: 20px; margin-bottom: 20px; }
html[data-theme="dark"] .result-verified-badge { background: rgba(0,115,47,0.18); color: #6fd39a; }

.result-top { display: flex; gap: 22px; align-items: flex-start; margin-bottom: 22px; flex-wrap: wrap; }
.result-image { width: 130px; height: 130px; object-fit: contain; background: #fff; border-radius: 12px; padding: 10px; border: 1px solid var(--border-color); flex-shrink: 0; }
.result-top-info { flex: 1; min-width: 200px; }
.result-top-info h2 { font-size: 1.4rem; margin-bottom: 10px; }
.result-factory, .result-meta-line { font-size: 0.95rem; color: var(--text-muted); display: flex; align-items: center; gap: 8px; margin: 0 0 6px; }
.result-factory i, .result-meta-line i { color: var(--color-primary); width: 16px; text-align: center; }

.result-section { border-top: 1px solid var(--border-color); padding-top: 18px; margin-top: 18px; }
.result-section h3 { font-size: 1.05rem; margin-bottom: 10px; }
.result-section p { color: var(--text-muted); margin: 0; line-height: 1.8; }
.result-empty-note { color: var(--text-muted); font-size: 0.92rem; margin: 0; }

.offers-list { display: flex; flex-direction: column; gap: 10px; }
.offer-row { display: flex; flex-wrap: wrap; align-items: center; gap: 6px 16px; background: var(--bg-main); border: 1px solid var(--border-color); border-radius: 10px; padding: 12px 16px; font-size: 0.92rem; }
.offer-store { font-weight: 700; color: var(--text-main); }
.offer-desc { color: var(--text-muted); }
.offer-price { margin-inline-start: auto; font-weight: 800; color: var(--color-primary-dark); }
html[data-theme="dark"] .offer-price { color: var(--color-secondary-light); }
.offer-expiry { font-size: 0.82rem; color: var(--text-muted); width: 100%; }

.scan-modal { position: fixed; inset: 0; background: rgba(0,0,0,0.85); z-index: 2000; display: none; align-items: center; justify-content: center; }
.scan-modal:not([hidden]) { display: flex; }
.scan-modal[hidden] { display: none !important; }
.scan-modal-inner { position: relative; width: 92%; max-width: 480px; background: #000; border-radius: var(--radius-lg); overflow: hidden; }
#qr-reader { width: 100%; aspect-ratio: 3/4; background: #000; }
#qr-reader video { width: 100% !important; height: 100% !important; object-fit: cover; }
.scan-modal-hint { text-align: center; color: #fff; padding: 14px; margin: 0; font-size: 0.9rem; background: rgba(0,0,0,0.5); }
.scan-modal-close { position: absolute; top: 12px; inset-inline-end: 12px; width: 36px; height: 36px; border-radius: 50%; background: rgba(255,255,255,0.15); border: none; color: #fff; cursor: pointer; z-index: 10; font-size: 1rem; }
.scan-modal-close:hover { background: rgba(255,255,255,0.3); }

@media (max-width: 640px) {
    .verify-box-lg { flex-wrap: wrap; }
    .result-top { flex-direction: column; align-items: center; text-align: center; }
    .result-factory, .result-meta-line { justify-content: center; }
    .offer-price { margin-inline-start: 0; }
}

.notice-page { padding: 60px 0 90px; min-height: 60vh; }
.notice-back-link { display: inline-flex; align-items: center; gap: 8px; color: var(--text-muted); font-weight: 600; margin-bottom: 20px; }
.notice-back-link:hover { color: var(--color-primary); }

/* ---- السجل العلني (الإعلان الكامل بكل الباركودات) ---- */
.gazette { max-width: 980px; margin: 0 auto; }
.gazette-header { text-align: center; background: var(--bg-card); border: 1px solid var(--border-color); border-radius: var(--radius-lg); overflow: hidden; box-shadow: var(--shadow-sm); margin-bottom: 30px; }
.gazette-flag-strip { display: flex; height: 6px; }
.gazette-flag-strip span { flex: 1; }
.gazette-flag-strip .c-green { background: var(--color-primary); }
.gazette-flag-strip .c-white { background: #fff; }
.gazette-flag-strip .c-black { background: #1a1a1a; }
.gazette-flag-strip .c-red { background: var(--color-accent-red); }
.gazette-title { font-size: 1.8rem; font-weight: 800; margin: 26px 20px 8px; }
.gazette-subtitle { color: var(--text-muted); margin: 0 20px 20px; }
.gazette-legal-intro { text-align: justify; line-height: 2; color: var(--text-muted); font-size: 0.92rem; max-width: 760px; margin: 0 auto 20px; padding: 0 24px; }
.gazette-contact { display: flex; gap: 26px; justify-content: center; font-size: 0.9rem; color: var(--text-muted); padding: 18px 20px; border-top: 1px solid var(--border-color); flex-wrap: wrap; }
.gazette-contact i { color: var(--color-primary); margin-left: 6px; }

.gazette-toolbar { display: flex; align-items: center; justify-content: space-between; gap: 16px; flex-wrap: wrap; margin-bottom: 16px; }
.gazette-search { display: flex; align-items: center; gap: 10px; background: var(--bg-card); border: 1px solid var(--border-color); border-radius: 10px; padding: 10px 16px; flex: 1; min-width: 240px; }
.gazette-search i { color: var(--text-muted); }
.gazette-search input { border: none; background: transparent; outline: none; font-family: inherit; font-size: 0.95rem; color: var(--text-main); width: 100%; }
.gazette-total-count { font-size: 0.85rem; color: var(--text-muted); white-space: nowrap; }

.gazette-table-wrap { background: var(--bg-card); border: 1px solid var(--border-color); border-radius: var(--radius-md); overflow-x: auto; box-shadow: var(--shadow-sm); margin-bottom: 20px; }
.gazette-table { width: 100%; border-collapse: collapse; font-size: 0.9rem; min-width: 720px; }
.gazette-table th { background: var(--bg-main); color: var(--text-muted); font-weight: 700; text-align: right; padding: 12px 14px; border-bottom: 1px solid var(--border-color); white-space: nowrap; }
.gazette-table td { padding: 12px 14px; border-bottom: 1px solid var(--border-color); vertical-align: middle; }
.gazette-table tr:last-child td { border-bottom: none; }
.gazette-barcode-cell { font-weight: 700; color: var(--color-primary-dark); }
html[data-theme="dark"] .gazette-barcode-cell { color: var(--color-secondary-light); }
.gazette-loading { text-align: center; color: var(--text-muted); padding: 30px; }
.gazette-status-badge { display: inline-block; padding: 3px 12px; border-radius: 12px; font-size: 0.78rem; font-weight: 700; }
.gazette-status-badge.notice-status-open { background: var(--color-primary-light); color: var(--color-primary-dark); }
html[data-theme="dark"] .gazette-status-badge.notice-status-open { background: rgba(0,115,47,0.18); color: #6fd39a; }
.gazette-status-badge.notice-status-closed { background: rgba(148,163,184,0.15); color: #64748B; }
.gazette-view-link { color: var(--color-primary); font-weight: 700; white-space: nowrap; }
.gazette-view-link:hover { text-decoration: underline; }

.gazette-pagination { display: flex; align-items: center; justify-content: center; gap: 20px; margin-bottom: 30px; }
.gazette-page-btn { padding: 9px 22px; font-size: 0.9rem; }
.gazette-page-btn:disabled { opacity: 0.4; cursor: not-allowed; }
.gazette-page-indicator { font-size: 0.9rem; color: var(--text-muted); }
.gazette-print-btn { display: flex; align-items: center; gap: 8px; margin: 0 auto; border: none; cursor: pointer; }

@media print {
    header, footer, .flag-strip, .header-barcode-strip, .footer-barcode-strip,
    .gazette-toolbar, .gazette-pagination, .gazette-print-btn, .top-toolbar { display: none !important; }
    .gazette-table-wrap { box-shadow: none; border: 1px solid #000; }
    body { background: #fff; color: #000; }
}

/* ==================================== */
/* صفحة الإشعار القانوني (legal-notice.php) */
/* ==================================== */
.notice-search { max-width: 560px; margin: 0 auto; }

.notice-toolbar { display: flex; align-items: center; justify-content: center; gap: 14px; flex-wrap: wrap; margin-bottom: 34px; }
.notice-download-btn { display: inline-flex; align-items: center; gap: 10px; cursor: pointer; border: none; }
.notice-download-btn:disabled { opacity: 0.6; cursor: not-allowed; }
.notice-download-hint { font-size: 0.85rem; color: var(--text-muted); }

.notice-preview-wrap { width: 100%; max-width: 1080px; margin: 0 auto; overflow: hidden; }
.notice-canvas-scale { transform-origin: top center; width: 1080px; }

.notice-disclaimer { max-width: 640px; margin: 30px auto 0; text-align: center; font-size: 0.85rem; color: var(--text-muted); }

/* ---- البطاقة المربعة نفسها (1080×1080 دائماً، بصرف النظر عن حجم الشاشة) ---- */
.notice-card {
    width: 1080px; height: 1080px;
    background: linear-gradient(160deg, #0a0f16 0%, #131a26 55%, #0a0f16 100%);
    color: #fff;
    position: relative;
    overflow: hidden;
    font-family: 'Dubai', 'Segoe UI', Tahoma, sans-serif;
    box-shadow: var(--shadow-md);
}
.notice-flag-strip { display: flex; height: 10px; width: 100%; }
.notice-flag-strip span { flex: 1; }
.notice-flag-strip .c-green { background: var(--color-primary); }
.notice-flag-strip .c-white { background: #fff; }
.notice-flag-strip .c-black { background: #1a1a1a; }
.notice-flag-strip .c-red { background: var(--color-accent-red); }

.notice-card-inner { padding: 50px 70px 40px; display: flex; flex-direction: column; align-items: center; text-align: center; height: calc(100% - 10px); }

.notice-brand-row { display: flex; align-items: center; gap: 12px; align-self: center; margin-bottom: 10px; }
.notice-logo { height: 44px; }
.notice-brand-name { font-weight: 800; font-size: 1.1rem; letter-spacing: 1px; color: #fff; }

.notice-seal { width: 74px; height: 74px; border-radius: 50%; border: 2px solid var(--color-secondary-light); display: flex; align-items: center; justify-content: center; margin: 14px auto 6px; }
.notice-seal i { font-size: 1.8rem; background: var(--gold-gradient-dark-bg); -webkit-background-clip: text; -webkit-text-fill-color: transparent; }

.notice-title { font-size: 2.1rem; font-weight: 800; line-height: 1.3; margin: 6px 0 14px; }
.notice-gold-line { width: 90px; height: 3px; background: var(--gold-gradient-dark-bg); border-radius: 2px; margin-bottom: 18px; }

.notice-status-badge { display: inline-block; padding: 6px 22px; border-radius: 20px; font-weight: 700; font-size: 0.9rem; margin-bottom: 22px; }
.notice-status-open { background: rgba(0,115,47,0.2); color: #6fd39a; border: 1px solid rgba(0,115,47,0.4); }
.notice-status-closed { background: rgba(148,163,184,0.15); color: #cbd5e1; border: 1px solid rgba(148,163,184,0.3); }

.notice-fields { width: 100%; background: rgba(255,255,255,0.04); border: 1px solid rgba(255,255,255,0.08); border-radius: 18px; padding: 22px 26px; margin-bottom: 20px; }
.notice-field { display: flex; justify-content: space-between; align-items: baseline; padding: 9px 0; border-bottom: 1px solid rgba(255,255,255,0.06); gap: 10px; }
.notice-field:last-child { border-bottom: none; }
.notice-field-row { display: flex; gap: 20px; }
.notice-field-row .notice-field { flex: 1; flex-direction: column; align-items: flex-start; gap: 4px; border-bottom: none; padding: 9px 0 0; }
.notice-field-label { color: #94a3b8; font-size: 0.85rem; }
.notice-field-value { font-weight: 700; font-size: 1rem; color: #fff; text-align: left; }
.notice-barcode-value { font-size: 1.15rem; letter-spacing: 1px; color: var(--color-secondary-light); }

.notice-legal-text { font-size: 0.85rem; line-height: 1.9; color: #cbd5e1; margin: 0 0 18px; max-width: 820px; }

.notice-contact { display: flex; gap: 26px; justify-content: center; font-size: 0.85rem; color: #94a3b8; margin-bottom: auto; flex-wrap: wrap; }
.notice-contact i { color: var(--color-secondary-light); margin-left: 6px; }

.notice-footer-row { display: flex; align-items: center; justify-content: center; gap: 18px; padding-top: 20px; border-top: 1px solid rgba(255,255,255,0.08); width: 100%; margin-top: 20px; }
.notice-qr { width: 90px; height: 90px; background: #fff; border-radius: 10px; padding: 6px; flex-shrink: 0; }
.notice-footer-text { display: flex; flex-direction: column; gap: 4px; text-align: right; }
.notice-verify-hint { font-size: 0.82rem; color: #94a3b8; }
.notice-id { font-size: 0.75rem; color: #64748B; direction: ltr; }

@media (max-width: 600px) {
    .notice-toolbar { flex-direction: column; }
}

/* ====================================================================
   الهوية الجديدة — الخط، الترويسة، الصفحة الرئيسية، صفحة المنتج، صفحة المصنع، الدخول، التذييل
   (مطابقة لتصميم «باركود الإمارات — الهوية الجديدة للموقع»)
   ==================================================================== */
@font-face { font-family: 'Dubai'; src: url('fonts/Dubai-Light.ttf') format('truetype'); font-weight: 300; font-display: swap; }
@font-face { font-family: 'Dubai'; src: url('fonts/Dubai-Regular.ttf') format('truetype'); font-weight: 400; font-display: swap; }
@font-face { font-family: 'Dubai'; src: url('fonts/Dubai-Medium.ttf') format('truetype'); font-weight: 500; font-display: swap; }
@font-face { font-family: 'Dubai'; src: url('fonts/Dubai-Bold.ttf') format('truetype'); font-weight: 600 800; font-display: swap; }

body, button, input, select, textarea { font-family: 'Dubai', Tahoma, 'Segoe UI', sans-serif; }
.bx-wrap { max-width: 1240px; margin: 0 auto; padding-inline: 24px; }
.bx-sr { position: absolute !important; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; }

/* ---------- شريط العلم ---------- */
.bx-flag { display: flex; height: 5px; }
.bx-flag i { flex: 1; }
.bx-flag .r { flex: 0 0 18%; background: #EF3340; }
.bx-flag .g { background: #00732F; }
.bx-flag .w { background: #FFFFFF; }
.bx-flag .k { background: #000000; }
.bx-flag.lg { height: 6px; }

/* ---------- الأزرار ---------- */
.bx-btn { height: 44px; padding: 0 18px; border-radius: 12px; display: inline-flex; align-items: center; justify-content: center; gap: 8px;
  font-weight: 700; font-size: 15px; border: 0; cursor: pointer; font-family: inherit; text-decoration: none; transition: background .2s, color .2s, transform .2s; white-space: nowrap; }
.bx-btn:hover { transform: translateY(-1px); }
.bx-btn-primary { background: var(--bx-deep); color: #FFFFFF; }
.bx-btn-primary:hover { background: var(--bx-night); color: #FFFFFF; }
.bx-btn-outline { background: #FFFFFF; color: var(--bx-deep); border: 1.5px solid var(--bx-deep); }
.bx-btn-outline:hover { background: var(--bx-mint); color: var(--bx-deep); }
.bx-btn-gold { background: var(--bx-gold); color: #FFFFFF; }
.bx-btn-gold:hover { background: #B38728; color: #FFFFFF; }
.bx-btn-soft { background: #FFFFFF; color: var(--bx-deep); border: 1px solid var(--bx-line); }
.bx-btn-cream { background: #FBF3E0; color: #7A5A17; }
.bx-btn-lg { height: 50px; padding: 0 24px; border-radius: 14px; font-size: 16px; }

/* ---------- الترويسة ---------- */
.bx-header { background: #FFFFFF; border-bottom: 1px solid var(--bx-line); position: sticky; top: 0; z-index: 1000; transition: box-shadow .2s; }
.bx-header .bx-hrow { display: flex; align-items: center; gap: 28px; padding-block: 14px; }
.bx-logo { display: flex; align-items: center; gap: 10px; text-decoration: none; flex: none; }
.bx-logo img { width: 50px; height: 50px; object-fit: contain; display: block; }
.bx-logo .t { display: flex; flex-direction: column; line-height: 1.15; }
.bx-logo b { font-size: 19px; color: var(--bx-deep); font-weight: 700; }
.bx-logo span { font-size: 11px; letter-spacing: 1.5px; color: var(--bx-gold); font-weight: 700; }
.bx-header .bx-nav { flex: 1; display: flex; align-items: center; min-width: 0; }
.bx-header .bx-navlist { list-style: none; margin: 0; padding: 0; display: flex; gap: 22px; flex-wrap: wrap; }
.bx-header .bx-navlink { font-size: 15px; font-weight: 500; color: #3D5247; padding-bottom: 4px; border-bottom: 2px solid transparent; position: static; }
.bx-header .bx-navlink::after { display: none; }
.bx-header .bx-navlink:hover { color: var(--bx-deep); }
.bx-header .bx-navlink.active { color: var(--bx-deep); font-weight: 700; border-bottom-color: var(--bx-gold); }
.bx-header .bx-hactions { display: flex; gap: 10px; align-items: center; flex: none; }
.bx-lang { height: 40px; min-width: 44px; padding: 0 12px; border-radius: 10px; border: 1px solid var(--bx-line); background: #FFFFFF; font-family: inherit; font-weight: 700; color: var(--bx-deep); cursor: pointer; }
.bx-mobile-only { display: none; }
.bx-header .bx-mlogin { display: none; }
.bx-header .bx-burger { display: none; width: 44px; height: 44px; border-radius: 12px; border: 1px solid var(--bx-line); background: #FFFFFF; cursor: pointer;
  flex-direction: column; justify-content: center; align-items: center; gap: 5px; padding: 0; }
.bx-header .bx-burger .bar { display: block; width: 20px; height: 2px; background: var(--bx-deep); border-radius: 2px; }
.bx-hsearch { flex: 1 1 300px; display: flex; gap: 6px; background: var(--bx-bg); border: 1px solid var(--bx-line); border-radius: 14px; padding: 5px; min-width: 0; }
.bx-hsearch input { flex: 1; min-width: 0; border: 0; background: transparent; outline: none; padding: 0 12px; font-size: 15px; color: var(--bx-ink); }
.bx-hsearch button { height: 40px; padding: 0 18px; border: 0; border-radius: 10px; background: var(--bx-deep); color: #FFFFFF; font-family: inherit; font-weight: 700; cursor: pointer; }
.nav-overlay { position: fixed; inset: 0; background: rgba(8,51,31,.45); opacity: 0; visibility: hidden; transition: opacity .2s; z-index: 999; }
.nav-overlay.active { opacity: 1; visibility: visible; }

/* ---------- عناوين الأقسام ---------- */
.bx-kicker { color: var(--bx-gold); font-weight: 700; font-size: 14px; letter-spacing: .3px; }
.bx-kicker.green { color: #00A859; }
.bx-h2 { font-size: 34px; color: var(--bx-deep); margin: 4px 0 0; line-height: 1.3; font-weight: 700; }
.bx-sub { color: var(--bx-muted); font-size: 17px; margin: 8px 0 0; line-height: 1.8; }
.bx-center { text-align: center; }

/* ---------- الصفحة الرئيسية: البطل ---------- */
.bx-hero { position: relative; overflow: hidden; color: #FFFFFF; background: radial-gradient(120% 90% at 85% 0%, #1B6B45 0%, var(--bx-deep) 48%, var(--bx-night) 100%); }
body[dir='ltr'] .bx-hero { background: radial-gradient(120% 90% at 15% 0%, #1B6B45 0%, var(--bx-deep) 48%, var(--bx-night) 100%); }
.bx-ring { position: absolute; border-radius: 50%; border-style: solid; border-color: rgba(212,175,85,.10); pointer-events: none; }
.bx-hero .bx-ring.a { width: 720px; height: 720px; border-width: 22px; inset-inline-end: -200px; top: -260px; }
.bx-hero .bx-ring.b { width: 520px; height: 520px; border-width: 18px; inset-inline-end: -100px; top: -160px; border-color: rgba(212,175,85,.08); }
.bx-hero .bx-ring.c { width: 420px; height: 420px; border-width: 16px; inset-inline-start: -180px; bottom: -220px; border-color: rgba(212,175,85,.08); }
.bx-hero-in { display: flex; flex-wrap: wrap; align-items: center; gap: 40px; padding-top: 64px; padding-bottom: 72px; position: relative; }
.bx-hero-text { flex: 1 1 520px; min-width: 0; }
.bx-pill { display: inline-flex; align-items: center; gap: 8px; padding: 6px 14px; border-radius: 999px; background: rgba(212,175,85,.16); border: 1px solid rgba(233,207,140,.45); color: var(--bx-gold2); font-size: 14px; font-weight: 500; }
.bx-hero h1 { font-size: 52px; line-height: 1.22; margin: 18px 0 14px; font-weight: 700; color: #FFFFFF; }
.bx-hero h1 em { font-style: normal; color: var(--bx-gold2); }
.bx-hero-p { font-size: 18px; line-height: 1.8; color: #CFE5D8; margin: 0 0 26px; max-width: 560px; }
.bx-search { display: flex; gap: 8px; background: #FFFFFF; padding: 8px; border-radius: 18px; max-width: 580px; box-shadow: 0 18px 40px rgba(0,0,0,.25); }
.bx-search .ic { display: flex; align-items: center; padding: 0 10px; color: var(--bx-deep); font-size: 22px; }
.bx-search input { flex: 1; min-width: 0; border: 0; outline: none; font-size: 16px; color: var(--bx-ink); background: transparent; }
.bx-search button { height: 52px; padding: 0 26px; border: 0; border-radius: 12px; background: var(--bx-gold); color: #FFFFFF; font-family: inherit; font-size: 16px; font-weight: 700; cursor: pointer; }
.bx-search button:hover { background: #B38728; }
.bx-checks { display: flex; gap: 18px; flex-wrap: wrap; margin-top: 22px; font-size: 14px; color: #CFE5D8; }
.bx-checks span { display: inline-flex; align-items: center; gap: 6px; }
.bx-checks i { color: var(--bx-gold2); }
.bx-hero-art { flex: 1 1 420px; min-width: 0; position: relative; display: flex; justify-content: center; align-items: flex-end; min-height: 520px; align-self: stretch; margin-bottom: -72px; }
.bx-hero-art .glow { position: absolute; width: 440px; height: 440px; max-width: 100%; border-radius: 50%; background: radial-gradient(circle, rgba(233,207,140,.22), rgba(233,207,140,0) 70%); bottom: 20px; }
.bx-hero-art > img { position: relative; width: 420px; max-width: 100%; height: auto; display: block; }
.bx-float-seal { position: absolute; top: 40px; inset-inline-end: 0; background: #FFFFFF; color: var(--bx-ink); border-radius: 16px; padding: 12px 14px; display: flex; gap: 10px; align-items: center; box-shadow: 0 14px 30px rgba(0,0,0,.25); }
.bx-float-seal .c { width: 40px; height: 40px; border-radius: 50%; background: var(--bx-gold2); color: var(--bx-deep); display: flex; align-items: center; justify-content: center; font-size: 18px; }
.bx-float-seal b { display: block; font-size: 15px; color: var(--bx-deep); line-height: 1.35; white-space: nowrap; }
.bx-float-seal small { font-size: 12px; color: var(--bx-muted); }
.bx-float-tag { position: absolute; bottom: 70px; inset-inline-start: 0; background: rgba(255,255,255,.12); border: 1px solid rgba(255,255,255,.25); border-radius: 14px; padding: 10px 14px; font-size: 13px; color: #FFFFFF; backdrop-filter: blur(6px); }
.bx-float-tag b { display: block; font-size: 15px; }

/* ---------- الأرقام ---------- */
.bx-stats-sec { padding-bottom: 80px; }
.bx-stats-sec .bx-head { display: flex; justify-content: space-between; align-items: flex-end; gap: 16px; flex-wrap: wrap; margin-bottom: 28px; }
.bx-stats-sec .bx-head > div { min-width: 0; }
.bx-stats-sec .bx-sub { margin: 0; max-width: 460px; font-size: 16px; }
.bx-stats-sec .section-title::after { display: none; }
.bx-stats-sec .section-title { display: block; padding: 0; }
.bx-stats-sec .bx-sub:empty { display: none; }
.bx-stats { background: #FFFFFF; border-radius: 22px; box-shadow: 0 18px 40px rgba(14,77,48,.12); display: grid; grid-template-columns: repeat(auto-fit, minmax(220px, 1fr)); }
.bx-stats .stat-card { padding: 26px 28px; display: flex; gap: 16px; align-items: center; background: none; border: 0; border-radius: 0; text-align: start; transform: none; }
.bx-stats .stat-card + .stat-card { border-inline-start: 1px solid var(--bx-line); }
.bx-stats .stat-icon { width: 54px; height: 54px; flex: none; border-radius: 16px; background: var(--bx-mint); color: var(--bx-deep); display: flex; align-items: center; justify-content: center; font-size: 24px; margin: 0; }
.bx-stats .stat-card:nth-child(3) .stat-icon { background: #FBF3E0; color: #A57A22; }
.bx-stats .stat-number { font-size: 32px; color: var(--bx-deep); line-height: 1.1; font-weight: 700; margin: 0; }
.bx-stats .stat-label { color: var(--bx-muted); font-size: 15px; margin: 0; font-weight: 400; }
.bx-stats .stat-body { display: flex; flex-direction: column; }

/* ---------- الخطوات ---------- */
.bx-steps-sec { padding-top: 80px; padding-bottom: 40px; }
.bx-steps-sec .bx-head { text-align: center; margin-bottom: 40px; }
.bx-grid3 { display: grid; grid-template-columns: repeat(auto-fit, minmax(280px, 1fr)); gap: 22px; }
.bx-step { background: #FFFFFF; border: 1px solid var(--bx-line); border-radius: 22px; padding: 30px 26px; position: relative; overflow: hidden; }
.bx-step .n { position: absolute; inset-inline-start: 22px; top: 18px; font-size: 64px; font-weight: 700; color: #EEF4F0; line-height: 1; }
.bx-ico { width: 60px; height: 60px; border-radius: 18px; background: var(--bx-deep); color: var(--bx-gold2); display: flex; align-items: center; justify-content: center; position: relative; font-size: 24px; }
.bx-step h3 { font-size: 21px; margin: 20px 0 8px; color: var(--bx-ink); }
.bx-step p { color: var(--bx-muted); font-size: 15.5px; line-height: 1.8; margin: 0; }

/* ---------- أحدث الإضافات ---------- */
.bx-latest { padding-top: 40px; padding-bottom: 80px; }
.bx-latest-head { display: flex; justify-content: space-between; align-items: flex-end; flex-wrap: wrap; gap: 16px; margin-bottom: 26px; }
.bx-tabs { display: flex; background: #FFFFFF; border: 1px solid var(--bx-line); border-radius: 14px; padding: 5px; gap: 4px; }
.bx-tabs button { height: 42px; padding: 0 20px; border: 0; border-radius: 10px; background: transparent; color: #3D5247; font-family: inherit; font-weight: 700; font-size: 15px; cursor: pointer; }
.bx-tabs button.active { background: var(--bx-deep); color: #FFFFFF; }
.bx-cards { display: grid !important; grid-template-columns: repeat(auto-fill, minmax(210px, 1fr)); gap: 18px; }
.bx-cards[hidden] { display: none !important; }
.bx-card { background: #FFFFFF; border: 1px solid var(--bx-line); border-radius: 20px; padding: 18px; display: flex; flex-direction: column; gap: 12px; color: var(--bx-ink); text-decoration: none; transition: transform .2s, box-shadow .2s; }
.bx-card:hover { transform: translateY(-4px); box-shadow: 0 14px 30px rgba(14,77,48,.10); color: var(--bx-ink); }
.bx-card img { width: 100%; aspect-ratio: 1; object-fit: contain; border-radius: 14px; background: var(--bx-bg); display: block; }
.bx-card .nm { display: flex; flex-direction: column; gap: 2px; }
.bx-card b { font-size: 15px; line-height: 1.45; }
.bx-card .meta { font-size: 13px; color: var(--bx-muted); }
.bx-card .ok { display: inline-flex; align-items: center; gap: 6px; font-size: 13px; font-weight: 700; color: #00A859; margin-top: auto; }
.bx-empty { grid-column: 1 / -1; text-align: center; padding: 30px; color: var(--bx-muted); }
.bx-more { text-align: center; margin-top: 28px; }
body[dir='ltr'] .bx-dir-ic, html[dir='ltr'] .bx-dir-ic { transform: scaleX(-1); }

/* ---------- العلامات المميزة ---------- */
.bx-vip { background: var(--bx-deep); color: #FFFFFF; position: relative; overflow: hidden; }
.bx-vip .bx-ring { width: 560px; height: 560px; border-width: 20px; border-color: rgba(212,175,85,.09); inset-inline-start: -220px; top: -260px; }
.bx-vip-in { padding-top: 80px; padding-bottom: 80px; position: relative; }
.bx-vip-head { display: flex; justify-content: space-between; align-items: flex-end; gap: 16px; flex-wrap: wrap; margin-bottom: 28px; }
.bx-vip-head .bx-kicker { color: var(--bx-gold2); display: inline-flex; gap: 6px; align-items: center; }
.bx-vip-head h2 { font-size: 34px; margin: 4px 0 0; color: #FFFFFF; }
.bx-vip-head p { color: #CFE5D8; margin: 0; max-width: 420px; font-size: 16px; }
.bx-vip-grid { display: grid; grid-template-columns: repeat(auto-fit, minmax(260px, 1fr)); gap: 18px; }
.bx-vcard { background: rgba(255,255,255,.07); border: 1px solid rgba(255,255,255,.14); border-radius: 22px; padding: 22px; display: flex; gap: 16px; align-items: center; color: #FFFFFF; text-decoration: none; transition: background .2s, transform .2s; }
.bx-vcard:hover { background: rgba(255,255,255,.12); transform: translateY(-3px); color: #FFFFFF; }
.bx-vcard .lg { width: 84px; height: 84px; border-radius: 18px; background: #FFFFFF; flex: none; display: flex; align-items: center; justify-content: center; overflow: hidden; padding: 8px; }
.bx-vcard .lg img { max-width: 100%; max-height: 100%; object-fit: contain; }
.bx-vcard b { font-size: 18px; display: block; }
.bx-vcard .tg { color: #CFE5D8; font-size: 14px; display: block; }
.bx-vcard .go { color: var(--bx-gold2); font-size: 14px; font-weight: 700; }
.bx-vip .bx-empty { color: #CFE5D8; }

/* ---------- الثقة ---------- */
.bx-trust { padding-top: 80px; padding-bottom: 80px; display: flex; flex-wrap: wrap; gap: 40px; align-items: center; }
.bx-trust-text { flex: 1 1 360px; min-width: 0; }
.bx-trust-text h2 { font-size: 36px; }
.bx-trust-text .bx-sub { margin-bottom: 24px; }
.bx-seal { display: inline-flex; align-items: center; gap: 14px; background: var(--bx-deep); color: #FFFFFF; border-radius: 18px; padding: 14px 26px 14px 20px; }
body[dir='ltr'] .bx-seal { padding: 14px 20px 14px 26px; }
.bx-seal .c { width: 50px; height: 50px; border-radius: 50%; background: var(--bx-gold2); color: var(--bx-deep); display: flex; align-items: center; justify-content: center; box-shadow: 0 0 0 7px rgba(233,207,140,.22); font-size: 22px; flex: none; }
.bx-seal b { font-size: 18px; display: block; line-height: 1.35; }
.bx-seal small { color: #CFE5D8; font-size: 13px; }
.bx-trust-grid { flex: 1.4 1 520px; min-width: 0; display: grid; grid-template-columns: repeat(auto-fit, minmax(240px, 1fr)); gap: 16px; }
.bx-tcard { background: #FFFFFF; border: 1px solid var(--bx-line); border-radius: 20px; padding: 22px; }
.bx-tcard .i { width: 46px; height: 46px; border-radius: 14px; background: var(--bx-mint); color: var(--bx-deep); display: flex; align-items: center; justify-content: center; font-size: 20px; }
.bx-tcard h3 { font-size: 18px; margin: 14px 0 6px; color: var(--bx-ink); }
.bx-tcard p { margin: 0; color: var(--bx-muted); font-size: 15px; line-height: 1.75; }

/* ---------- للمصانع ---------- */
.bx-biz { padding-bottom: 80px; }
.bx-biz-box { background: #FFFFFF; border: 1px solid var(--bx-line); border-radius: 28px; padding: 40px; display: flex; flex-wrap: wrap; gap: 30px; align-items: center; }
.bx-biz-box > div { flex: 1 1 420px; min-width: 0; }
.bx-biz-box h2 { font-size: 32px; }
.bx-biz-box .bx-sub { font-size: 16.5px; margin-bottom: 20px; }
.bx-biz-btns { display: flex; gap: 10px; flex-wrap: wrap; }
.bx-biz-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 12px; }
.bx-biz-grid div { background: var(--bx-bg); border-radius: 16px; padding: 16px; }
.bx-biz-grid b { color: var(--bx-deep); }
.bx-biz-grid p { margin: 4px 0 0; color: var(--bx-muted); font-size: 14px; }

/* ---------- التطبيق ---------- */
.bx-app { padding-bottom: 80px; }
.bx-app-box { background: radial-gradient(120% 120% at 100% 0%, #1B6B45 0%, var(--bx-deep) 55%, var(--bx-night) 100%); border-radius: 30px; color: #FFFFFF; padding: 46px 46px 0; display: flex; flex-wrap: wrap; gap: 30px; align-items: flex-end; overflow: hidden; position: relative; }
.bx-app-box .bx-ring { width: 480px; height: 480px; border-width: 18px; inset-inline-start: -140px; top: -200px; }
.bx-app-text { flex: 1 1 420px; min-width: 0; padding-bottom: 46px; position: relative; }
.bx-app-text h2 { font-size: 34px; margin: 0 0 10px; color: #FFFFFF; }
.bx-app-text p { color: #CFE5D8; font-size: 17px; line-height: 1.8; margin: 0 0 22px; }
.bx-app-row { display: flex; gap: 18px; align-items: center; flex-wrap: wrap; }
.bx-qr { background: #FFFFFF; border-radius: 16px; padding: 10px; display: flex; gap: 12px; align-items: center; }
.bx-qr img { width: 92px; height: 92px; display: block; }
.bx-qr span { color: var(--bx-deep); font-weight: 700; font-size: 14px; line-height: 1.4; padding-inline-end: 8px; }
.bx-stores { display: flex; flex-direction: column; gap: 10px; }
.bx-store { height: 46px; padding: 0 18px; border-radius: 12px; background: #FFFFFF; color: var(--bx-deep); display: inline-flex; align-items: center; gap: 8px; font-weight: 700; text-decoration: none; }
.bx-store:hover { background: var(--bx-gold2); color: var(--bx-deep); }
.bx-app-phones { flex: 1 1 360px; min-width: 0; display: flex; justify-content: center; gap: 18px; position: relative; }
.bx-app-phones img { width: 200px; max-width: 45%; border: 8px solid #0B0B0B; border-bottom: 0; border-radius: 34px 34px 0 0; display: block; }
.bx-app-phones img:first-child { margin-top: 40px; align-self: flex-end; }

/* ---------- التذييل ---------- */
.bx-footer { background: var(--bx-night); color: #CFE5D8; }
.bx-footer a { color: #CFE5D8; text-decoration: none; }
.bx-footer a:hover { color: var(--bx-gold2); }
.bx-fgrid { padding-top: 56px; padding-bottom: 30px; display: grid; grid-template-columns: repeat(auto-fit, minmax(200px, 1fr)); gap: 32px; }
.bx-fbrand { display: flex; align-items: center; gap: 10px; margin-bottom: 14px; }
.bx-fbrand img { width: 50px; height: 50px; object-fit: contain; background: #FFFFFF; border-radius: 12px; padding: 3px; }
.bx-fbrand b { font-size: 18px; color: #FFFFFF; }
.bx-fgrid p { margin: 0; font-size: 14.5px; line-height: 1.8; }
.bx-fgrid h4 { color: var(--bx-gold2); display: block; margin: 0 0 12px; font-size: 16px; }
.bx-flinks { display: flex; flex-direction: column; gap: 8px; font-size: 15px; list-style: none; margin: 0; padding: 0; }
.bx-fsocial { display: flex; gap: 8px; margin-top: 16px; }
.bx-fsocial a { width: 38px; height: 38px; border-radius: 10px; background: rgba(255,255,255,.08); display: inline-flex; align-items: center; justify-content: center; }
.bx-fbottom { padding-top: 18px; padding-bottom: 18px; border-top: 1px solid rgba(255,255,255,.1); display: flex; justify-content: space-between; flex-wrap: wrap; gap: 10px; font-size: 13px; }
.bx-fbottom .lg { display: flex; gap: 16px; flex-wrap: wrap; }

/* ---------- صفحة المنتج ---------- */
.pp-main { padding-top: 22px; padding-bottom: 70px; }
.pp-crumb { font-size: 14px; color: var(--bx-muted); margin: 0 0 18px; }
.pp-crumb a { color: var(--bx-muted); }
.pp-crumb span { color: var(--bx-ink); }
.pp-layout { display: flex; flex-wrap: wrap; gap: 26px; align-items: flex-start; }
.pp-media { flex: 1 1 420px; min-width: 0; display: flex; flex-direction: column; gap: 14px; }
.pp-imgbox { background: #FFFFFF; border: 1px solid var(--bx-line); border-radius: 26px; padding: 26px; display: flex; justify-content: center; position: relative; }
.pp-imgbox img { width: 100%; max-width: 420px; aspect-ratio: 570/710; object-fit: contain; display: block; }
.pp-made { position: absolute; top: 18px; inset-inline-start: 18px; background: var(--bx-deep); color: #FFFFFF; border-radius: 999px; padding: 6px 12px; font-size: 13px; font-weight: 700; display: inline-flex; gap: 6px; align-items: center; }
.pp-made i { color: var(--bx-gold2); }
.pp-qr { background: #FFFFFF; border: 1px solid var(--bx-line); border-radius: 22px; padding: 18px; display: flex; gap: 16px; align-items: center; }
.pp-qr .q { width: 96px; height: 96px; flex: none; display: flex; align-items: center; justify-content: center; }
.pp-qr .q img, .pp-qr .q canvas { width: 96px !important; height: 96px !important; }
.pp-qr .tx { flex: 1; } .pp-qr b { display: block; color: var(--bx-deep); font-size: 16px; } .pp-qr small { color: var(--bx-muted); font-size: 14px; }
.pp-info { flex: 1.15 1 480px; min-width: 0; display: flex; flex-direction: column; gap: 16px; }
.pp-seal { background: radial-gradient(120% 140% at 100% 0%, #1B6B45 0%, var(--bx-deep) 60%); color: #FFFFFF; border-radius: 22px; padding: 18px 20px; display: flex; gap: 14px; align-items: center; }
.pp-seal .c { width: 54px; height: 54px; border-radius: 50%; background: var(--bx-gold2); color: var(--bx-deep); display: flex; align-items: center; justify-content: center; box-shadow: 0 0 0 7px rgba(233,207,140,.2); flex: none; font-size: 24px; }
.pp-seal b { font-size: 20px; display: block; } .pp-seal small { color: #CFE5D8; font-size: 14px; }
.pp-seal.bad { background: #8F1D1D; } .pp-seal.bad .c { background: #FDECEC; color: #B91C1C; box-shadow: 0 0 0 7px rgba(253,236,236,.15); }
.pp-title { font-size: 32px; line-height: 1.4; margin: 4px 0 2px; color: var(--bx-ink); }
.pp-fac { background: #FFFFFF; border: 1px solid var(--bx-line); border-radius: 18px; padding: 12px 14px; display: flex; align-items: center; gap: 12px; color: var(--bx-ink); text-decoration: none; }
.pp-fac img { width: 50px; height: 50px; border-radius: 12px; object-fit: contain; background: var(--bx-bg); }
.pp-fac .nm { flex: 1; line-height: 1.35; min-width: 0; } .pp-fac .nm small { font-size: 13px; color: var(--bx-muted); } .pp-fac .nm b { display: block; font-size: 16px; }
.pp-follow { height: 40px; padding: 0 16px; border-radius: 12px; background: var(--bx-mint); color: var(--bx-deep); display: inline-flex; align-items: center; gap: 6px; font-weight: 700; font-size: 14px; flex: none; }
.pp-table { background: #FFFFFF; border: 1px solid var(--bx-line); border-radius: 20px; padding: 6px 20px; }
.pp-row { display: flex; justify-content: space-between; gap: 16px; padding: 14px 0; border-bottom: 1px solid #EEF2EF; }
.pp-row:last-child { border-bottom: 0; } .pp-row > span { color: var(--bx-muted); } .pp-row b { text-align: end; }
.pp-tabs { background: #FFFFFF; border: 1px solid var(--bx-line); border-radius: 20px; overflow: hidden; }
.pp-tabs [role=tablist] { display: flex; border-bottom: 1px solid var(--bx-line); }
.pp-tabs [role=tab] { flex: 1; height: 50px; border: 0; background: var(--bx-bg); font-family: inherit; font-weight: 700; font-size: 15px; color: var(--bx-muted); cursor: pointer; border-bottom: 3px solid transparent; }
.pp-tabs [role=tab][aria-selected=true] { background: #FFFFFF; border-bottom-color: var(--bx-gold); color: var(--bx-deep); }
.pp-tabs [role=tabpanel] { margin: 0; padding: 18px 20px; color: #3D5247; font-size: 16px; line-height: 1.9; white-space: pre-line; }
.pp-actions { display: flex; gap: 10px; flex-wrap: wrap; }
.pp-actions .bx-btn { height: 48px; border-radius: 14px; }
.pp-report { color: #8A6100 !important; }
.pp-sec { margin-top: 36px; background: #FFFFFF; border: 1px solid var(--bx-line); border-radius: 24px; padding: 24px; }
.pp-sec-head { display: flex; justify-content: space-between; align-items: center; flex-wrap: wrap; gap: 10px; margin-bottom: 14px; }
.pp-sec-head h2 { margin: 0; font-size: 22px; color: var(--bx-deep); }
.pp-sec-head span { font-size: 14px; color: var(--bx-muted); }
.pp-noffer { display: flex; gap: 14px; align-items: center; background: var(--bx-bg); border-radius: 16px; padding: 18px; color: var(--bx-muted); }
.pp-noffer i { color: var(--bx-gold); font-size: 22px; }
.pp-offer { display: flex; flex-wrap: wrap; align-items: center; gap: 8px 16px; background: var(--bx-bg); border-radius: 16px; padding: 14px 18px; margin-bottom: 10px; }
.pp-offer b { color: var(--bx-ink); } .pp-offer .pr { margin-inline-start: auto; font-weight: 700; color: var(--bx-deep); font-size: 18px; }
.pp-offer small { color: var(--bx-muted); width: 100%; }
.pp-more { margin-top: 26px; }
.pp-more-head { display: flex; justify-content: space-between; align-items: flex-end; margin-bottom: 14px; }
.pp-more-head h2 { margin: 0; font-size: 22px; color: var(--bx-deep); }
.pp-more-head a { font-weight: 700; font-size: 15px; color: var(--bx-deep); }
.pp-more .bx-cards { grid-template-columns: repeat(auto-fill, minmax(220px, 1fr)); gap: 16px; }
.pp-more .bx-card { padding: 14px; gap: 10px; }
.pp-why { background: #FFFFFF; border: 1px solid var(--bx-line); border-radius: 20px; padding: 20px; }
.pp-why h3 { margin: 0 0 10px; color: var(--bx-deep); font-size: 18px; }
.pp-why ul { margin: 0 0 14px; padding-inline-start: 20px; color: #3D5247; line-height: 2; }
.pp-warn { margin-top: 14px; padding: 14px 16px; border-radius: 14px; background: #FFF4D6; color: #8A6100; line-height: 1.7; }
.pp-warn strong { display: block; margin-bottom: 4px; }
.pp-footer-note { background: var(--bx-night); color: #CFE5D8; padding: 22px 24px; text-align: center; font-size: 14px; }

/* ---------- صفحة المصنع ---------- */
.fp-cover { height: 220px; position: relative; overflow: hidden; background: radial-gradient(120% 160% at 85% 0%, #1B6B45 0%, var(--bx-deep) 50%, var(--bx-night) 100%); }
.fp-cover .bx-ring.a { width: 520px; height: 520px; border-width: 20px; inset-inline-end: -120px; top: -260px; }
.fp-cover .bx-ring.b { width: 340px; height: 340px; border-width: 16px; inset-inline-start: 10%; top: 60px; border-color: rgba(212,175,85,.08); }
.fp-main { margin-top: -90px; padding-bottom: 70px; position: relative; }
.fp-head { background: #FFFFFF; border: 1px solid var(--bx-line); border-radius: 26px; padding: 24px; display: flex; flex-wrap: wrap; gap: 24px; align-items: center; box-shadow: 0 16px 36px rgba(14,77,48,.10); }
.fp-logo { width: 140px; height: 140px; border-radius: 26px; object-fit: contain; background: #FFFFFF; border: 5px solid #FFFFFF; box-shadow: 0 8px 22px rgba(0,0,0,.15); display: flex; align-items: center; justify-content: center; font-size: 44px; color: var(--bx-deep); flex: none; }
.fp-id { flex: 1 1 360px; min-width: 0; }
.fp-badge { display: inline-flex; gap: 6px; align-items: center; background: var(--bx-mint); color: var(--bx-deep); border-radius: 999px; padding: 4px 12px; font-size: 13px; font-weight: 700; }
.fp-id h1 { font-size: 30px; margin: 8px 0 4px; color: var(--bx-ink); line-height: 1.35; }
.fp-meta { margin: 0; color: var(--bx-muted); font-size: 16px; display: flex; gap: 16px; flex-wrap: wrap; }
.fp-meta span { display: inline-flex; gap: 6px; align-items: center; }
.fp-acts { display: flex; gap: 10px; flex-wrap: wrap; }
.fp-acts .bx-btn { height: 48px; border-radius: 14px; }
.fp-stats { display: grid; grid-template-columns: repeat(auto-fit, minmax(180px, 1fr)); gap: 14px; margin-top: 18px; }
.fp-stat { background: #FFFFFF; border: 1px solid var(--bx-line); border-radius: 18px; padding: 18px; }
.fp-stat b { font-size: 28px; color: var(--bx-deep); display: block; line-height: 1.2; }
.fp-stat span { color: var(--bx-muted); }
.fp-stat.gold { background: #FBF3E0; border-color: #F1E2BC; }
.fp-stat.gold b { font-size: 18px; color: #7A5A17; } .fp-stat.gold span { color: #7A5A17; }
.fp-body { display: flex; flex-wrap: wrap; gap: 22px; margin-top: 26px; align-items: flex-start; }
.fp-products { flex: 2.2 1 560px; min-width: 0; }
.fp-phead { display: flex; justify-content: space-between; align-items: center; flex-wrap: wrap; gap: 10px; margin-bottom: 14px; }
.fp-phead h2 { margin: 0; font-size: 24px; color: var(--bx-deep); }
.fp-psearch { display: flex; background: #FFFFFF; border: 1px solid var(--bx-line); border-radius: 12px; padding: 4px; }
.fp-psearch input { border: 0; outline: none; background: transparent; padding: 0 12px; height: 38px; font-size: 14px; width: 220px; }
.fp-products .bx-cards { grid-template-columns: repeat(auto-fill, minmax(200px, 1fr)); gap: 14px; }
.fp-products .bx-card { padding: 14px; gap: 8px; }
.fp-products .bx-card .meta { font-size: 12.5px; }
.fp-side { flex: 1 1 300px; min-width: 0; display: flex; flex-direction: column; gap: 14px; }
.fp-box { background: #FFFFFF; border: 1px solid var(--bx-line); border-radius: 20px; padding: 20px; display: flex; flex-direction: column; gap: 10px; }
.fp-box h3 { margin: 0; color: var(--bx-deep); font-size: 18px; }
.fp-box p { margin: 0; color: #3D5247; line-height: 1.85; font-size: 15px; white-space: pre-line; }
.fp-box .ln { color: #3D5247; display: flex; gap: 8px; align-items: center; } .fp-box .ln i { color: var(--bx-gold); width: 16px; }
.fp-map { height: 180px; border-radius: 14px; background: var(--bx-mint); color: var(--bx-muted); display: flex; align-items: center; justify-content: center; font-size: 14px; overflow: hidden; }
.fp-map iframe { width: 100%; height: 100%; border: 0; }

/* ---------- الدخول والتسجيل ---------- */
.au-page { display: flex; flex-wrap: wrap; min-height: 100vh; background: var(--bx-bg); }
.au-form-side { flex: 1 1 520px; min-width: 0; display: flex; flex-direction: column; padding: 32px 48px; }
.au-center { flex: 1; display: flex; align-items: center; justify-content: center; padding: 40px 0; }
.au-box { width: 100%; max-width: 440px; display: flex; flex-direction: column; gap: 18px; }
.au-box h1 { font-size: 32px; margin: 0 0 6px; color: var(--bx-deep); line-height: 1.3; }
.au-box > div > p { margin: 0; color: var(--bx-muted); font-size: 16px; }
.au-tabs { display: flex; background: #FFFFFF; border: 1px solid var(--bx-line); border-radius: 14px; padding: 5px; gap: 4px; }
.au-tabs a, .au-tabs button { flex: 1; height: 44px; border: 0; border-radius: 10px; background: transparent; color: #3D5247; font-family: inherit; font-weight: 700; font-size: 15px; display: flex; align-items: center; justify-content: center; cursor: pointer; text-decoration: none; }
.au-tabs .on { background: var(--bx-deep); color: #FFFFFF; }
.au-field { display: flex; flex-direction: column; gap: 6px; }
.au-field label { font-weight: 700; font-size: 15px; color: var(--bx-ink); }
.au-field input, .au-field select { height: 52px; border: 1px solid #D5DED8; border-radius: 14px; padding: 0 16px; font-size: 16px; background: #FFFFFF; color: var(--bx-ink); width: 100%; box-sizing: border-box; }
.au-field input:focus, .au-field select:focus { outline: none; border-color: var(--bx-deep); box-shadow: 0 0 0 3px rgba(14,77,48,.12); }
.au-row { display: flex; justify-content: space-between; align-items: center; gap: 10px; }
.au-row a { font-size: 14px; color: #A57A22; font-weight: 700; }
.au-check { display: flex; gap: 8px; align-items: center; font-size: 15px; color: #3D5247; }
.au-check input { width: 18px; height: 18px; accent-color: var(--bx-deep); }
.au-submit { height: 54px; border: 0; border-radius: 14px; background: var(--bx-deep); color: #FFFFFF; font-family: inherit; font-size: 17px; font-weight: 700; cursor: pointer; width: 100%; }
.au-submit:hover { background: var(--bx-night); }
.au-note { text-align: center; margin: 0; color: var(--bx-muted); }
.au-note a { font-weight: 700; color: var(--bx-deep); }
.au-gift { display: flex; gap: 10px; align-items: center; background: #FBF3E0; border-radius: 14px; padding: 12px 14px; color: #7A5A17; font-size: 14px; }
.au-copy { margin: 0; color: #7C8B83; font-size: 13px; }
.au-aside { flex: 1 1 520px; min-width: 0; background: radial-gradient(120% 100% at 100% 0%, #1B6B45 0%, var(--bx-deep) 50%, var(--bx-night) 100%); color: #FFFFFF; position: relative; overflow: hidden; padding: 56px 52px 0; display: flex; flex-direction: column; }
.au-aside .bx-ring { width: 620px; height: 620px; border-width: 22px; inset-inline-end: -240px; top: -240px; }
.au-aside .vflag { position: absolute; top: 0; bottom: 0; inset-inline-end: 0; width: 12px; display: flex; flex-direction: column; }
.au-aside .vflag i { flex: 1; }
.au-aside .in { position: relative; }
.au-aside h2 { font-size: 34px; line-height: 1.35; margin: 8px 0 22px; color: #FFFFFF; }
.au-aside .li { display: flex; flex-direction: column; gap: 14px; font-size: 16px; }
.au-aside .li span { display: flex; gap: 12px; align-items: center; }
.au-aside .li i { width: 34px; height: 34px; border-radius: 10px; background: rgba(233,207,140,.18); color: var(--bx-gold2); display: flex; align-items: center; justify-content: center; font-size: 15px; }
.au-aside .ph { flex: 1; display: flex; justify-content: center; align-items: flex-end; margin-top: 30px; position: relative; }
.au-aside .ph img { width: 270px; border: 9px solid #0B0B0B; border-bottom: 0; border-radius: 40px 40px 0 0; display: block; }
.au-msg { padding: 12px 14px; border-radius: 12px; font-size: 14.5px; }
.au-msg.err { background: #FDECEC; color: #B91C1C; } .au-msg.ok { background: var(--bx-mint); color: var(--bx-deep); }

/* ---------- عام للصفحات الداخلية (من نحن، تواصل، كيف تعمل، المنتجات...) ---------- */
.bx-page-hero { position: relative; overflow: hidden; color: #FFFFFF; background: radial-gradient(120% 160% at 85% 0%, #1B6B45 0%, var(--bx-deep) 50%, var(--bx-night) 100%); padding: 56px 0 64px; text-align: center; }
.bx-page-hero .bx-ring { width: 520px; height: 520px; border-width: 20px; inset-inline-end: -160px; top: -260px; }
.bx-page-hero h1 { color: #FFFFFF; font-size: 40px; margin: 10px 0 8px; position: relative; }
.bx-page-hero p { color: #CFE5D8; font-size: 17px; margin: 0 auto; max-width: 640px; position: relative; }

/* ---------- الجوال ---------- */
@media (max-width: 1100px) {
  .bx-header .bx-navlist { gap: 16px; }
  .bx-header .bx-hrow { gap: 18px; }
}
@media (max-width: 980px) {
  .bx-header .bx-burger { display: flex; }
  .bx-header .bx-nav { display: none; position: absolute; top: 100%; inset-inline: 0; background: #FFFFFF; border-bottom: 1px solid var(--bx-line); box-shadow: 0 18px 30px rgba(14,77,48,.12); padding: 18px 24px 22px; flex-direction: column; align-items: stretch; gap: 14px; z-index: 1001; }
  .bx-header .bx-nav.active { display: flex; }
  .bx-header .bx-navlist { flex-direction: column; gap: 4px; }
  .bx-header .bx-navlink { display: block; padding: 10px 4px; border-bottom: 1px solid #EEF2EF; }
  .bx-header .bx-navlink.active { border-bottom-color: var(--bx-gold); }
  .bx-header .bx-mlogin { display: flex; flex-direction: column; gap: 8px; }
  .bx-mobile-only { display: list-item; list-style: none; }
  .bx-header .bx-hactions .bx-btn { display: none; }
  .bx-header .bx-hrow { justify-content: space-between; position: relative; }
  .bx-hsearch { order: 3; flex-basis: 100%; }
  .bx-header .bx-hrow { flex-wrap: wrap; row-gap: 10px; }
}
@media (max-width: 640px) {
  .bx-wrap { padding-inline: 16px; }
  .bx-cards, .pp-more .bx-cards, .fp-products .bx-cards { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 12px; }
  .bx-card { padding: 12px; gap: 8px; border-radius: 16px; }
  .bx-card b { font-size: 14px; }
  .bx-logo b { font-size: 16px; } .bx-logo img { width: 42px; height: 42px; }
  .bx-hero-in { padding-top: 40px; padding-bottom: 56px; gap: 24px; }
  .bx-hero-art { margin-bottom: -56px; }
  .bx-float-seal b { white-space: normal; }
  .bx-hero h1 { font-size: 34px; }
  .bx-hero-p { font-size: 16px; }
  .bx-search { flex-wrap: wrap; }
  .bx-search .ic { display: none; }
  .bx-search input { height: 48px; padding: 0 10px; flex-basis: 100%; }
  .bx-search button { flex: 1; height: 48px; }
  .bx-hero-art { min-height: 380px; }
  .bx-float-seal { top: 10px; } .bx-float-tag { bottom: 30px; }
  .bx-stats .stat-card + .stat-card { border-inline-start: 0; border-top: 1px solid var(--bx-line); }
  .bx-h2, .bx-vip-head h2, .bx-trust-text h2 { font-size: 27px; }
  .bx-biz-box { padding: 24px; } .bx-biz-box h2 { font-size: 26px; }
  .bx-biz-grid { grid-template-columns: 1fr; }
  .bx-app-box { padding: 28px 22px 0; } .bx-app-text h2 { font-size: 27px; }
  .bx-app-phones img { width: 150px; }
  .bx-latest-head { flex-direction: column; align-items: stretch; }
  .bx-tabs button { flex: 1; padding: 0 8px; }
  .pp-title { font-size: 24px; }
  .fp-id h1 { font-size: 24px; } .fp-logo { width: 110px; height: 110px; }
  .fp-psearch input { width: 100%; }
  .au-form-side { padding: 24px 18px; } .au-aside { padding: 40px 24px 0; } .au-aside h2 { font-size: 27px; }
  .bx-page-hero h1 { font-size: 30px; }
}
.au-field div > input { padding-inline-end: 52px; }
.bx-pager { display: flex; gap: 10px; justify-content: center; align-items: center; margin-top: 26px; flex-wrap: wrap; color: var(--bx-muted); }
.bx-filter { display: flex; gap: 10px; flex-wrap: wrap; margin: -34px auto 26px; max-width: 760px; background: #FFFFFF; border-radius: 18px; padding: 8px; box-shadow: 0 18px 40px rgba(14,77,48,.12); position: relative; z-index: 2; }
.bx-filter input, .bx-filter select { height: 48px; border: 0; background: var(--bx-bg); border-radius: 12px; padding: 0 14px; font-size: 15px; color: var(--bx-ink); }
.bx-filter input { flex: 1 1 260px; min-width: 0; } .bx-filter select { flex: 0 1 180px; }
.bx-filter input:focus, .bx-filter select:focus { outline: 2px solid var(--bx-gold); }
.bx-page-hero h1 { display: block; } .bx-page-hero .section-title::after { display: none; } .bx-page-hero .section-title { margin-bottom: 8px; padding: 0; }

.bx-registry-link { display: inline-flex; align-items: center; gap: 8px; flex-wrap: wrap; margin-top: 18px; font-size: 14.5px; color: var(--bx-muted); text-decoration: none; }
.bx-registry-link i { color: var(--bx-gold); }
.bx-registry-link .go { color: var(--bx-deep); font-weight: 700; }
.bx-registry-link:hover .go { color: var(--bx-green); }

/* ---------- توحيد خلفيات الشعارات وصور المنتجات (assets/js/bx-media.js) ---------- */
img.bx-m-pad { box-sizing: border-box; padding: 9%; }
img.bx-m-cover { object-fit: cover !important; }
img.bx-m-light { box-shadow: inset 0 0 0 1px var(--bx-line); }
img.bx-m-fallback { object-fit: cover !important; padding: 0 !important; box-shadow: none; }
.pp-fac img.bx-m-pad { padding: 5px; }
.bx-vcard .lg:has(img.bx-m-fallback), .bx-vcard .lg:has(img.bx-m-cover) { padding: 0; }
.bx-vcard .lg img.bx-m-fallback, .bx-vcard .lg img.bx-m-cover { width: 100%; height: 100%; }
.bx-vcard .lg img.bx-m-pad { padding: 0; }

/* ---------- إنستغرام (v7.8) ---------- */
.bx-app { padding-bottom: 40px; }
.bx-ig { padding-bottom: 80px; }
.bx-ig-box { display: flex; flex-wrap: wrap; align-items: center; gap: 34px; background: #FFFFFF; border: 1px solid var(--bx-line); border-radius: 30px; padding: 34px; color: var(--bx-ink); text-decoration: none; transition: box-shadow .2s, transform .2s; }
.bx-ig-box:hover { box-shadow: 0 18px 44px rgba(14,77,48,.10); transform: translateY(-2px); color: var(--bx-ink); }
.bx-ig-text { flex: 1 1 340px; min-width: 0; }
.bx-ig-head { display: flex; align-items: center; gap: 14px; margin-bottom: 18px; }
.bx-ig-av { width: 64px; height: 64px; border-radius: 50%; padding: 3px; background: linear-gradient(45deg, #F9CE34, #EE2A7B, #6228D7); }
.bx-ig-head b { display: block; font-size: 18px; color: var(--bx-deep); }
.bx-ig-head span { display: block; font-size: 14px; color: var(--bx-muted); }
.bx-ig-text h2 { font-size: 30px; color: var(--bx-deep); margin: 0 0 8px; line-height: 1.35; }
.bx-ig-text p { color: var(--bx-muted); font-size: 16.5px; line-height: 1.8; margin: 0 0 20px; }
.bx-ig-btn { background: linear-gradient(45deg, #F58529, #DD2A7B 45%, #8134AF); color: #FFFFFF; }
.bx-ig-grid { flex: 1 1 360px; min-width: 0; display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 10px; }
.bx-ig-grid img { width: 100%; height: auto; aspect-ratio: 4 / 5; object-fit: cover; border-radius: 14px; display: block; }
.bx-fsocial a.ig:hover { background: linear-gradient(45deg, #F58529, #DD2A7B 45%, #8134AF); }
.bx-fig { display: inline-flex; align-items: center; gap: 8px; }
@media (max-width: 640px) {
  .bx-ig-box { padding: 20px; gap: 20px; border-radius: 22px; }
  .bx-ig-text h2 { font-size: 24px; }
  .bx-ig-btn { width: 100%; }
  .bx-ig-grid { gap: 6px; }
}