/** * قالب «اتصل بنا — بوابة الدعم»: غلاف الصفحة + مظهر فاخر داخل Fluent (Element Plus). * يُحمَّل في بعد fluent-support-portal-fix.css (wp_enqueue_scripts). */ /* ------------------------------------------------------------------------- * منع التمرير الأفقي على مستوى الصفحة + فراغات بيضاء (RTL / Bootstrap) * ------------------------------------------------------------------------- */ body.arabbook-contact-support-template { overflow-x: hidden; max-width: 100%; } body.arabbook-contact-support-template .wrapper { max-width: 100%; overflow-x: clip; box-sizing: border-box; } /* Jetpack Sharedaddy غالباً مضمّن في محتوى الصفحة — إخفاء احتياطي إن بقي بعد المعالجة */ body.arabbook-contact-support-template .arabbook-contact-support-entry .sharedaddy { display: none !important; visibility: hidden !important; height: 0 !important; overflow: hidden !important; margin: 0 !important; padding: 0 !important; border: 0 !important; clip: rect(0, 0, 0, 0) !important; clip-path: inset(50%) !important; position: absolute !important; width: 1px !important; } /* ------------------------------------------------------------------------- * غلاف الصفحة (Bootstrap / الثيم) * ------------------------------------------------------------------------- */ body.arabbook-contact-support-template #content-holder.arabbook-contact-support-holder, body.arabbook-contact-support-template .arabbook-contact-support-holder { margin-top: 0; margin-bottom: 0; padding-top: 24px; padding-bottom: 48px; box-sizing: border-box; overflow-x: clip; max-width: 100%; } body.arabbook-contact-support-template .arabbook-contact-support-container { max-width: 1280px; width: 100%; margin-left: auto; margin-right: auto; padding-left: 20px; padding-right: 20px; box-sizing: border-box; } body.arabbook-contact-support-template .arabbook-contact-support-row { margin-left: 0 !important; margin-right: 0 !important; width: 100% !important; max-width: 100% !important; box-sizing: border-box; } body.arabbook-contact-support-template .arabbook-contact-support-row:before, body.arabbook-contact-support-template .arabbook-contact-support-row:after { content: none !important; display: none !important; } body.arabbook-contact-support-template .arabbook-contact-support-main { float: none !important; width: 100% !important; max-width: 100% !important; margin-left: 0 !important; margin-right: 0 !important; min-height: 0; box-sizing: border-box; } body.arabbook-contact-support-template .arabbook-contact-support-article { width: 100%; max-width: 1180px; margin-left: auto; margin-right: auto; box-sizing: border-box; } body.arabbook-contact-support-template .arabbook-contact-support-header { margin-bottom: 1.5rem; text-align: center; } body.arabbook-contact-support-template .arabbook-contact-support-title { margin: 0; font-size: 1.75rem; line-height: 1.35; font-weight: 700; } body.arabbook-contact-support-template .arabbook-contact-support-entry { width: 100%; min-width: 0; box-sizing: border-box; } body.arabbook-contact-support-template .arabbook-contact-support-entry > *:first-child { margin-top: 0; } body.arabbook-contact-support-template .arabbook-contact-support-entry > *:last-child { margin-bottom: 0; } body.arabbook-contact-support-template .arabbook-contact-support-entry #fluent_support_client_app { margin-top: 0.75rem; } body.arabbook-contact-support-template .cp-page-float-left, body.arabbook-contact-support-template .page-item { width: 100% !important; float: none !important; max-width: 100% !important; } @media (min-width: 768px) { body.arabbook-contact-support-template #content-holder.arabbook-contact-support-holder, body.arabbook-contact-support-template .arabbook-contact-support-holder { padding-top: 32px; padding-bottom: 64px; } body.arabbook-contact-support-template .arabbook-contact-support-title { font-size: 2rem; } } /* ------------------------------------------------------------------------- * بوابة Fluent: متغيّرات + غلاف * ------------------------------------------------------------------------- */ body.arabbook-contact-support-template #fluent_support_client_app { max-width: 100%; min-width: 0; width: 100%; box-sizing: border-box; /* نفس خط المحتوى المعيّن في الثيم (مثل Tajawal) — يوحّد النصوص مع أزرار Element */ --el-font-family: inherit; font-family: inherit !important; --el-font-size-base: 16px; --el-color-primary: #1e4d6b; --el-color-primary-light-3: #2d6a8f; --el-color-primary-light-5: #5c8bab; --el-border-radius-base: 12px; --el-border-radius-round: 999px; --el-component-size: 48px; --el-component-size-large: 48px; font-size: var(--el-font-size-base) !important; } body.arabbook-contact-support-template .fs_client_portal { background: linear-gradient(180deg, #fafbfc 0%, #ffffff 38%) !important; border: 1px solid rgba(30, 77, 107, 0.12) !important; border-radius: 20px !important; box-shadow: 0 18px 45px rgba(15, 23, 42, 0.07), 0 2px 8px rgba(15, 23, 42, 0.04) !important; } /* أيقونات أكبر من ملف الإصلاح (خصوصية أعلى + تحميل لاحق) */ body.arabbook-contact-support-template div#fluent_support_client_app svg { width: 22px !important; height: 22px !important; max-width: 22px !important; max-height: 22px !important; inline-size: 22px !important; block-size: 22px !important; flex: 0 0 22px !important; flex-basis: 22px !important; } body.arabbook-contact-support-template div#fluent_support_client_app svg.search-icon { width: 22px !important; height: 22px !important; } body.arabbook-contact-support-template div#fluent_support_client_app .el-icon { font-size: 22px !important; } body.arabbook-contact-support-template div#fluent_support_client_app .el-icon svg, body.arabbook-contact-support-template div#fluent_support_client_app .el-input__suffix-inner svg, body.arabbook-contact-support-template div#fluent_support_client_app svg.el-select__caret { width: 22px !important; height: 22px !important; max-width: 22px !important; max-height: 22px !important; } body.arabbook-contact-support-template div#fluent_support_client_app .el-input__suffix-inner svg, body.arabbook-contact-support-template div#fluent_support_client_app svg.el-select__caret, body.arabbook-contact-support-template div#fluent_support_client_app .el-select__caret svg { width: 18px !important; height: 18px !important; max-width: 18px !important; max-height: 18px !important; } /* ------------------------------------------------------------------------- * أزرار * ------------------------------------------------------------------------- */ body.arabbook-contact-support-template #fluent_support_client_app .el-button { font-family: inherit !important; min-height: 48px !important; padding: 0 22px !important; font-size: 16px !important; font-weight: 600 !important; border-radius: 14px !important; line-height: 1.25 !important; transition: background-color 0.18s ease, box-shadow 0.18s ease, border-color 0.18s ease, transform 0.12s ease !important; } body.arabbook-contact-support-template #fluent_support_client_app .el-button--primary { box-shadow: 0 6px 18px rgba(30, 77, 107, 0.28) !important; } body.arabbook-contact-support-template #fluent_support_client_app .el-button--primary:hover { box-shadow: 0 8px 22px rgba(30, 77, 107, 0.34) !important; } body.arabbook-contact-support-template #fluent_support_client_app .el-button + .el-button { margin-inline-start: 10px !important; } /* ------------------------------------------------------------------------- * إجراءات الرد — «الرد على هذه الرسالة» + «رد وإغلاق» (fs_customer_response_actions) * ------------------------------------------------------------------------- */ body.arabbook-contact-support-template #fluent_support_client_app .fs_customer_response_actions { display: flex !important; flex-direction: row !important; flex-wrap: wrap !important; align-items: center !important; justify-content: flex-end !important; gap: 12px 14px !important; width: 100% !important; margin: 0 !important; padding: 14px 0 0 !important; box-sizing: border-box !important; } body.rtl.arabbook-contact-support-template #fluent_support_client_app .fs_customer_response_actions { justify-content: flex-start !important; } /* النص القابل للنقر لـ «رد وإغلاق» — مظهر زر ثانوي متناسق */ body.arabbook-contact-support-template #fluent_support_client_app .fs_customer_response_actions > p { order: 2; font-family: inherit !important; margin: 0 !important; padding: 0 22px !important; min-height: 48px !important; display: inline-flex !important; align-items: center !important; justify-content: center !important; font-size: 15px !important; font-weight: 700 !important; line-height: 1.35 !important; color: #1e4d6b !important; background: rgba(30, 77, 107, 0.08) !important; border: 1px solid rgba(30, 77, 107, 0.22) !important; border-radius: 14px !important; cursor: pointer !important; -webkit-tap-highlight-color: rgba(30, 77, 107, 0.12); user-select: none !important; transition: background-color 0.18s ease, box-shadow 0.18s ease, border-color 0.18s ease, transform 0.12s ease !important; flex: 0 1 auto !important; max-width: 100% !important; text-align: center !important; box-sizing: border-box !important; } body.arabbook-contact-support-template #fluent_support_client_app .fs_customer_response_actions > p:hover { background: rgba(30, 77, 107, 0.12) !important; border-color: rgba(30, 77, 107, 0.32) !important; } body.arabbook-contact-support-template #fluent_support_client_app .fs_customer_response_actions > p:active { transform: scale(0.98); } body.arabbook-contact-support-template #fluent_support_client_app .fs_customer_response_actions > p:focus-visible { outline: 2px solid rgba(30, 77, 107, 0.45) !important; outline-offset: 2px !important; } /* زر الرد الرئيسي يظهر أولاً بصرياً (الترتيب في DOM: الفقرة ثم الزر) */ body.arabbook-contact-support-template #fluent_support_client_app .fs_customer_response_actions .fs_reply_btn { order: 1; flex: 0 1 auto !important; display: inline-flex !important; align-items: center !important; justify-content: center !important; gap: 0 !important; margin-inline-start: 0 !important; margin-inline-end: 0 !important; width: 210px; } body.arabbook-contact-support-template #fluent_support_client_app .fs_customer_response_actions .fs_reply_btn > span { display: inline-flex !important; align-items: center !important; gap: 10px !important; flex-direction: row !important; flex-wrap: nowrap !important; } body.rtl.arabbook-contact-support-template #fluent_support_client_app .fs_customer_response_actions .fs_reply_btn > span { flex-direction: row-reverse !important; } /* ------------------------------------------------------------------------- * حقول الإدخال + البحث + Select * ------------------------------------------------------------------------- */ body.arabbook-contact-support-template #fluent_support_client_app .el-input__wrapper { min-height: 52px !important; padding: 10px 18px !important; border-radius: 14px !important; } body.arabbook-contact-support-template #fluent_support_client_app .el-input__wrapper.is-focus { box-shadow: 0 0 0 3px rgba(30, 77, 107, 0.18) !important; } body.arabbook-contact-support-template #fluent_support_client_app .el-input__inner { font-size: 16px !important; font-weight: 500 !important; line-height: 1.45 !important; } body.arabbook-contact-support-template #fluent_support_client_app .el-textarea__inner { min-height: 140px !important; padding: 16px 18px !important; font-size: 16px !important; line-height: 1.55 !important; border-radius: 14px !important; font-weight: 500 !important; } /* ------------------------------------------------------------------------- * «تفاصيل الرسالة» + محرّر ووردبريس (مرئي / Code) — مسافات وعمودي * ------------------------------------------------------------------------- */ body.arabbook-contact-support-template #fluent_support_client_app label.fs_ticket_details_label { display: block !important; width: 100% !important; float: none !important; clear: both !important; margin: 0 0 0.85rem !important; padding: 0.35rem 0 0.25rem !important; line-height: 1.5 !important; font-size: 1.02rem !important; font-weight: 700 !important; color: #1e293b !important; box-sizing: border-box !important; } body.arabbook-contact-support-template #fluent_support_client_app .el-form-item:has(label.fs_ticket_details_label) { display: flex !important; flex-direction: column !important; align-items: stretch !important; gap: 0.4rem !important; margin-bottom: 1.1rem !important; } body.arabbook-contact-support-template #fluent_support_client_app div:has(> label.fs_ticket_details_label) { display: flex !important; flex-direction: column !important; align-items: stretch !important; gap: 0.5rem !important; width: 100% !important; } body.arabbook-contact-support-template #fluent_support_client_app .el-form-item:has(label.fs_ticket_details_label) .el-form-item__label, body.arabbook-contact-support-template #fluent_support_client_app .el-form-item:has(label.fs_ticket_details_label) .el-form-item__content { display: block !important; width: 100% !important; margin: 0 !important; padding-bottom: 0 !important; align-self: stretch !important; } body.arabbook-contact-support-template #fluent_support_client_app .el-form-item__content:has(.wp-editor-wrap), body.arabbook-contact-support-template #fluent_support_client_app .el-form-item__content:has(.mce-tinymce) { display: block !important; width: 100% !important; margin-top: 0.5rem !important; clear: both !important; } body.arabbook-contact-support-template #fluent_support_client_app .wp-editor-wrap { display: flex !important; flex-direction: column !important; align-items: stretch !important; width: 100% !important; max-width: 100% !important; float: none !important; clear: both !important; margin-top: 0.35rem !important; box-sizing: border-box !important; } body.arabbook-contact-support-template #fluent_support_client_app .wp-editor-wrap .wp-editor-tools { float: none !important; width: 100% !important; max-width: 100% !important; display: flex !important; flex-direction: column !important; align-items: stretch !important; gap: 10px !important; margin: 65px 0 14px !important; padding: 0 !important; box-sizing: border-box !important; } body.arabbook-contact-support-template #fluent_support_client_app .wp-editor-wrap .wp-editor-tabs { display: flex !important; flex-direction: row !important; flex-wrap: wrap !important; align-items: center !important; gap: 8px 10px !important; width: 100% !important; float: none !important; margin: 0 !important; padding: 0 0 4px !important; border-bottom: 1px solid rgba(30, 77, 107, 0.12) !important; } body.arabbook-contact-support-template #fluent_support_client_app .wp-editor-wrap .wp-media-buttons { float: none !important; width: 100% !important; margin: 0 !important; padding: 0 !important; } body.arabbook-contact-support-template #fluent_support_client_app .wp-editor-wrap .wp-switch-editor { float: none !important; display: inline-block !important; margin: 0 !important; position: relative !important; } body.arabbook-contact-support-template #fluent_support_client_app .wp-editor-wrap .wp-editor-container { clear: both !important; width: 100% !important; max-width: 100% !important; float: none !important; margin: 0 !important; box-sizing: border-box !important; } body.arabbook-contact-support-template #fluent_support_client_app .wp-editor-wrap textarea.wp-editor-area { margin-top: 0 !important; } body.arabbook-contact-support-template #fluent_support_client_app .wp-editor-wrap .quicktags-toolbar { width: 100% !important; float: none !important; clear: both !important; margin-bottom: 8px !important; box-sizing: border-box !important; display: none; } body.arabbook-contact-support-template #fluent_support_client_app .el-select .el-input__wrapper, body.arabbook-contact-support-template #fluent_support_client_app .el-select__wrapper { min-height: 52px !important; padding: 6px 16px !important; border-radius: 14px !important; font-size: 16px !important; font-weight: 600 !important; } body.arabbook-contact-support-template #fluent_support_client_app .el-select__placeholder, body.arabbook-contact-support-template #fluent_support_client_app .el-select__placeholder span { font-size: 16px !important; } /* ------------------------------------------------------------------------- * فلاتر التذاكر (الكل / مفتوح / مغلق) — مظهر قطاعي ملوّن * ------------------------------------------------------------------------- */ body.arabbook-contact-support-template #fluent_support_client_app .fs_filter .el-radio-group, body.arabbook-contact-support-template #fluent_support_client_app .fs_status .el-radio-group { display: inline-flex !important; flex-direction: row !important; flex-wrap: wrap !important; align-items: stretch !important; gap: 0 !important; padding: 6px !important; border-radius: 16px !important; background: linear-gradient(145deg, #e8eef5 0%, #f2f6fa 50%, #e3ecf4 100%) !important; box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.85), 0 6px 20px rgba(14, 44, 74, 0.08) !important; border: 1px solid rgba(30, 77, 107, 0.14) !important; } body.arabbook-contact-support-template #fluent_support_client_app .fs_filter .el-radio-button, body.arabbook-contact-support-template #fluent_support_client_app .fs_status .el-radio-button { margin: 0 !important; } body.arabbook-contact-support-template #fluent_support_client_app .fs_filter .el-radio-button__inner, body.arabbook-contact-support-template #fluent_support_client_app .fs_status .el-radio-button__inner { padding: 12px 22px !important; font-size: 15px !important; font-weight: 800 !important; border-radius: 12px !important; line-height: 1.35 !important; border: none !important; background: transparent !important; color: #334155 !important; box-shadow: none !important; transition: background 0.2s ease, color 0.2s ease, box-shadow 0.2s ease, transform 0.12s ease !important; } body.arabbook-contact-support-template #fluent_support_client_app .fs_filter .el-radio-button:first-child .el-radio-button__inner, body.arabbook-contact-support-template #fluent_support_client_app .fs_status .el-radio-button:first-child .el-radio-button__inner { color: #0d47a1 !important; } body.arabbook-contact-support-template #fluent_support_client_app .fs_filter .el-radio-button:nth-child(2) .el-radio-button__inner, body.arabbook-contact-support-template #fluent_support_client_app .fs_status .el-radio-button:nth-child(2) .el-radio-button__inner { color: #1b5e20 !important; } body.arabbook-contact-support-template #fluent_support_client_app .fs_filter .el-radio-button:nth-child(3) .el-radio-button__inner, body.arabbook-contact-support-template #fluent_support_client_app .fs_status .el-radio-button:nth-child(3) .el-radio-button__inner { color: #b71c1c !important; } body.arabbook-contact-support-template #fluent_support_client_app .fs_filter .el-radio-button.is-active .el-radio-button__inner, body.arabbook-contact-support-template #fluent_support_client_app .fs_status .el-radio-button.is-active .el-radio-button__inner { color: #ffffff !important; box-shadow: 0 4px 14px rgba(0, 0, 0, 0.15) !important; } body.arabbook-contact-support-template #fluent_support_client_app .fs_filter .el-radio-button:first-child.is-active .el-radio-button__inner, body.arabbook-contact-support-template #fluent_support_client_app .fs_status .el-radio-button:first-child.is-active .el-radio-button__inner { background: linear-gradient(135deg, #1565c0 0%, #42a5f5 100%) !important; } body.arabbook-contact-support-template #fluent_support_client_app .fs_filter .el-radio-button:nth-child(2).is-active .el-radio-button__inner, body.arabbook-contact-support-template #fluent_support_client_app .fs_status .el-radio-button:nth-child(2).is-active .el-radio-button__inner { background: linear-gradient(135deg, #2e7d32 0%, #66bb6a 100%) !important; } body.arabbook-contact-support-template #fluent_support_client_app .fs_filter .el-radio-button:nth-child(3).is-active .el-radio-button__inner, body.arabbook-contact-support-template #fluent_support_client_app .fs_status .el-radio-button:nth-child(3).is-active .el-radio-button__inner { background: linear-gradient(135deg, #c62828 0%, #ef5350 100%) !important; } body.arabbook-contact-support-template #fluent_support_client_app .fs_filter .el-radio-button__inner:hover, body.arabbook-contact-support-template #fluent_support_client_app .fs_status .el-radio-button__inner:hover { background: rgba(255, 255, 255, 0.72) !important; } body.arabbook-contact-support-template #fluent_support_client_app .fs_filter .el-radio-button.is-active .el-radio-button__inner:hover, body.arabbook-contact-support-template #fluent_support_client_app .fs_status .el-radio-button.is-active .el-radio-button__inner:hover { filter: brightness(1.05) !important; } /* فلاتر عامة (إن وُجدت خارج .fs_filter) */ body.arabbook-contact-support-template #fluent_support_client_app .el-radio-group { display: inline-flex !important; flex-direction: row !important; flex-wrap: wrap !important; align-items: center !important; gap: 10px !important; } body.arabbook-contact-support-template #fluent_support_client_app .el-radio-button__inner { padding: 12px 20px !important; font-size: 15px !important; font-weight: 700 !important; border-radius: 12px !important; line-height: 1.3 !important; } body.arabbook-contact-support-template #fluent_support_client_app .el-segmented { border-radius: 14px !important; padding: 4px !important; } body.arabbook-contact-support-template #fluent_support_client_app .el-segmented__item { padding: 12px 18px !important; font-size: 15px !important; font-weight: 700 !important; border-radius: 10px !important; } /* ------------------------------------------------------------------------- * صف الترقيم — محاذاة fs_pagination_left مع el-pagination (نفس الارتفاع البصري) * ------------------------------------------------------------------------- */ body.arabbook-contact-support-template #fluent_support_client_app div:has(> .fs_pagination_left):has(> .el-pagination) { display: flex !important; flex-direction: row !important; flex-wrap: wrap !important; align-items: center !important; gap: 12px 16px !important; width: 100% !important; box-sizing: border-box !important; } body.arabbook-contact-support-template #fluent_support_client_app div:has(> .fs_pagination_left):has(> .el-pagination) > .el-pagination { margin-top: 0 !important; flex: 1 1 auto !important; min-height: 52px !important; align-self: center !important; } body.arabbook-contact-support-template #fluent_support_client_app .fs_pagination_left { display: flex !important; flex-direction: row !important; flex-wrap: wrap !important; align-items: center !important; align-content: center !important; gap: 10px 14px !important; min-height: 52px !important; box-sizing: border-box !important; padding: 10px 14px !important; background: rgba(243, 246, 248, 0.65) !important; border-radius: 14px !important; border: 1px solid rgba(30, 77, 107, 0.1) !important; flex: 0 1 auto !important; align-self: center !important; } body.arabbook-contact-support-template #fluent_support_client_app .fs_pagination_left .fs_page_text { display: inline-flex !important; align-items: center !important; min-height: 40px !important; margin: 0 !important; padding: 0 4px !important; line-height: 1.35 !important; white-space: nowrap !important; font-size: 15px !important; font-weight: 700 !important; color: #1e293b !important; } body.arabbook-contact-support-template #fluent_support_client_app .fs_pagination_left .fs_per_page_select.el-select, body.arabbook-contact-support-template #fluent_support_client_app .fs_pagination_left .el-select.fs_per_page_select { margin: 0 !important; min-width: 5.5rem !important; align-self: center !important; } body.arabbook-contact-support-template #fluent_support_client_app .fs_pagination_left .fs_per_page_select .el-select__wrapper { min-height: 48px !important; height: 48px !important; align-items: center !important; box-sizing: border-box !important; } /* ------------------------------------------------------------------------- * الجداول — رأس أوضح وصفوف أريح * ------------------------------------------------------------------------- */ body.arabbook-contact-support-template #fluent_support_client_app .el-table { font-size: 16px !important; border-radius: 16px !important; overflow: hidden !important; --el-table-border-color: rgba(30, 77, 107, 0.12) !important; } body.arabbook-contact-support-template #fluent_support_client_app .el-table th.el-table__cell { background: linear-gradient(180deg, #f3f6f8 0%, #eef2f5 100%) !important; font-size: 15px !important; font-weight: 800 !important; text-transform: none !important; letter-spacing: 0.02em !important; padding: 16px 14px !important; color: #172532 !important; } body.arabbook-contact-support-template #fluent_support_client_app .el-table td.el-table__cell { padding: 16px 14px !important; font-weight: 500 !important; vertical-align: middle !important; } body.arabbook-contact-support-template #fluent_support_client_app .el-table .cell { line-height: 1.45 !important; word-break: break-word !important; } body.arabbook-contact-support-template #fluent_support_client_app .el-tag { font-size: 13px !important; font-weight: 700 !important; padding: 8px 14px !important; border-radius: 999px !important; border: none !important; } /* ------------------------------------------------------------------------- * جدول التذاكر على الجوال — عرض التاريخ والحالة (عمود 2 و 3) * ------------------------------------------------------------------------- */ body.arabbook-contact-support-template #fluent_support_client_app .fs_client_portal.fs_customer_portal_mobile .el-table, body.arabbook-contact-support-template #fluent_support_client_app .fs_customer_portal_mobile .el-table { overflow: visible !important; } body.arabbook-contact-support-template #fluent_support_client_app .fs_client_portal.fs_customer_portal_mobile .el-table__inner-wrapper, body.arabbook-contact-support-template #fluent_support_client_app .fs_customer_portal_mobile .el-table__inner-wrapper { overflow-x: auto !important; overflow-y: visible !important; -webkit-overflow-scrolling: touch !important; max-width: 100% !important; } body.arabbook-contact-support-template #fluent_support_client_app .fs_client_portal.fs_customer_portal_mobile .el-table__body-wrapper, body.arabbook-contact-support-template #fluent_support_client_app .fs_customer_portal_mobile .el-table__body-wrapper { overflow-x: auto !important; -webkit-overflow-scrolling: touch !important; } body.arabbook-contact-support-template #fluent_support_client_app .fs_client_portal.fs_customer_portal_mobile .el-table__header-wrapper, body.arabbook-contact-support-template #fluent_support_client_app .fs_customer_portal_mobile .el-table__header-wrapper { overflow: visible !important; } body.arabbook-contact-support-template #fluent_support_client_app .fs_client_portal.fs_customer_portal_mobile .el-table table, body.arabbook-contact-support-template #fluent_support_client_app .fs_customer_portal_mobile .el-table table { min-width: 620px !important; width: max(100%, 620px) !important; table-layout: auto !important; } body.arabbook-contact-support-template #fluent_support_client_app .fs_client_portal.fs_customer_portal_mobile .el-table th.el-table__cell:nth-child(1), body.arabbook-contact-support-template #fluent_support_client_app .fs_customer_portal_mobile .el-table th.el-table__cell:nth-child(1) { min-width: 0 !important; max-width: 48vw !important; } body.arabbook-contact-support-template #fluent_support_client_app .fs_client_portal.fs_customer_portal_mobile .el-table th.el-table__cell:nth-child(2), body.arabbook-contact-support-template #fluent_support_client_app .fs_client_portal.fs_customer_portal_mobile .el-table td.el-table__cell:nth-child(2), body.arabbook-contact-support-template #fluent_support_client_app .fs_customer_portal_mobile .el-table th.el-table__cell:nth-child(2), body.arabbook-contact-support-template #fluent_support_client_app .fs_customer_portal_mobile .el-table td.el-table__cell:nth-child(2) { min-width: 128px !important; width: auto !important; max-width: none !important; white-space: normal !important; } body.arabbook-contact-support-template #fluent_support_client_app .fs_client_portal.fs_customer_portal_mobile .el-table th.el-table__cell:nth-child(3), body.arabbook-contact-support-template #fluent_support_client_app .fs_client_portal.fs_customer_portal_mobile .el-table td.el-table__cell:nth-child(3), body.arabbook-contact-support-template #fluent_support_client_app .fs_customer_portal_mobile .el-table th.el-table__cell:nth-child(3), body.arabbook-contact-support-template #fluent_support_client_app .fs_customer_portal_mobile .el-table td.el-table__cell:nth-child(3) { min-width: 118px !important; width: auto !important; max-width: none !important; white-space: normal !important; } body.arabbook-contact-support-template #fluent_support_client_app .fs_client_portal.fs_customer_portal_mobile .el-table th.el-table__cell:nth-child(2) .cell, body.arabbook-contact-support-template #fluent_support_client_app .fs_client_portal.fs_customer_portal_mobile .el-table td.el-table__cell:nth-child(2) .cell, body.arabbook-contact-support-template #fluent_support_client_app .fs_client_portal.fs_customer_portal_mobile .el-table th.el-table__cell:nth-child(3) .cell, body.arabbook-contact-support-template #fluent_support_client_app .fs_client_portal.fs_customer_portal_mobile .el-table td.el-table__cell:nth-child(3) .cell, body.arabbook-contact-support-template #fluent_support_client_app .fs_customer_portal_mobile .el-table th.el-table__cell:nth-child(2) .cell, body.arabbook-contact-support-template #fluent_support_client_app .fs_customer_portal_mobile .el-table td.el-table__cell:nth-child(2) .cell, body.arabbook-contact-support-template #fluent_support_client_app .fs_customer_portal_mobile .el-table th.el-table__cell:nth-child(3) .cell, body.arabbook-contact-support-template #fluent_support_client_app .fs_customer_portal_mobile .el-table td.el-table__cell:nth-child(3) .cell { word-break: break-word !important; overflow: visible !important; text-overflow: clip !important; line-height: 1.4 !important; } body.arabbook-contact-support-template #fluent_support_client_app .fs_client_portal.fs_customer_portal_mobile .el-table td.el-table__cell:nth-child(3) .el-tag, body.arabbook-contact-support-template #fluent_support_client_app .fs_customer_portal_mobile .el-table td.el-table__cell:nth-child(3) .el-tag { white-space: normal !important; text-align: center !important; line-height: 1.25 !important; padding: 6px 12px !important; } @media (max-width: 767px) { body.arabbook-contact-support-template #fluent_support_client_app .el-table__inner-wrapper { overflow-x: auto !important; -webkit-overflow-scrolling: touch !important; max-width: 100% !important; } body.arabbook-contact-support-template #fluent_support_client_app .el-table table { min-width: 620px !important; width: max(100%, 620px) !important; table-layout: auto !important; } body.arabbook-contact-support-template #fluent_support_client_app .el-table th.el-table__cell:nth-child(2), body.arabbook-contact-support-template #fluent_support_client_app .el-table td.el-table__cell:nth-child(2) { min-width: 128px !important; max-width: none !important; white-space: normal !important; } body.arabbook-contact-support-template #fluent_support_client_app .el-table th.el-table__cell:nth-child(3), body.arabbook-contact-support-template #fluent_support_client_app .el-table td.el-table__cell:nth-child(3) { min-width: 118px !important; max-width: none !important; white-space: normal !important; } /* صف إرفاق الملفات + أزرار الرد — عمود كامل ولمس أوضح */ body.arabbook-contact-support-template #fluent_support_client_app .fs_ticket_reply_box .fs_row { display: flex !important; flex-direction: column !important; align-items: stretch !important; gap: 12px !important; width: 100% !important; } body.arabbook-contact-support-template #fluent_support_client_app .fs_ticket_reply_box .fs_row > .fs_full { width: 100% !important; max-width: 100% !important; } body.arabbook-contact-support-template #fluent_support_client_app .fs_customer_response_actions { flex-direction: column !important; align-items: stretch !important; justify-content: flex-start !important; gap: 10px !important; padding-top: 12px !important; } body.arabbook-contact-support-template #fluent_support_client_app .fs_customer_response_actions > p, body.arabbook-contact-support-template #fluent_support_client_app .fs_customer_response_actions .fs_reply_btn { width: 100% !important; min-width: 0 !important; } /* «الرد» أولاً ثم «رد وإغلاق» */ body.arabbook-contact-support-template #fluent_support_client_app .fs_customer_response_actions .fs_reply_btn { order: -1 !important; } } /* ------------------------------------------------------------------------- * الترقيم — إصلاح التكديس العمودي بسبب قواعد الثيم أو display على span * ------------------------------------------------------------------------- */ body.arabbook-contact-support-template #fluent_support_client_app .el-pagination { display: flex !important; flex-direction: row !important; flex-wrap: wrap !important; align-items: center !important; justify-content: flex-end !important; gap: 10px 14px !important; width: 100% !important; margin-top: 1.25rem !important; padding: 14px 16px !important; background: rgba(243, 246, 248, 0.65) !important; border-radius: 14px !important; border: 1px solid rgba(30, 77, 107, 0.1) !important; font-size: 15px !important; font-weight: 600 !important; } body.rtl.arabbook-contact-support-template #fluent_support_client_app .el-pagination { justify-content: flex-start !important; flex-direction: row !important; } body.arabbook-contact-support-template #fluent_support_client_app .el-pagination > * { width: auto !important; max-width: none !important; margin: 0 !important; float: none !important; clear: none !important; display: inline-flex !important; flex-direction: row !important; align-items: center !important; flex-wrap: nowrap !important; align-self: center !important; } body.arabbook-contact-support-template #fluent_support_client_app .el-pagination__total, body.arabbook-contact-support-template #fluent_support_client_app .el-pagination__jump, body.arabbook-contact-support-template #fluent_support_client_app .el-pagination__sizes { white-space: nowrap !important; line-height: 1.4 !important; } body.arabbook-contact-support-template #fluent_support_client_app .el-pagination span, body.arabbook-contact-support-template #fluent_support_client_app .el-pagination__total, body.arabbook-contact-support-template #fluent_support_client_app .el-pagination__classifier, body.arabbook-contact-support-template #fluent_support_client_app .el-pagination__rightwrapper { display: inline-flex !important; align-items: center !important; width: auto !important; float: none !important; } body.arabbook-contact-support-template #fluent_support_client_app .el-pagination__rightwrapper { margin-inline-start: auto !important; gap: 12px !important; } body.rtl.arabbook-contact-support-template #fluent_support_client_app .el-pagination__rightwrapper { margin-inline-start: 0 !important; margin-inline-end: auto !important; } body.arabbook-contact-support-template #fluent_support_client_app .el-pager { display: inline-flex !important; flex-direction: row !important; flex-wrap: nowrap !important; align-items: center !important; gap: 6px !important; margin: 0 !important; padding: 0 !important; list-style: none !important; } body.arabbook-contact-support-template #fluent_support_client_app .el-pager li { display: inline-flex !important; align-items: center !important; justify-content: center !important; min-width: 40px !important; height: 40px !important; margin: 0 !important; font-size: 15px !important; font-weight: 700 !important; border-radius: 10px !important; line-height: 1 !important; float: none !important; } body.arabbook-contact-support-template #fluent_support_client_app .el-pagination .btn-prev, body.arabbook-contact-support-template #fluent_support_client_app .el-pagination .btn-next { min-width: 40px !important; height: 40px !important; border-radius: 10px !important; font-size: 18px !important; } body.arabbook-contact-support-template #fluent_support_client_app .el-pagination__editor.el-input { width: auto !important; min-width: 56px !important; max-width: 88px !important; } body.arabbook-contact-support-template #fluent_support_client_app .el-pagination__editor .el-input__wrapper { min-height: 40px !important; padding: 4px 10px !important; } /* صف «انتقل إلى صفحة» / Page X of Y — نصوص والمدخل في سطر واحد */ body.arabbook-contact-support-template #fluent_support_client_app .el-pagination .el-pagination__jump { display: inline-flex !important; flex-direction: row !important; flex-wrap: nowrap !important; align-items: center !important; align-content: center !important; justify-content: center !important; gap: 6px !important; width: auto !important; max-width: none !important; white-space: nowrap !important; line-height: 1.2 !important; } body.arabbook-contact-support-template #fluent_support_client_app .el-pagination .el-pagination__jump .el-pagination__goto, body.arabbook-contact-support-template #fluent_support_client_app .el-pagination .el-pagination__jump .el-pagination__classifier { display: inline !important; width: auto !important; float: none !important; white-space: nowrap !important; margin: 0 !important; line-height: inherit !important; } body.arabbook-contact-support-template #fluent_support_client_app .el-pagination .el-pagination__jump .el-input, body.arabbook-contact-support-template #fluent_support_client_app .el-pagination .el-pagination__jump .el-pagination__editor { display: inline-flex !important; width: auto !important; min-width: 4em !important; max-width: 5.5rem !important; vertical-align: middle !important; float: none !important; margin: 0 !important; flex: 0 0 auto !important; } body.arabbook-contact-support-template #fluent_support_client_app .el-pagination .el-pagination__jump .el-input__wrapper { min-height: 34px !important; min-width: 0 !important; } /* إلغاء فرض الثيم لعرض كامل على span داخل الترقيم */ body.arabbook-contact-support-template #fluent_support_client_app .el-pagination__jump > span { display: inline !important; width: auto !important; } /* ------------------------------------------------------------------------- * صفوف أدوات علوية (عنوان + أزرار + بحث) * ------------------------------------------------------------------------- */ body.arabbook-contact-support-template #fluent_support_client_app .el-row { row-gap: 12px !important; } body.arabbook-contact-support-template #fluent_support_client_app .el-col { min-width: 0 !important; } body.arabbook-contact-support-template #fluent_support_client_app h1, body.arabbook-contact-support-template #fluent_support_client_app h2, body.arabbook-contact-support-template #fluent_support_client_app h3 { font-weight: 800 !important; letter-spacing: 0.01em !important; }