.tpg-theme-ready > .container {
    z-index: 1;
}
.tpg-theme-ready > .navbar {
    z-index: 2;
}

/* عرض حقول البحث في رأس الجدول بوضوح */
body.tpg-theme-ready .grid-heading-row.with-filter,
body.tpg-theme-ready .grid-heading-row.with-filter .grid-row {
    display: block !important;
    visibility: visible !important;
    height: auto !important;
    opacity: 1 !important;
}

/* تحسين ظهور حقول الإدخال في رأس الجدول */
body.tpg-theme-ready .grid-heading-row.with-filter .form-control,
body.tpg-theme-ready .grid-heading-row.with-filter input,
body.tpg-theme-ready .grid-heading-row.with-filter .frappe-control {
    display: block !important;
    visibility: visible !important;
    height: auto !important;
    min-height: 38px !important;
    opacity: 1 !important;
    color: rgb(51, 65, 85) !important;
    background-color: rgb(255, 255, 255) !important;
    border: 1px solid rgb(226, 232, 240) !important;
}

/* تحسين ظهور نصوص حقول البحث */
body.tpg-theme-ready .grid-heading-row.with-filter .form-control::placeholder,
body.tpg-theme-ready .grid-heading-row.with-filter input::placeholder {
    color: rgb(156, 163, 175) !important;
}

/* إظهار حقول الاختيار (Select) والـ Dropdowns في الـ Workspace */
body.tpg-theme-ready select,
body.tpg-theme-ready select option,
body.tpg-theme-ready .modal-content select,
body.tpg-theme-ready .modal-content select option {
    display: block !important;
    visibility: visible !important;
    opacity: 1 !important;
    height: auto !important;
    color: rgb(51, 65, 85) !important;
    background-color: rgb(255, 255, 255) !important;
    border: 1px solid rgb(226, 232, 240) !important;
}

/* إظهار الـ dropdown items والـ menu items */
body.tpg-theme-ready .awesomplete ul li,
body.tpg-theme-ready .dropdown-item,
body.tpg-theme-ready .popover .popover-body,
body.tpg-theme-ready .ce-block,
body.tpg-theme-ready .ce-block select {
    display: block !important;
    visibility: visible !important;
    opacity: 1 !important;
    color: rgb(51, 65, 85) !important;
}

/* إظهار عناصر الـ Workspace Customization Editor */
body.tpg-theme-ready .widget-group,
body.tpg-theme-ready .widget > .widget-head,
body.tpg-theme-ready .frappe-control label {
    display: block !important;
    visibility: visible !important;
}

/* تأكد من ظهور جميع النصوص في المدخلات */
body.tpg-theme-ready input[type="text"],
body.tpg-theme-ready input[type="number"],
body.tpg-theme-ready input[type="email"],
body.tpg-theme-ready input[type="password"],
body.tpg-theme-ready select,
body.tpg-theme-ready textarea,
body.tpg-theme-ready .form-control {
    color: rgb(51, 65, 85) !important;
    background-color: rgb(255, 255, 255) !important;
}

/* ============================================================ */
/* إظهار قائمة الخيارات المنسدلة - ULTRA STRONG OVERRIDE */
/* ============================================================ */

/* الكلاس الرئيسي الذي يخفي القائمة */
body.tpg-theme-ready .dropdown-list-hidden {
    /* إزالة كل أنواع الإخفاء */
    display: block !important;
    visibility: visible !important;  
    opacity: 1 !important;
    height: auto !important;
    max-height: 9999px !important;
    
    /* إزالة القص والـ overflow */
    clip: auto !important;
    clip-path: none !important;
    overflow: visible !important;
    
    /* إزالة التحويلات */
    transform: none !important;
    translate: none !important;
    
    /* الموضع - يظهر فوق كل شيء */
    position: fixed !important;
    z-index: 99999 !important;
    
    /* التصميم */
    background: white !important;
    border: 1px solid #e2e8f0 !important;
    box-shadow: 0 20px 40px rgba(0,0,0,0.2) !important;
    border-radius: 8px !important;
    
    /* التفاعل */
    pointer-events: auto !important;
    user-select: auto !important;
    cursor: auto !important;
}

/* إزالة الـ `.hidden` Tailwind class إذا كان موجود */
body.tpg-theme-ready .dropdown-list-hidden.hidden {
    display: block !important;
}

