/* ===================================================== NESTIQ — ملف الهوية الموحد (وضعان: نهاري افتراضي + ليلي) التبديل عبر data-theme على — زر السويتش بالهيدر ===================================================== */ /* ---------- الوضع النهاري (الافتراضي) — هوية الشعار الفاتح: كحلي + ذهبي ---------- */ :root { --nq-gold: #d4a327; --nq-gold-light: #e5b53a; --nq-gold-text: #a87c12; /* ذهبي أغمق للنصوص على الفاتح */ --nq-navy: #232a45; /* كحلي الشعار */ --nq-bg: #f7f5f0; --nq-bg-glow: rgba(212, 163, 39, .10); --nq-card: #ffffff; --nq-input: #f7f5ef; --nq-border: #e7e1d4; --nq-text: #232a45; --nq-dim: #6d7183; --nq-sidebar-bg: #ffffff; --nq-topbar-bg: rgba(255, 255, 255, .92); --nq-thead-bg: #f4f1e8; --nq-thead-color: var(--nq-gold-text); --nq-hover: rgba(212, 163, 39, .07); --nq-active: rgba(212, 163, 39, .14); --nq-shadow: 0 6px 24px rgba(35, 42, 69, .07); /* ألوان شارات الحالات */ --st-pending-bg: rgba(255, 193, 7, .18); --st-pending-c: #8a6a00; --st-active-bg: rgba(25, 135, 84, .14); --st-active-c: #157347; --st-rejected-bg: rgba(220, 53, 69, .12); --st-rejected-c: #b02a37; --st-sold-bg: rgba(13, 110, 253, .12); --st-sold-c: #0a58ca; --st-archived-bg: rgba(35, 42, 69, .08); --st-archived-c: #6d7183; } /* ---------- الوضع الليلي — الهوية السوداء الذهبية ---------- */ [data-theme="dark"] { --nq-gold-text: #e5b53a; --nq-bg: #0b0b0d; --nq-bg-glow: rgba(212, 163, 39, .10); --nq-card: #141417; --nq-input: #1c1c21; --nq-border: #2a2a31; --nq-text: #f1f1f4; --nq-dim: #9a9aa3; --nq-sidebar-bg: #0e0e11; --nq-topbar-bg: rgba(11, 11, 13, .92); --nq-thead-bg: #101013; --nq-thead-color: var(--nq-gold); --nq-hover: rgba(212, 163, 39, .06); --nq-active: rgba(212, 163, 39, .13); --nq-shadow: 0 6px 24px rgba(0, 0, 0, .45); --st-pending-bg: rgba(255, 193, 7, .15); --st-pending-c: #ffc107; --st-active-bg: rgba(25, 135, 84, .18); --st-active-c: #35c188; --st-rejected-bg: rgba(220, 53, 69, .15); --st-rejected-c: #ef5d6c; --st-sold-bg: rgba(13, 110, 253, .15); --st-sold-c: #6ea8fe; --st-archived-bg: rgba(255, 255, 255, .08); --st-archived-c: #9a9aa3; } /* ---------- أساسيات ---------- */ * { font-family: 'Tajawal', sans-serif; } body { background: var(--nq-bg); background-image: radial-gradient(ellipse 60% 35% at 50% -5%, var(--nq-bg-glow), transparent 70%); color: var(--nq-text); min-height: 100vh; transition: background-color .25s, color .25s; } /* الشعار حسب الوضع */ img.nq-logo-dark { display: none; } img.nq-logo-light { display: inline-block; } [data-theme="dark"] img.nq-logo-dark { display: inline-block; } [data-theme="dark"] img.nq-logo-light { display: none; } /* زر تبديل الوضع */ .nq-theme-btn { background: var(--nq-input); border: 1px solid var(--nq-border); color: var(--nq-gold-text); border-radius: 50%; width: 38px; height: 38px; display: inline-flex; align-items: center; justify-content: center; cursor: pointer; transition: all .2s; } .nq-theme-btn:hover { border-color: var(--nq-gold); transform: rotate(15deg); } /* ---------- السايدبار ---------- */ .nq-sidebar { position: fixed; top: 0; right: 0; bottom: 0; width: var(--sidebar-w, 250px); background: var(--nq-sidebar-bg); border-inline-start: 1px solid var(--nq-border); display: flex; flex-direction: column; z-index: 1040; transition: transform .25s, background-color .25s; } .nq-sidebar .brand { padding: 1.1rem; text-align: center; border-bottom: 1px solid var(--nq-border); } .nq-sidebar .brand img { max-width: 150px; } .nq-menu { list-style: none; margin: 0; padding: .8rem .6rem; overflow-y: auto; flex: 1; } .nq-menu .menu-label { color: var(--nq-dim); font-size: .75rem; font-weight: 700; padding: .8rem .8rem .3rem; opacity: .8; } .nq-menu a { display: flex; align-items: center; gap: .7rem; color: var(--nq-dim); padding: .65rem .8rem; border-radius: 10px; margin-bottom: 2px; font-weight: 500; } .nq-menu a i { width: 20px; text-align: center; font-size: .95rem; } .nq-menu a:hover { background: var(--nq-hover); color: var(--nq-text); } .nq-menu a.active { background: var(--nq-active); color: var(--nq-gold-text); font-weight: 700; } .nq-menu .soon { font-size: .65rem; background: var(--nq-input); color: var(--nq-dim); padding: .1em .5em; border-radius: 6px; margin-inline-start: auto; } .nq-sidebar .sidebar-footer { padding: .8rem; border-top: 1px solid var(--nq-border); } /* ---------- الهيدر العلوي ---------- */ .nq-topbar { position: sticky; top: 0; z-index: 1030; background: var(--nq-topbar-bg); backdrop-filter: blur(8px); border-bottom: 1px solid var(--nq-border); padding: .7rem 1.3rem; display: flex; align-items: center; gap: 1rem; } .nq-topbar .toggle-btn { display: none; background: none; border: 1px solid var(--nq-border); color: var(--nq-dim); border-radius: 8px; padding: .3rem .7rem; } .nq-content { margin-right: var(--sidebar-w, 250px); min-height: 100vh; } .nq-main { padding: 1.5rem; } /* زر إغلاق القائمة (جوال فقط) + الخلفية المعتمة */ .nq-sidebar-close { display: none; position: absolute; inset-inline-start: 12px; top: 12px; background: var(--nq-input); border: 1px solid var(--nq-border); color: var(--nq-dim); width: 34px; height: 34px; border-radius: 9px; font-size: 1rem; line-height: 1; } .nq-sidebar .brand { position: relative; } .nq-sidebar-backdrop { position: fixed; inset: 0; z-index: 1039; background: rgba(0, 0, 0, .5); opacity: 0; visibility: hidden; transition: opacity .25s; } .nq-sidebar-backdrop.show { opacity: 1; visibility: visible; } @media (max-width: 991px) { .nq-sidebar { transform: translateX(100%); } .nq-sidebar.open { transform: none; box-shadow: 0 0 40px rgba(0, 0, 0, .4); } .nq-content { margin-right: 0; } .nq-topbar .toggle-btn { display: inline-block; } .nq-sidebar-close { display: flex; align-items: center; justify-content: center; } } /* ---------- شريط التنقل (الصفحات العامة) ---------- */ .navbar-nestiq { background: var(--nq-topbar-bg); border-bottom: 1px solid var(--nq-border); backdrop-filter: blur(8px); } .navbar-nestiq .navbar-brand img { height: 42px; } .navbar-nestiq .nav-link { color: var(--nq-dim); font-weight: 500; } .navbar-nestiq .nav-link:hover, .navbar-nestiq .nav-link.active { color: var(--nq-gold-text); } .navbar-nestiq .navbar-toggler { border-color: var(--nq-border); } /* ---------- بطاقات الإحصائيات ---------- */ .stat-card { background: var(--nq-card); border: 1px solid var(--nq-border); border-radius: 14px; padding: 1.1rem 1.2rem; display: flex; align-items: center; gap: 1rem; height: 100%; box-shadow: var(--nq-shadow); } .stat-card .stat-icon { width: 48px; height: 48px; border-radius: 12px; flex-shrink: 0; display: flex; align-items: center; justify-content: center; font-size: 1.2rem; background: var(--nq-active); color: var(--nq-gold-text); } .stat-card .stat-value { font-size: 1.45rem; font-weight: 800; line-height: 1.1; } .stat-card .stat-label { color: var(--nq-dim); font-size: .82rem; } /* ---------- مكونات عامة ---------- */ .card { background: var(--nq-card); border: 1px solid var(--nq-border); border-radius: 14px; color: var(--nq-text); } .table { --bs-table-bg: transparent; --bs-table-color: var(--nq-text); --bs-table-border-color: var(--nq-border); } .table thead { --bs-table-bg: var(--nq-thead-bg); --bs-table-color: var(--nq-thead-color); } .table-hover tbody tr:hover { --bs-table-hover-bg: var(--nq-hover); --bs-table-hover-color: var(--nq-text); } .form-control, .form-select { background: var(--nq-input); border: 1px solid var(--nq-border); color: var(--nq-text); border-radius: 10px; } .form-control:focus, .form-select:focus { background: var(--nq-input); color: var(--nq-text); border-color: var(--nq-gold); box-shadow: 0 0 0 .2rem rgba(212, 163, 39, .15); } .form-control::placeholder { color: var(--nq-dim); opacity: .6; } .form-select option { background: var(--nq-card); color: var(--nq-text); } .input-group-text { background: var(--nq-input); border: 1px solid var(--nq-border); color: var(--nq-gold-text); } label.form-label { color: var(--nq-text); font-weight: 500; opacity: .9; } .form-check-input { background-color: var(--nq-input); border-color: var(--nq-border); } .form-check-input:checked { background-color: var(--nq-gold); border-color: var(--nq-gold); } .form-check-label { color: var(--nq-text); } .btn-gold { background: linear-gradient(135deg, var(--nq-gold-light), var(--nq-gold)); border: none; color: #111; font-weight: 700; border-radius: 10px; } .btn-gold:hover { color: #000; filter: brightness(1.08); } .btn-outline-light-nq { border: 1px solid var(--nq-border); color: var(--nq-dim); border-radius: 10px; } .btn-outline-light-nq:hover { border-color: var(--nq-gold); color: var(--nq-gold-text); } .text-gold { color: var(--nq-gold-text) !important; } .text-dim { color: var(--nq-dim) !important; } a { color: var(--nq-gold-text); text-decoration: none; } a:hover { color: var(--nq-text); } hr { border-color: var(--nq-border); opacity: 1; } /* شارات الحالات */ .badge-status { font-weight: 700; padding: .45em .8em; border-radius: 8px; } .st-pending { background: var(--st-pending-bg); color: var(--st-pending-c); } .st-active { background: var(--st-active-bg); color: var(--st-active-c); } .st-rejected { background: var(--st-rejected-bg); color: var(--st-rejected-c); } .st-sold, .st-rented { background: var(--st-sold-bg); color: var(--st-sold-c); } .st-archived { background: var(--st-archived-bg); color: var(--st-archived-c); } /* الترقيم والتنبيهات */ .pagination { --bs-pagination-bg: var(--nq-card); --bs-pagination-color: var(--nq-dim); --bs-pagination-border-color: var(--nq-border); --bs-pagination-hover-bg: var(--nq-input); --bs-pagination-hover-color: var(--nq-gold-text); --bs-pagination-hover-border-color: var(--nq-border); --bs-pagination-active-bg: var(--nq-gold); --bs-pagination-active-border-color: var(--nq-gold); --bs-pagination-active-color: #111; --bs-pagination-disabled-bg: var(--nq-card); --bs-pagination-disabled-border-color: var(--nq-border); } .alert-danger { background: var(--st-rejected-bg); border-color: var(--st-rejected-c); color: var(--st-rejected-c); } /* تنبيهات الحالة الموحدة — النص داكن واضح بالنهاري وذهبي/أخضر بالليلي (قاعدة MsMe: ممنوع ذهبي فاتح كنص بالنهاري) */ .alert-nq-warning { background: var(--st-pending-bg); border: 1px solid var(--st-pending-c); color: var(--st-pending-c); } .alert-nq-success { background: var(--st-active-bg); border: 1px solid var(--st-active-c); color: var(--st-active-c); } /* ---------- شاشات الدخول والتسجيل ---------- */ body.auth-page { background-image: radial-gradient(ellipse 60% 45% at 50% -5%, var(--nq-bg-glow), transparent 70%); display: flex; align-items: center; justify-content: center; padding: 2rem 1rem; } .auth-theme-corner { position: fixed; top: 1rem; left: 1rem; z-index: 10; } .auth-card { background: var(--nq-card); border: 1px solid var(--nq-border); border-radius: 18px; box-shadow: var(--nq-shadow); padding: 2.5rem 2.25rem; width: 100%; animation: rise .6s ease both; } [data-theme="dark"] .auth-card { border-color: rgba(212, 163, 39, .25); } @keyframes rise { from { opacity: 0; transform: translateY(18px); } to { opacity: 1; transform: none; } } .auth-logo { display: block; margin: 0 auto 1.5rem; max-width: 190px; } .auth-title { color: var(--nq-text); font-weight: 800; text-align: center; margin-bottom: .35rem; } .auth-sub { color: var(--nq-dim); text-align: center; font-size: .9rem; margin-bottom: 1.75rem; } .auth-sub .fa-circle { font-size: .3rem; vertical-align: middle; color: var(--nq-gold); margin: 0 .5rem; } .auth-card .input-group > .form-control { border-inline-start: 0; } .auth-card .input-group > .input-group-text { border-inline-end: 0; } .auth-card .btn-gold { font-size: 1.05rem; padding: .7rem; transition: all .2s; } .auth-card .btn-gold:hover { transform: translateY(-1px); box-shadow: 0 8px 20px rgba(212, 163, 39, .25); } a.link-gold { color: var(--nq-gold-text); font-weight: 700; text-decoration: none; } a.link-gold:hover { color: var(--nq-text); } .auth-divider { border-color: var(--nq-border); opacity: 1; } .invalid-feedback { display: block; } /* أزرار اختيار نوع الحساب */ .role-option .btn { background: var(--nq-input); border: 1px solid var(--nq-border); color: var(--nq-dim); border-radius: 12px; padding: .9rem .5rem; width: 100%; transition: all .15s; } .role-option .btn i { display: block; font-size: 1.4rem; margin-bottom: .4rem; color: var(--nq-dim); } .role-option .btn-check:checked + .btn { border-color: var(--nq-gold); color: var(--nq-text); background: var(--nq-active); box-shadow: 0 0 0 .15rem rgba(212, 163, 39, .15); } .role-option .btn-check:checked + .btn i { color: var(--nq-gold-text); } /* صندوق حقول الوسيط */ .broker-box { border: 1px dashed rgba(212, 163, 39, .55); border-radius: 12px; padding: 1.1rem; background: var(--nq-hover); } /* ---------- بطاقات إحصائيات القوائم (حد جانبي ملون لكل فئة) ---------- */ .stat-card[class*="sc-"] { border-inline-end: 4px solid var(--sc); } .stat-card[class*="sc-"] .stat-icon { background: color-mix(in srgb, var(--sc) 14%, transparent); color: var(--sc); } .sc-gold { --sc: #d4a327; } .sc-blue { --sc: #4dabf7; } .sc-green { --sc: #40c057; } .sc-navy { --sc: #748ffc; } .sc-red { --sc: #fa5252; } /* ---------- أزرار الأدوات المربعة الملونة (نمط قوائم MsMe) ---------- */ .btn-tool { width: 34px; height: 34px; border-radius: 9px; border: none; display: inline-flex; align-items: center; justify-content: center; color: #fff; font-size: .85rem; transition: filter .15s, transform .15s; } .btn-tool:hover { filter: brightness(1.1); transform: translateY(-1px); color: #fff; } .tool-view { background: #4dabf7; } .tool-edit { background: #fcc419; color: #111; } .tool-edit:hover { color: #111; } .tool-perm { background: #4c6ef5; } .tool-del { background: #fa5252; } .tool-ok { background: #40c057; } .tool-warn { background: #ff922b; } /* ---------- النماذج المدمجة (حقول وخطوط صغيرة منسقة) ---------- */ .nq-compact .form-control, .nq-compact .form-select { padding: .45rem .7rem; font-size: .875rem; } .nq-compact label.form-label { font-size: .82rem; margin-bottom: .3rem; } .nq-compact .form-text, .nq-compact .field-hint { font-size: .74rem; color: var(--nq-dim); margin-top: .25rem; display: block; } .nq-compact .sec-title { font-size: .95rem; font-weight: 700; color: var(--nq-gold-text); border-bottom: 1px solid var(--nq-border); padding-bottom: .6rem; margin-bottom: 1rem; } .nq-compact .input-group-text { font-size: .85rem; } /* شريط التعليمات */ .nq-note { background: var(--nq-card); border: 1px solid var(--nq-border); border-inline-start: 4px solid var(--nq-gold); border-radius: 10px; padding: .75rem 1rem; display: flex; gap: .6rem; align-items: center; font-size: .85rem; } .nq-note i { color: var(--nq-gold-text); } /* شريط عنوان الصفحة (عنوان + زر عودة) */ .nq-page-head { background: var(--nq-card); border: 1px solid var(--nq-border); border-radius: 12px; padding: .9rem 1.2rem; display: flex; align-items: center; justify-content: space-between; flex-wrap: wrap; gap: .6rem; } /* الأفاتار الدائري */ .nq-avatar { width: 40px; height: 40px; border-radius: 50%; flex-shrink: 0; background: var(--nq-active); color: var(--nq-gold-text); display: inline-flex; align-items: center; justify-content: center; font-weight: 800; overflow: hidden; } .nq-avatar img { width: 100%; height: 100%; object-fit: cover; } /* ---------- القوائم الفرعية بالسايدبار ---------- */ .nq-menu .has-sub > a .chev { margin-inline-start: auto; font-size: .7rem; transition: transform .2s; } .nq-menu li.open .has-sub > a .chev, .nq-menu li.open > a .chev { transform: rotate(-90deg); } .nq-menu .submenu { list-style: none; padding: 0 1.4rem 0 0; display: none; } .nq-menu li.open .submenu { display: block; } .nq-menu .submenu a { padding: .45rem .8rem; font-size: .86rem; } .menu-badge { background: #fa5252; color: #fff; font-size: .68rem; font-weight: 700; border-radius: 8px; padding: .1em .5em; margin-inline-start: auto; } /* ---------- جرس الإشعارات ومنسدلة المستخدم بالهيدر ---------- */ .nq-bell { position: relative; background: none; border: none; color: var(--nq-dim); font-size: 1.1rem; padding: .3rem .5rem; } .nq-bell:hover { color: var(--nq-gold-text); } .nq-bell .bell-count { position: absolute; top: -2px; inset-inline-start: 0; background: #fa5252; color: #fff; font-size: .6rem; font-weight: 700; border-radius: 8px; padding: .05em .4em; } .nq-user-dd { background: none; border: none; color: var(--nq-text); font-weight: 600; font-size: .9rem; } .nq-user-dd:hover { color: var(--nq-gold-text); } .dropdown-menu { background: var(--nq-card); border: 1px solid var(--nq-border); } .dropdown-menu .dropdown-item { color: var(--nq-text); font-size: .88rem; } .dropdown-menu .dropdown-item:hover { background: var(--nq-hover); color: var(--nq-gold-text); } .dropdown-menu .dropdown-divider { border-color: var(--nq-border); } /* توسيط الشعار في شاشات الدخول والتسجيل */ .auth-card > a:first-child { display: block; text-align: center; } /* ---------- صفحات الأخطاء (403/404/500...) ---------- */ body.error-page { display: flex; align-items: center; justify-content: center; padding: 2rem 1rem; } .error-card { text-align: center; max-width: 480px; width: 100%; animation: rise .6s ease both; } .error-card .error-logo { max-width: 170px; margin-bottom: 1.2rem; } .error-card .error-code { font-size: 5.5rem; font-weight: 800; line-height: 1; background: linear-gradient(135deg, var(--nq-gold-light), var(--nq-gold)); -webkit-background-clip: text; background-clip: text; -webkit-text-fill-color: transparent; } .error-card .error-title { font-size: 1.3rem; font-weight: 800; color: var(--nq-text); margin: .6rem 0 .4rem; } .error-card .error-text { color: var(--nq-dim); font-size: .95rem; margin-bottom: 1.5rem; } /* ---------- عارض الصور Viewer.js ---------- */ /* العارض يحسب إزاحات شريط المصغرات بمنطق LTR — تحت RTL تنزاح المصغرات خارج الشاشة ولا تظهر إلا واحدة */ .viewer-container, .viewer-navbar, .viewer-list { direction: ltr; } .viewer-list { padding-right: 0 !important; margin-bottom: 0 !important; } .viewer-navbar { background-color: rgba(0, 0, 0, .55); } /* ---------- زر المفضلة (قلب) على بطاقات العقارات ---------- */ .nq-fav-btn { position: absolute; top: 10px; left: 10px; z-index: 5; width: 36px; height: 36px; border-radius: 50%; border: none; background: rgba(0, 0, 0, .45); color: #fff; font-size: .95rem; display: flex; align-items: center; justify-content: center; transition: transform .15s, background .15s; } .nq-fav-btn:hover { transform: scale(1.12); background: rgba(0, 0, 0, .65); } .nq-fav-btn.is-fav { color: #ff4d6d; } /* ================= صفحة الهبوط (اللاندنق) ================= */ .nq-hero { position: relative; border-radius: 22px; padding: 4.5rem 1.5rem; margin-top: .5rem; overflow: hidden; background: radial-gradient(1100px 380px at 50% -10%, var(--nq-bg-glow), transparent 70%), linear-gradient(180deg, var(--nq-card), var(--nq-input)); border: 1px solid var(--nq-border); } .nq-hero-inner { max-width: 820px; margin: 0 auto; position: relative; z-index: 1; } .nq-hero-tag { display: inline-block; margin-bottom: 1rem; padding: .35rem 1rem; border-radius: 100px; font-size: .82rem; font-weight: 700; color: var(--nq-gold-text); background: color-mix(in srgb, var(--nq-gold) 15%, transparent); border: 1px solid color-mix(in srgb, var(--nq-gold) 40%, transparent); } .nq-hero-title { font-size: clamp(2rem, 5vw, 3.2rem); font-weight: 800; line-height: 1.2; margin-bottom: .8rem; color: var(--nq-text); } .nq-hero-sub { font-size: 1.05rem; color: var(--nq-dim); max-width: 620px; margin: 0 auto 2rem; } .nq-hero-search { display: flex; align-items: center; gap: .5rem; max-width: 640px; margin: 0 auto; background: var(--nq-card); border: 1px solid var(--nq-border); border-radius: 100px; padding: .4rem .4rem .4rem 1.1rem; box-shadow: var(--nq-shadow); } .nq-hero-search > i { color: var(--nq-gold); font-size: 1.05rem; } .nq-hero-search input { flex: 1; border: none; background: transparent; color: var(--nq-text); font-size: 1rem; padding: .55rem .4rem; outline: none; font-family: inherit; } .nq-hero-search input::placeholder { color: var(--nq-dim); } .nq-hero-search .btn { border-radius: 100px; padding-inline: 1.4rem; white-space: nowrap; } .nq-hero-chips { display: flex; flex-wrap: wrap; gap: .5rem; justify-content: center; align-items: center; margin-top: 1.4rem; } .nq-chip { padding: .35rem .9rem; border-radius: 100px; font-size: .85rem; text-decoration: none; color: var(--nq-text); background: var(--nq-input); border: 1px solid var(--nq-border); transition: all .15s; } .nq-chip:hover { border-color: var(--nq-gold); color: var(--nq-gold-text); } .nq-chip-all { background: transparent; border-style: dashed; } /* المؤشرات */ .nq-stat { padding: 1.2rem .5rem; } .nq-stat > i { font-size: 1.6rem; color: var(--nq-gold); margin-bottom: .4rem; } .nq-stat-num { font-size: 1.9rem; font-weight: 800; color: var(--nq-text); line-height: 1.1; } .nq-stat-lbl { font-size: .85rem; color: var(--nq-dim); } /* رأس القسم */ .nq-sec-head { display: flex; justify-content: space-between; align-items: center; margin-bottom: 1.1rem; } /* بطاقات المزايا */ .nq-feature { background: var(--nq-card); border: 1px solid var(--nq-border); border-radius: 16px; padding: 1.5rem; transition: transform .15s, border-color .15s; } .nq-feature:hover { transform: translateY(-3px); border-color: color-mix(in srgb, var(--nq-gold) 45%, transparent); } .nq-feature-ico { width: 48px; height: 48px; border-radius: 12px; display: flex; align-items: center; justify-content: center; font-size: 1.25rem; color: var(--nq-gold); margin-bottom: .9rem; background: color-mix(in srgb, var(--nq-gold) 14%, transparent); } /* بطاقات المدن */ .nq-city-card { display: block; text-align: center; text-decoration: none; padding: 1.4rem .5rem; background: var(--nq-card); border: 1px solid var(--nq-border); border-radius: 16px; color: var(--nq-text); transition: all .15s; } .nq-city-card:hover { border-color: var(--nq-gold); transform: translateY(-3px); } .nq-city-card > i { font-size: 1.5rem; color: var(--nq-gold); margin-bottom: .5rem; } /* دعوة الوسطاء */ .nq-cta { display: flex; flex-wrap: wrap; gap: 1.2rem; align-items: center; justify-content: space-between; border-radius: 20px; padding: 2rem 2.2rem; background: radial-gradient(600px 200px at 90% 50%, var(--nq-bg-glow), transparent 70%), linear-gradient(180deg, var(--nq-card), var(--nq-input)); border: 1px solid var(--nq-border); } /* ================= عارض تكبير صور المحادثة ================= */ .nq-lightbox { position: fixed; inset: 0; z-index: 2000; padding: 2rem; background: rgba(0, 0, 0, .88); cursor: zoom-out; display: none; align-items: center; justify-content: center; } .nq-lightbox.show { display: flex; } .nq-lightbox img { max-width: 95%; max-height: 92%; border-radius: 8px; object-fit: contain; } .nq-lightbox-close { position: absolute; top: 14px; inset-inline-start: 22px; color: #fff; font-size: 2.4rem; line-height: 1; cursor: pointer; } .nq-chat-img { cursor: zoom-in; transition: filter .15s; } .nq-chat-img:hover { filter: brightness(1.05); } /* ---------- شارة الترويج (مميّز/مثبّت) على بطاقات العقارات ---------- */ .nq-promo-badge { position: absolute; top: 10px; inset-inline-end: 10px; z-index: 5; padding: .28rem .7rem; border-radius: 100px; font-size: .72rem; font-weight: 700; background: color-mix(in srgb, var(--nq-gold) 92%, #000); color: #1a1400; box-shadow: 0 2px 8px rgba(0, 0, 0, .25); } .nq-promo-badge.is-pinned { background: #232a45; color: #ffd76a; } /* ================= الفوتر العام ================= */ .nq-footer { margin-top: 3rem; padding: 2.6rem 0 1.4rem; background: var(--nq-card); border-top: 1px solid var(--nq-border); } .nq-footer-logo { height: 46px; } .nq-footer h6 { color: var(--nq-text); } .nq-footer-links { list-style: none; margin: 0; padding: 0; } .nq-footer-links li { margin-bottom: .55rem; color: var(--nq-dim); font-size: .9rem; } .nq-footer-links a { color: var(--nq-dim); text-decoration: none; transition: color .15s; } .nq-footer-links a:hover { color: var(--nq-gold-text); } .nq-social { width: 38px; height: 38px; border-radius: 10px; display: inline-flex; align-items: center; justify-content: center; background: var(--nq-input); border: 1px solid var(--nq-border); color: var(--nq-gold-text); transition: all .15s; } .nq-social:hover { border-color: var(--nq-gold); transform: translateY(-2px); color: var(--nq-gold-text); } .nq-footer-bottom { display: flex; flex-wrap: wrap; gap: .5rem; justify-content: space-between; align-items: center; margin-top: 2rem; padding-top: 1.2rem; border-top: 1px solid var(--nq-border); color: var(--nq-dim); font-size: .85rem; } /* ================= زر البحث الصوتي ================= */ .nq-voice-btn { flex-shrink: 0; width: 42px; height: 42px; border-radius: 50%; border: 1px solid var(--nq-border); background: var(--nq-input); color: var(--nq-gold-text); display: inline-flex; align-items: center; justify-content: center; font-size: 1rem; cursor: pointer; transition: all .15s; } .nq-voice-btn:hover { border-color: var(--nq-gold); color: var(--nq-gold-text); } .nq-voice-btn.listening { background: #dc3545; color: #fff; border-color: #dc3545; animation: nq-voice-pulse 1s ease-in-out infinite; } @keyframes nq-voice-pulse { 0%, 100% { box-shadow: 0 0 0 0 rgba(220, 53, 69, .5); } 50% { box-shadow: 0 0 0 8px rgba(220, 53, 69, 0); } } /* داخل حقل صفحة البحث (يوضع فوق الحقل من جهة النهاية) */ .nq-voice-inline { position: absolute; top: 50%; transform: translateY(-50%); inset-inline-end: 6px; width: 34px; height: 34px; font-size: .9rem; } /* ================= صفحات المحتوى العامة (شروط / من نحن) ================= */ .nq-page-hero { text-align: center; padding: 2.4rem 1rem 1.4rem; } .nq-page-hero h1 { font-size: clamp(1.6rem, 4vw, 2.4rem); font-weight: 800; color: var(--nq-text); margin-bottom: .4rem; } .nq-page-hero .sub { color: var(--nq-dim); } .nq-legal { max-width: 900px; margin: 0 auto; line-height: 2; color: var(--nq-text); } .nq-legal h2 { font-size: 1.15rem; font-weight: 800; color: var(--nq-gold-text); margin: 1.8rem 0 .6rem; padding-bottom: .4rem; border-bottom: 1px solid var(--nq-border); } .nq-legal h3 { font-size: 1rem; font-weight: 700; color: var(--nq-text); margin: 1rem 0 .3rem; } .nq-legal p { margin: 0 0 .7rem; color: var(--nq-dim); } .nq-legal ul { margin: 0 0 .9rem; padding-inline-start: 1.4rem; color: var(--nq-dim); } .nq-legal li { margin-bottom: .35rem; } .nq-legal .intro { background: var(--nq-input); border: 1px solid var(--nq-border); border-radius: 12px; padding: 1.1rem 1.3rem; margin-bottom: 1.4rem; } .nq-legal .final { background: color-mix(in srgb, var(--nq-gold) 10%, transparent); border: 1px solid color-mix(in srgb, var(--nq-gold) 35%, transparent); border-radius: 12px; padding: 1.1rem 1.3rem; margin-top: 1.6rem; } /* ---------- التراخيص بالفوتر ---------- */ .nq-footer-licenses { display: flex; flex-wrap: wrap; gap: .5rem 2rem; align-items: center; margin-top: 1.6rem; padding-top: 1.1rem; border-top: 1px solid var(--nq-border); color: var(--nq-dim); font-size: .85rem; } .nq-footer-licenses .nq-verify { color: var(--nq-gold-text); text-decoration: none; margin-inline-start: .4rem; font-weight: 600; } .nq-footer-licenses .nq-verify:hover { text-decoration: underline; } /* ===== معاينة صور العقار: شبكة مصغّرات مع حذف/ترتيب/غلاف ===== */ .nq-thumbs { display: flex; flex-wrap: wrap; gap: .6rem; } .nq-thumb { position: relative; width: 104px; height: 78px; border-radius: 10px; overflow: hidden; border: 1px solid var(--nq-border); background: var(--nq-input); cursor: grab; flex: 0 0 auto; } .nq-thumb:active { cursor: grabbing; } .nq-thumb img { width: 100%; height: 100%; object-fit: cover; display: block; pointer-events: none; } .nq-thumb .nq-cover-badge { position: absolute; bottom: 0; inset-inline: 0; display: none; background: linear-gradient(transparent, rgba(0,0,0,.72)); color: #ffd76a; font-size: .68rem; font-weight: 700; text-align: center; padding: .5rem .2rem .2rem; } .nq-thumb.is-cover { border-color: var(--nq-gold-text, #c9a24a); box-shadow: 0 0 0 2px rgba(201,162,74,.45); } .nq-thumb.is-cover .nq-cover-badge { display: block; } .nq-thumb .nq-thumb-actions { position: absolute; top: 3px; inset-inline-start: 3px; display: flex; gap: 3px; opacity: 0; transition: opacity .15s; } .nq-thumb:hover .nq-thumb-actions { opacity: 1; } .nq-thumb-btn { width: 22px; height: 22px; border: 0; border-radius: 6px; cursor: pointer; display: flex; align-items: center; justify-content: center; font-size: .7rem; color: #fff; background: rgba(0,0,0,.6); } .nq-thumb-btn.nq-cover-btn:hover { background: #c9a24a; } .nq-thumb-btn.nq-del-btn:hover { background: #dc3545; } .nq-thumb.is-cover .nq-cover-btn { background: #c9a24a; } /* ===== إبراز مواد العمولة داخل صفحات الشروط + سطر الحقوق ===== */ .nq-legal-highlight { background: rgba(201,162,74,.06); border: 1px solid var(--nq-border); border-inline-start: 3px solid var(--nq-gold-text, #c9a24a); border-radius: 10px; padding: .4rem 1.1rem 1rem; margin: 1.2rem 0; } .nq-legal-highlight h2 { border: 0; margin-top: .8rem; } .nq-legal-highlight strong { color: var(--nq-gold-text, #c9a24a); } .nq-legal-copy { margin-top: 2rem; padding-top: 1rem; border-top: 1px solid var(--nq-border); color: var(--nq-dim); font-size: .85rem; text-align: center; } /* ===== نافذة الشروط المنبثقة (بوب-أب في التسجيل) ===== */ .nq-terms-modal { background: var(--nq-card, #fff); color: var(--nq-text); border: 1px solid var(--nq-border); border-radius: 14px; box-shadow: 0 24px 60px rgba(0,0,0,.55); } .nq-terms-modal .modal-header, .nq-terms-modal .modal-footer { border-color: var(--nq-border); } .nq-terms-modal .modal-body { max-height: 70vh; } .nq-terms-modal .nq-legal { font-size: .92rem; } .nq-terms-modal .nq-legal h2 { font-size: 1.02rem; } .nq-terms-modal .btn-close { filter: var(--nq-close-filter, none); } :root:not([data-theme="light"]) .nq-terms-modal .btn-close { filter: invert(1) grayscale(1); } @media (prefers-color-scheme: dark) { :root:not([data-theme="light"]) .nq-terms-modal .btn-close { filter: invert(1) grayscale(1); } } :root[data-theme="dark"] .nq-terms-modal .btn-close { filter: invert(1) grayscale(1); } /* ===== لوحة معلومات الخريطة الحيّة + تفاصيل النوع ===== */ .nq-map-info { display: flex; flex-wrap: wrap; gap: .4rem 1.2rem; background: var(--nq-input); border: 1px solid var(--nq-border); border-radius: 8px; padding: .5rem .8rem; font-size: .85rem; } .nq-map-info-item { color: var(--nq-text); } .nq-unit-row .input-group-text { font-size: .75rem; }