/* Custom Theme Styling Overrides */
:root,
[data-bs-theme=light] {
  --bs-primary: #2a8b37;
  --bs-primary-rgb: 42, 139, 55;
  --bs-primary-active: #062552;
  --bs-primary-active-rgb: 6, 37, 82;
  --bs-primary-light: #f0fdf4; /* Very light green tint */
  --bs-link-color: #2a8b37;
  --bs-link-color-rgb: 42, 139, 55;
  --bs-link-hover-color: #062552;
  --bs-link-hover-color-rgb: 6, 37, 82;
  --bs-text-primary: #2a8b37;
  --bs-component-active-bg: #2a8b37;
  --bs-component-hover-color: #2a8b37;
  --bs-component-checked-bg: #2a8b37;
  --bs-menu-link-color-hover: #2a8b37;
  --bs-menu-link-color-show: #2a8b37;
  --bs-menu-link-color-here: #2a8b37;
  --bs-menu-link-color-active: #2a8b37;
  --bs-ribbon-label-bg: #2a8b37;
  --bs-primary-bg-subtle: #f0fdf4;
  --bs-primary-border-subtle: #bbf7d0; /* Soft light green border */
  --bs-primary-text-emphasis: #062552;
  --bs-focus-ring-color: rgba(42, 139, 55, 0.25);
}

[data-bs-theme=dark] {
  --bs-primary: #2a8b37;
  --bs-primary-rgb: 42, 139, 55;
  --bs-primary-active: #062552;
  --bs-primary-active-rgb: 6, 37, 82;
  --bs-primary-light: #162a1c; /* Darker green tint for dark mode */
  --bs-link-color: #2a8b37;
  --bs-link-color-rgb: 42, 139, 55;
  --bs-link-hover-color: #55c765; /* Lighter green hover in dark mode */
  --bs-link-hover-color-rgb: 85, 199, 101;
  --bs-text-primary: #2a8b37;
  --bs-component-active-bg: #2a8b37;
  --bs-component-hover-color: #2a8b37;
  --bs-component-checked-bg: #2a8b37;
  --bs-primary-bg-subtle: #0d1e14;
  --bs-primary-border-subtle: #163e24;
  --bs-primary-text-emphasis: #55c765;
  --bs-focus-ring-color: rgba(42, 139, 55, 0.25);
}

/* Hardcoded class overrides to ensure standard Bootstrap/Metronic elements match */
.btn-primary {
  --bs-btn-bg: var(--bs-primary) !important;
  --bs-btn-border-color: var(--bs-primary) !important;
  --bs-btn-hover-bg: var(--bs-primary-active) !important;
  --bs-btn-hover-border-color: var(--bs-primary-active) !important;
  --bs-btn-active-bg: var(--bs-primary-active) !important;
  --bs-btn-active-border-color: var(--bs-primary-active) !important;
  --bs-btn-disabled-bg: var(--bs-primary) !important;
  --bs-btn-disabled-border-color: var(--bs-primary) !important;
  color: #ffffff !important;
}

.btn-outline-primary {
  --bs-btn-color: var(--bs-primary) !important;
  --bs-btn-border-color: var(--bs-primary) !important;
  --bs-btn-hover-bg: var(--bs-primary-active) !important;
  --bs-btn-hover-border-color: var(--bs-primary-active) !important;
  --bs-btn-hover-color: #ffffff !important;
  --bs-btn-active-bg: var(--bs-primary-active) !important;
  --bs-btn-active-border-color: var(--bs-primary-active) !important;
  --bs-btn-active-color: #ffffff !important;
}

.btn-light-primary {
  color: var(--bs-primary) !important;
  background-color: var(--bs-primary-light) !important;
}

.btn-light-primary:hover,
.btn-light-primary:active,
.btn-light-primary.show,
.btn-light-primary.active {
  color: #ffffff !important;
  background-color: var(--bs-primary) !important;
}

.btn-active-light-primary:active, 
.btn-active-light-primary.active, 
.show > .btn-active-light-primary.dropdown-toggle,
.btn-active-light-primary:hover {
  color: #062552 !important;
  background-color: var(--bs-primary) !important;
}

.btn-active-color-primary:active, 
.btn-active-color-primary.active, 
.btn-active-color-primary:hover:not(.btn-active) {
  color: var(--bs-primary) !important;
}

.text-primary {
  color: var(--bs-primary) !important;
}

.text-hover-primary:hover {
  color: var(--bs-primary-active) !important;
}

.bg-primary {
  background-color: var(--bs-primary) !important;
}

.bg-light-primary {
  background-color: var(--bs-primary-light) !important;
}

.border-primary {
  border-color: var(--bs-primary) !important;
}

.form-check-input:checked {
  background-color: var(--bs-primary) !important;
  border-color: var(--bs-primary) !important;
}

.form-check-input[type=checkbox]:indeterminate {
  background-color: var(--bs-primary) !important;
  border-color: var(--bs-primary) !important;
}

.page-item.active .page-link {
  background-color: var(--bs-primary) !important;
  border-color: var(--bs-primary) !important;
  color: #ffffff !important;
}

.badge-primary {
  background-color: var(--bs-primary) !important;
  color: #ffffff !important;
}