/* عناصر الخيارات داخل القائمة */
body.tpg-theme-ready .dropdown-list-hidden .dropdown-list-item,
body.tpg-theme-ready .dropdown-list-hidden .dropdown-item {
    display: flex !important;
    visibility: visible !important;
    opacity: 1 !important;
    padding: 12px 16px !important;
    color: #334155 !important;
    background: white !important;
    cursor: pointer !important;
    align-items: center !important;
    gap: 10px !important;
}

/* Hover state */
body.tpg-theme-ready .dropdown-list-hidden .dropdown-list-item:hover,
body.tpg-theme-ready .dropdown-list-hidden .dropdown-item:hover {
    background-color: #f1f5f9 !important;
    color: #0f172a !important;
}

/* أيقونات داخل القائمة */
body.tpg-theme-ready .dropdown-list-hidden .dropdown-item-icon,
body.tpg-theme-ready .dropdown-list-hidden .dropdown-list-item-icon {
    display: inline-flex !important;
    visibility: visible !important;
    opacity: 1 !important;
}

body.tpg-theme-ready .dropdown-list-hidden .dropdown-item-icon svg,
body.tpg-theme-ready .dropdown-list-hidden .dropdown-list-item-icon svg {
    fill: #334155 !important;
    width: 20px !important;
    height: 20px !important;
}

/* ============================================================ */
/* Workspace Customize Mode: Fix block/widget dropdown clipping */
/* Root cause 1: .widget overflow:hidden clips .dropdown-list   */
/* Root cause 2: Each .widget with backdrop-filter creates its  */
/*   own stacking context — dropdowns appear behind neighbours  */
/* ============================================================ */

/* Remove overflow clipping on widgets */
body.tpg-theme-workspace .widget {
    overflow: visible !important;
}

/* Lift the focused/active block's stacking context above all
   sibling blocks so its dropdowns render on top */
body.tpg-theme-workspace .ce-block--focused,
body.tpg-theme-workspace .ce-block:focus-within {
    position: relative !important;
    z-index: 1000 !important;
}