.badge-light-primary {
  color: var(--bs-primary) !important;
  background-color: var(--bs-primary-light) !important;
}

.link-primary {
  color: var(--bs-primary) !important;
}

.link-primary:hover,
.link-primary:focus {
  color: var(--bs-primary-active) !important;
}
/* RTL Layout Overrides (Applied ONLY in Arabic mode) */
html[dir="rtl"] {
    direction: rtl;
    text-align: right;
}

/* Force Noto Sans Arabic Font for all text elements in RTL view */
html[dir="rtl"],
html[dir="rtl"] body,
html[dir="rtl"] h1,
html[dir="rtl"] h2,
html[dir="rtl"] h3,
html[dir="rtl"] h4,
html[dir="rtl"] h5,
html[dir="rtl"] h6,
html[dir="rtl"] .menu-link,
html[dir="rtl"] .form-label,
html[dir="rtl"] .form-control,
html[dir="rtl"] .btn,
html[dir="rtl"] .badge,
html[dir="rtl"] th,
html[dir="rtl"] td,
html[dir="rtl"] label,
html[dir="rtl"] input,
html[dir="rtl"] select,
html[dir="rtl"] textarea {
    font-family: 'Noto Sans Arabic', sans-serif !important;
}

/* Apply font to spans only if they are not icons or path elements for duotone icons */
html[dir="rtl"] span:not([class^="ki-"]):not([class*=" ki-"]):not([class^="fa-"]):not([class*=" fa-"]):not(.path1):not(.path2):not(.path3):not(.path4):not(.path5):not(.path6):not(.path7):not(.path8):not(.path9):not(.path10) {
    font-family: 'Noto Sans Arabic', sans-serif !important;
}

/* Increase contrast and slightly increase sizes for Arabic readability */
html[dir="rtl"] body {
    font-size: 13.5px !important;
    letter-spacing: 0 !important;
}

html[dir="rtl"] .text-muted {
    color: #6c757d !important; /* Darker faded text for better contrast */
}

html[dir="rtl"] .form-label,
html[dir="rtl"] .fw-semibold,
html[dir="rtl"] .fw-bold {
    font-weight: 600 !important;
}

/* Increase table padding and column spacing for both LTR and RTL */
html[dir="rtl"] table.table th,
html[dir="rtl"] table.table td,
table.table th,
table.table td {
    padding: 1.15rem 1rem !important; /* Increase spacing */
    vertical-align: middle !important;
}

/* Text alignment & Table overrides for RTL */
html[dir="rtl"] .text-end {
    text-align: left !important;
}

html[dir="rtl"] .text-start {
    text-align: right !important;
}

html[dir="rtl"] table.dataTable {
    text-align: right !important;
}

html[dir="rtl"] table.dataTable th,
html[dir="rtl"] table.dataTable td {
    text-align: right !important;
}

/* Prevent horizontal scroll layout glitch */
html, body {
    max-width: 100vw !important;
    overflow-x: clip !important;
}

/* Center empty state in all DataTables and lists */
table.dataTable td.dataTables_empty,
table.dataTable tbody tr td.dataTables_empty,
html[dir="rtl"] table.dataTable td.dataTables_empty,
html[dir="rtl"] table.dataTable tbody tr td.dataTables_empty,
.dataTables_empty,
td.dataTables_empty {
    text-align: center !important;
}

/* Fix DataTables Loading / Processing Overlay (prevents vertical letter wrapping glitch) */
div.dataTables_processing,
.dataTables_wrapper .dataTables_processing {
    position: absolute !important;
    top: 50% !important;
    left: 50% !important;
    transform: translate(-50%, -50%) !important;
    width: auto !important;
    min-width: 160px !important;
    max-width: 320px !important;
    padding: 0.85rem 1.75rem !important;
    margin: 0 !important;
    text-align: center !important;
    white-space: nowrap !important;
    word-break: normal !important;
    background: rgba(255, 255, 255, 0.98) !important;
    color: #181c32 !important;
    font-size: 0.95rem !important;
    font-weight: 600 !important;
    border: 1px solid #e4e6ef !important;
    border-radius: 0.625rem !important;
    box-shadow: 0 0.5rem 1.5rem rgba(0, 0, 0, 0.08) !important;
    z-index: 105 !important;
}

div.dataTables_processing[style*="display: none"],
.dataTables_wrapper .dataTables_processing[style*="display: none"] {
    display: none !important;
}

/* Select2 RTL Dropdown & Container safety */
.select2-container {
    max-width: 100% !important;
}
.select2-dropdown {
    max-width: 100vw !important;
    z-index: 1055 !important;
}
html[dir="rtl"] .select2-dropdown {
    direction: rtl !important;
    text-align: right !important;
}
html[dir="rtl"] .select2-container--bootstrap5 .select2-selection,
html[dir="rtl"] .select2-container--default .select2-selection {
    direction: rtl !important;
    text-align: right !important;
}
html[dir="rtl"] .select2-results__option {
    direction: rtl !important;
    text-align: right !important;
}
html[dir="rtl"] .select2-search__field {
    direction: rtl !important;
    text-align: right !important;
}