/* Lift the block-list-container (add-block popup) above everything */
body.tpg-theme-workspace .block-list-container.dropdown-list {
    z-index: 9999 !important;
    background: var(--fg-color, #ffffff) !important;
    box-shadow: 0 8px 24px rgba(0, 0, 0, 0.15) !important;
    border: 1px solid rgba(226, 232, 240, 0.8) !important;
}

/* Lift settings/options dropdown above everything */
body.tpg-theme-workspace .dropdown-list:not(.hidden) {
    z-index: 9999 !important;
    background: var(--fg-color, #ffffff) !important;
    box-shadow: 0 8px 24px rgba(0, 0, 0, 0.15) !important;
    border: 1px solid rgba(226, 232, 240, 0.8) !important;
}

/* Fix sidebar workspace item dropdowns too */
body.tpg-theme-workspace .desk-sidebar .dropdown-list:not(.hidden) {
    z-index: 9999 !important;
    background: var(--fg-color, #ffffff) !important;
}

/* Ensure codex editor area is not clipped */
body.tpg-theme-workspace .codex-editor,
body.tpg-theme-workspace .codex-editor__redactor {
    overflow: visible !important;
}

/* ============================================================ */
/* Query Report Filters: keep link/search dropdowns usable       */
/* The global theme rounds/raises controls, but report filters   */
/* are dense and need stricter sizing/z-index rules.             */
/* ============================================================ */

body.tpg-theme-report .page-form {
    overflow: visible !important;
}

body.tpg-theme-report .page-form .form-group,
body.tpg-theme-report .page-form .frappe-control,
body.tpg-theme-report .page-form .control-input-wrapper,
body.tpg-theme-report .page-form .link-field,
body.tpg-theme-report .page-form .awesomplete {
    min-width: 0 !important;
    overflow: visible !important;
    position: relative !important;
}

body.tpg-theme-report .page-form .frappe-control {
    margin-bottom: 8px !important;
    z-index: 1;
}

body.tpg-theme-report .page-form .frappe-control:focus-within,
body.tpg-theme-report .page-form .link-field:focus-within,
body.tpg-theme-report .page-form .awesomplete:focus-within {
    z-index: 2500 !important;
}

body.tpg-theme-report .page-form .control-input,
body.tpg-theme-report .page-form .form-control,
body.tpg-theme-report .page-form input[type="text"],
body.tpg-theme-report .page-form select {
    height: 40px !important;
    min-height: 40px !important;
    line-height: 20px !important;
    padding: 8px 12px !important;
    width: 100% !important;
    color: #334155 !important;
    background: rgba(255, 255, 255, 0.96) !important;
    border: 1px solid rgba(226, 232, 240, 0.95) !important;
    box-shadow: 0 1px 2px rgba(15, 23, 42, 0.04) !important;
}

body.tpg-theme-report .page-form .control-input input,
body.tpg-theme-report .page-form .awesomplete input {
    width: 100% !important;
    min-width: 0 !important;
    text-overflow: ellipsis;
}

body.tpg-theme-report .page-form .form-control::placeholder,
body.tpg-theme-report .page-form input::placeholder {
    color: #94a3b8 !important;
    opacity: 1 !important;
}

body.tpg-theme-report .page-form .awesomplete ul,
body.tpg-theme-report .page-form .awesomplete > [role="listbox"] {
    display: block !important;
    visibility: visible !important;
    opacity: 1 !important;
    position: absolute !important;
    top: calc(100% + 6px) !important;
    left: 0 !important;
    right: auto !important;
    width: max-content !important;
    min-width: 100% !important;
    max-width: min(520px, calc(100vw - 32px)) !important;
    max-height: 290px !important;
    overflow-y: auto !important;
    overflow-x: hidden !important;
    padding: 8px !important;
    z-index: 3200 !important;
    background: rgba(255, 255, 255, 0.98) !important;
    border: 1px solid rgba(191, 219, 254, 0.98) !important;
    border-radius: 16px !important;
    box-shadow: 0 24px 54px -28px rgba(15, 23, 42, 0.38) !important;
}

body.tpg-theme-report .page-form .awesomplete ul:empty,
body.tpg-theme-report .page-form .awesomplete > [role="listbox"]:empty {
    display: none !important;
}

body.tpg-theme-report .page-form .awesomplete ul[hidden],
body.tpg-theme-report .page-form .awesomplete > [role="listbox"][hidden] {
    display: none !important;
}

body.tpg-theme-report .page-form .awesomplete ul li,
body.tpg-theme-report .page-form .awesomplete li[role="option"] {
    display: block !important;
    min-width: 0 !important;
    padding: 9px 10px !important;
    color: #334155 !important;
    background: transparent !important;
    border-radius: 10px !important;
    line-height: 1.35 !important;
    white-space: normal !important;
    word-break: break-word !important;
}

body.tpg-theme-report .page-form .awesomplete ul li:hover,
body.tpg-theme-report .page-form .awesomplete ul li[aria-selected="true"],
body.tpg-theme-report .page-form .awesomplete li[role="option"]:hover,
body.tpg-theme-report .page-form .awesomplete li[role="option"][aria-selected="true"] {
    color: #0f172a !important;
    background: #f1f5f9 !important;
}

body.tpg-theme-report .page-form .awesomplete mark {
    color: #075985 !important;
    background: #e0f2fe !important;
    border-radius: 4px;
    padding: 0 2px;
}

/* Check filters need compact inline layout, not input-card styling. */
body.tpg-theme-report .page-form .frappe-control[data-fieldtype="Check"],
body.tpg-theme-report .page-form .frappe-control[data-fieldtype="Check"] .checkbox {
    overflow: visible !important;
}

body.tpg-theme-report .page-form .frappe-control[data-fieldtype="Check"] .control-input,
body.tpg-theme-report .page-form .frappe-control[data-fieldtype="Check"] .checkbox {
    display: flex !important;
    align-items: flex-start !important;
    gap: 7px !important;
    min-height: 24px !important;
    height: auto !important;
    padding: 0 !important;
    background: transparent !important;
    border: 0 !important;
    box-shadow: none !important;
}

body.tpg-theme-report .page-form .frappe-control[data-fieldtype="Check"] input[type="checkbox"] {
    flex: 0 0 auto !important;
    width: 14px !important;
    height: 14px !important;
    min-height: 14px !important;
    margin: 3px 0 0 !important;
}

body.tpg-theme-report .page-form .frappe-control[data-fieldtype="Check"] label,
body.tpg-theme-report .page-form .checkbox label {
    display: inline !important;
    margin: 0 !important;
    padding: 0 !important;
    color: #334155 !important;
    line-height: 1.35 !important;
    white-space: normal !important;
}

/* Dense report rows must wrap cleanly instead of overlapping nearby controls. */
body.tpg-theme-report .page-form .filter-field,
body.tpg-theme-report .page-form .report-filter,
body.tpg-theme-report .page-form .form-column {
    min-width: 0 !important;
}

@media (max-width: 1200px) {
    body.tpg-theme-report .page-form .awesomplete ul,
    body.tpg-theme-report .page-form .awesomplete > [role="listbox"] {
        max-width: min(430px, calc(100vw - 28px)) !important;
    }
}
