/* Similar styles as instances, adapted for projects */
            :root {
                --map-primary: #09496d;
                --map-primary-dk: #0e6ba0ff;
                --map-primary-lt: #e1f4f4;
                --map-accent: #09a1a3;
                --map-success: #10b981;
                --map-surface: #ffffff;
                --map-bg: #f0f4fb;
                --map-border: #e2e8f0;
                --map-text-main: #0f172a;
                --map-text-sub: #475569;
                --map-text-muted: #94a3b8;
                --map-radius-lg: 14px;
                --map-radius-md: 9px;
                --map-radius-sm: 6px;
                --map-shadow-sm: 0 1px 4px rgba(15, 23, 42, .06);
                --map-shadow-md: 0 4px 20px rgba(15, 23, 42, .09);
                --map-shadow-lg: 0 12px 48px rgba(15, 23, 42, .14);
                --map-grad: linear-gradient(135deg, var(--map-primary) 0%, var(--map-primary-dk) 100%);
            }

            *,
            *::before,
            *::after {
                box-sizing: border-box;
            }

            html,
            body,
            #page,
            .page_wapper,
            #wrapper_full,
            .content_all_warpper,
            #content,
            .site-content {
                overflow: visible !important;
                overflow-x: clip !important;
            }

            .map-page {
                padding: 32px 7% 72px;
                background: var(--map-bg);
                min-height: 80vh;
                font-family: var(--map-font-family);
            }

            .map-loading {
                position: fixed;
                inset: 0;
                z-index: 9999;
                display: flex;
                align-items: center;
                justify-content: center;
                background: rgba(240, 244, 251, .82);
                backdrop-filter: blur(4px);
                transition: opacity .2s ease, visibility .2s ease;
            }

            .map-loading.is-hidden {
                opacity: 0;
                visibility: hidden;
                pointer-events: none;
            }

            .map-loading-box {
                width: min(360px, calc(100vw - 32px));
                padding: 22px 24px;
                border-radius: var(--map-radius-md);
                border: 1px solid var(--map-border);
                background: var(--map-surface);
                box-shadow: var(--map-shadow-lg);
                text-align: center;
            }

            .map-loading-spinner {
                width: 34px;
                height: 34px;
                margin: 0 auto 12px;
                border: 3px solid #dbeafe;
                border-top-color: var(--map-primary);
                border-radius: 50%;
                animation: mapSpin .8s linear infinite;
            }

            .map-loading-title {
                font-size: .95rem;
                font-weight: 800;
                color: var(--map-text-main);
                margin-bottom: 4px;
            }

            .map-loading-text {
                font-size: .82rem;
                color: var(--map-text-sub);
            }

            @keyframes mapSpin {
                to {
                    transform: rotate(360deg);
                }
            }

            .stats-strip {
                display: flex;
                gap: 14px;
                margin-bottom: 22px;
                flex-wrap: wrap;
            }

            .stat-chip {
                background: var(--map-surface);
                border: 1px solid var(--map-border);
                border-radius: 50px;
                padding: 8px 18px;
                display: flex;
                align-items: center;
                gap: 8px;
                font-size: 0.82rem;
                font-weight: 600;
                color: var(--map-text-sub);
                box-shadow: var(--map-shadow-sm);
            }

            .stat-chip .chip-val {
                color: var(--map-primary);
                font-weight: 700;
                font-size: 0.9rem;
            }

            .stat-chip i {
                color: var(--map-primary);
                font-size: 0.85rem;
            }

            /* ─── Full-width Map at Top ─────────────────────────────────────── */
            .map-section {
                background: var(--map-surface);
                border-radius: var(--map-radius-lg);
                box-shadow: var(--map-shadow-md);
                overflow: hidden;
                margin-bottom: 24px;
                border: 1px solid var(--map-border);
            }

            .map-header {
                padding: 14px 20px;
                background: var(--map-grad);
                display: flex;
                align-items: center;
                justify-content: space-between;
                gap: 10px;
            }

            .map-header-left {
                display: flex;
                align-items: center;
                gap: 9px;
                color: #fff;
                font-size: 0.88rem;
                font-weight: 700;
                letter-spacing: .2px;
            }

            .map-live-badge {
                background: rgba(255, 255, 255, .18);
                color: #fff;
                font-size: 0.68rem;
                font-weight: 700;
                letter-spacing: .5px;
                padding: 2px 9px;
                border-radius: 50px;
                border: 1px solid rgba(255, 255, 255, .25);
            }

            #mapid {
                width: 100%;
                height: 620px;
            }

            .map-footer {
                padding: 10px 18px;
                display: flex;
                gap: 12px;
                border-top: 1px solid var(--map-border);
                background: #fafbfe;
            }

            .map-stat {
                display: flex;
                align-items: center;
                gap: 5px;
                font-size: 0.76rem;
                color: var(--map-text-sub);
            }

            .map-stat strong {
                color: var(--map-primary);
                font-weight: 700;
            }

            .map-stat i {
                font-size: 0.72rem;
                color: var(--map-text-muted);
            }

            /* ─── Below Map: Filters + Table Row ───────────────────────────── */
            .filter-panel {
                background: var(--map-surface);
                border-radius: var(--map-radius-lg);
                box-shadow: var(--map-shadow-md);
                border: 1px solid var(--map-border);
                overflow: hidden;
            }

            .filter-bar {
                background: transparent;
                border: none;
                box-shadow: none;
                padding: 24px 22px 18px;
                margin: 0;
                position: relative;
            }

            .filter-bar::before {
                content: none;
            }

            .filter-bar-title {
                font-size: 0.85rem;
                font-weight: 800;
                text-transform: uppercase;
                letter-spacing: 1.2px;
                color: var(--map-primary);
                margin-bottom: 10px;
                display: flex;
                align-items: center;
                gap: 8px;
            }

            .filter-bar-title i {
                color: var(--map-primary);
                font-size: 0.95rem;
            }

            .filter-bar-subtitle {
                margin: 0 0 20px;
                font-size: 0.9rem;
                color: var(--map-text-sub);
                line-height: 1.5;
            }

            .filter-grid {
                display: grid;
                grid-template-columns: 1fr;
                gap: 16px;
            }

            .filter-group {
                display: flex;
                flex-direction: column;
                min-width: 0;
                width: 100%;
            }

            .filter-group.fg-reset {
                grid-column: 1 / -1;
            }

            .filter-group.fg-agency,
            .filter-group.fg-year {
                width: 100%;
            }

            .filter-label {
                font-size: 0.75rem;
                font-weight: 700;
                text-transform: uppercase;
                letter-spacing: 0.8px;
                color: var(--map-text-muted);
                margin-bottom: 10px;
            }

            .filter-input {
                height: 44px !important;
                min-height: 44px !important;
                max-height: 44px !important;
                box-sizing: border-box !important;
                margin: 0 !important;
                border-radius: calc(var(--map-radius-md) + 2px);
                border: 1.5px solid var(--map-border);
                padding: 0 13px !important;
                font-size: 0.95rem;
                line-height: normal !important;
                font-family: var(--map-font-family);
                color: var(--map-text-main);
                background: #f8faff;
                transition: border-color .18s, box-shadow .18s, background .18s;
                outline: none;
                width: 100%;
            }

            .filter-input:focus {
                border-color: var(--map-primary);
                box-shadow: 0 0 0 3px rgba(7, 133, 134, .12);
                background: #fff;
            }

            .select2-container {
                display: block;
                width: 100% !important;
                margin: 0 !important;
            }

            .select2-container--default {
                width: 100% !important;
            }

            .select2-container--default .select2-selection--single {
                width: 100% !important;
                height: 44px !important;
                min-height: 44px !important;
                max-height: 44px !important;
                box-sizing: border-box !important;
                margin: 0 !important;
                border: 1.5px solid var(--map-border) !important;
                border-radius: calc(var(--map-radius-md) + 2px) !important;
                background: #f8faff !important;
                position: relative !important;
                display: flex !important;
                align-items: center !important;
                padding-right: 10px !important;
            }

            .select2-container--default .select2-selection--single .select2-selection__rendered {
                line-height: normal !important;
                font-size: 0.95rem !important;
                font-family: var(--map-font-family) !important;
                color: var(--map-text-main) !important;
                padding-left: 13px !important;
                padding-right: 30px !important;
                margin-right: auto !important;
            }

            .filter-group select {
                width: 100%;
            }

            .select2-container--default.select2-container--focus .select2-selection--single,
            .select2-container--default.select2-container--open .select2-selection--single {
                border-color: var(--map-primary) !important;
                box-shadow: 0 0 0 3px rgba(7, 133, 134, .12) !important;
            }

            .select2-container--default .select2-selection--single .select2-selection__rendered {
                line-height: 44px !important;
                font-size: 0.95rem !important;
                font-family: var(--map-font-family) !important;
                color: var(--map-text-main) !important;
                padding-left: 13px !important;
                padding-right: 30px !important;
            }

            .select2-container--default .select2-selection--single .select2-selection__arrow {
                height: 44px !important;
                width: 28px !important;
                top: 50% !important;
                transform: translateY(-50%) !important;
                right: 10px !important;
            }

            .select2-dropdown {
                border: 1.5px solid var(--map-border) !important;
                border-radius: var(--map-radius-md) !important;
                box-shadow: var(--map-shadow-lg) !important;
                font-family: var(--map-font-family) !important;
            }

            .select2-container--default .select2-results__option--highlighted {
                background: var(--map-primary) !important;
            }

            .btn-reset {
                height: 44px !important;
                min-height: 44px !important;
                max-height: 44px !important;
                box-sizing: border-box !important;
                margin: 0 !important;
                border-radius: calc(var(--map-radius-md) + 2px);
                background: var(--map-grad);
                border: none;
                color: #fff;
                font-weight: 700;
                font-family: var(--map-font-family);
                font-size: 0.92rem;
                width: 100%;
                cursor: pointer;
                transition: opacity .18s, transform .15s;
                display: flex;
                align-items: center;
                justify-content: center;
                gap: 6px;
                white-space: nowrap;
                letter-spacing: .2px;
                box-shadow: 0 10px 25px rgba(9, 73, 109, .1);
            }

            .btn-reset:hover {
                opacity: .94;
                transform: translateY(-1px);
            }

            .btn-reset:active {
                transform: translateY(0);
            }

            .filter-map-row {
                display: grid;
                grid-template-columns: minmax(360px, 520px) 1fr;
                gap: 22px;
                align-items: start;
            }

            .filter-panel {
                position: -webkit-sticky;
                position: sticky;
                top: 120px;
                z-index: 10;
                align-self: start;
            }

            .map-col {
                align-self: start;
            }

            .map-card {
                background: var(--map-surface);
                border-radius: var(--map-radius-lg);
                box-shadow: var(--map-shadow-md);
                overflow: hidden;
                border: 1px solid var(--map-border);
                min-height: 620px;
                display: flex;
                flex-direction: column;
            }

            .table-panel {
                margin-top: 24px;
            }

            @media (max-width: 1100px) {
                .filter-map-row {
                    grid-template-columns: 1fr;
                }

                .filter-panel {
                    position: static;
                }

                .map-card {
                    min-height: 520px;
                }
            }

            .map-card-header {
                padding: 14px 20px;
                background: var(--map-grad);
                display: flex;
                align-items: center;
                justify-content: space-between;
                gap: 10px;
            }

            .map-card-header-left {
                display: flex;
                align-items: center;
                gap: 9px;
                color: #fff;
                font-size: 0.88rem;
                font-weight: 700;
                letter-spacing: .2px;
            }

            .map-live-badge {
                background: rgba(255, 255, 255, .18);
                color: #fff;
                font-size: 0.68rem;
                font-weight: 700;
                letter-spacing: .5px;
                padding: 2px 9px;
                border-radius: 50px;
                border: 1px solid rgba(255, 255, 255, .25);
            }

            #mapid {
                width: 100%;
                height: 620px;
            }

            .map-footer {
                padding: 10px 18px;
                display: flex;
                gap: 12px;
                border-top: 1px solid var(--map-border);
                background: #fafbfe;
            }

            .map-stat {
                display: flex;
                align-items: center;
                gap: 5px;
                font-size: 0.76rem;
                color: var(--map-text-sub);
            }

            .map-stat strong {
                color: var(--map-primary);
                font-weight: 700;
            }

            .map-stat i {
                font-size: 0.72rem;
                color: var(--map-text-muted);
            }

            .table-card {
                background: var(--map-surface);
                border-radius: var(--map-radius-lg);
                box-shadow: var(--map-shadow-md);
                overflow: hidden;
                border: 1px solid var(--map-border);
                height: fit-content;
            }

            .table-card-header {
                padding: 18px 22px;
                border-bottom: 1px solid rgba(148, 163, 184, 0.18);
                display: flex;
                align-items: center;
                justify-content: space-between;
                gap: 12px;
                background:
                    linear-gradient(135deg, rgba(9, 73, 109, 0.04) 0%, rgba(9, 161, 163, 0.02) 100%),
                    #fafcff;
            }

            .table-card-header h3 {
                margin: 0;
                font-size: 1rem;
                font-weight: 700;
                color: var(--map-primary-dk);
                display: flex;
                align-items: center;
                gap: 8px;
            }

            .table-card-subtitle {
                margin: 4px 0 0;
                font-size: 0.8rem;
                color: var(--map-text-sub);
            }

            .count-badge {
                background: var(--map-grad);
                color: #fff;
                border-radius: 50px;
                padding: 6px 16px;
                font-size: 0.76rem;
                font-weight: 700;
                white-space: nowrap;
                letter-spacing: .3px;
                box-shadow: 0 10px 24px rgba(9, 73, 109, 0.18);
            }

            #projectTable_wrapper {
                padding: 14px 18px 16px;
            }

            .table-scroll {
                max-height: 700px;
                overflow: hidden;
            }

            .dataTables_wrapper .dataTables_length,
            .dataTables_wrapper .dataTables_filter {
                margin-bottom: 10px;
                display: flex;
                align-items: center;
                gap: 10px;
                white-space: nowrap;
            }

            .dataTables_wrapper .dataTables_length {
                flex-wrap: nowrap;
            }

            .dataTables_wrapper .dataTables_length label,
            .dataTables_wrapper .dataTables_filter label {
                display: inline-flex;
                align-items: center;
                gap: 6px;
                font-size: 0.8rem;
                font-weight: 600;
                color: var(--map-text-sub);
                margin: 0;
                white-space: nowrap;
            }

            .dataTables_length select {
                height: 34px !important;
                min-height: 34px !important;
                border-radius: 10px !important;
                padding: 0 12px !important;
                font-size: 0.85rem !important;
                width: auto !important;
                min-width: 4.2rem !important;
                display: inline-flex !important;
                align-items: center !important;
            }

            .dataTables_wrapper .dataTables_filter input {
                height: 34px;
                line-height: 34px;
                border-radius: 10px;
                border: 1.5px solid var(--map-border);
                padding: 0 12px;
                background: #fff;
                color: var(--map-text-main);
                font-family: var(--map-font-family);
                transition: border-color .18s, box-shadow .18s;
            }

            .dataTables_wrapper .dataTables_filter input:focus {
                border-color: var(--map-primary);
                box-shadow: 0 0 0 3px rgba(9, 73, 109, 0.1);
                outline: none;
            }

            .dataTables_length select {
                height: 34px !important;
                min-height: 34px !important;
                border-radius: 10px !important;
                padding: 0 12px !important;
                font-size: 0.85rem !important;
            }

            #projectTable {
                border-collapse: collapse !important;
                border-spacing: 0 !important;
                width: 100% !important;
                table-layout: auto;
            }

            table.dataTable thead th {
                background: #f7fafe !important;
                color: #35556b !important;
                font-weight: 700 !important;
                font-size: 0.7rem !important;
                text-transform: uppercase !important;
                letter-spacing: .8px !important;
                border-top: none !important;
                border-bottom: 1px solid #d9e4ef !important;
                padding: 13px 14px !important;
                white-space: nowrap;
                cursor: pointer;
                user-select: none;
                font-family: var(--map-font-family) !important;
            }

            table.dataTable thead th.sorting:after,
            table.dataTable thead th.sorting_asc:after,
            table.dataTable thead th.sorting_desc:after {
                opacity: .55;
            }

            table.dataTable tbody td {
                padding: 13px 14px !important;
                vertical-align: middle !important;
                font-size: 0.82rem !important;
                color: var(--map-text-main) !important;
                border-top: none !important;
                border-bottom: 1px solid #e9f0f6 !important;
                font-family: var(--map-font-family) !important;
                background: #ffffff !important;
            }

            table.dataTable tbody tr {
                transition: background-color .14s ease;
            }

            table.dataTable tbody tr:hover td {
                background: #f5faff !important;
            }

            table.dataTable tbody tr:nth-child(even) td {
                background: #fbfdff !important;
            }

            table.dataTable tbody tr:nth-child(even):hover td {
                background: #f1f7fd !important;
            }

            .project-title-cell {
                min-width: 280px;
                max-width: 420px;
            }

            .project-title-main {
                display: -webkit-box;
                -webkit-line-clamp: 3;
                -webkit-box-orient: vertical;
                overflow: hidden;
                font-weight: 600;
                color: #163247;
                line-height: 1.5;
                font-size: 0.86rem;
                word-break: break-word;
            }

            .project-subject-cell,
            .project-agency-cell,
            .project-institute-cell {
                line-height: 1.45;
                color: #486579;
                font-size: 0.8rem;
            }

            .project-subject-cell {
                min-width: 180px;
                max-width: 240px;
                display: -webkit-box;
                -webkit-line-clamp: 2;
                -webkit-box-orient: vertical;
                overflow: hidden;
            }

            .project-agency-cell {
                min-width: 220px;
                max-width: 280px;
                white-space: normal;
                word-break: break-word;
            }

            .project-institute-cell {
                min-width: 180px;
                max-width: 240px;
                white-space: normal;
                word-break: break-word;
            }

            .year-pill {
                display: inline-flex;
                align-items: center;
                justify-content: center;
                min-width: 54px;
                min-height: 28px;
                padding: 0 8px;
                border-radius: 8px;
                background: #f2f7fd;
                color: #26465d;
                font-size: 0.74rem;
                font-weight: 700;
            }

            .subject-pill {
                display: inline-flex;
                align-items: center;
                min-height: 26px;
                padding: 0 9px;
                border-radius: 8px;
                background: #e0f2fe;
                color: var(--map-primary-dk);
                font-size: 0.73rem;
                font-weight: 600;
                white-space: normal;
                border: 1px solid #bae6fd;
                gap: 4px;
            }

            .subject-pill i {
                font-size: 0.7rem;
                opacity: 0.8;
            }

            .location-pill {
                display: inline-flex;
                align-items: center;
                min-height: 26px;
                padding: 0 10px;
                border-radius: 8px;
                font-size: 0.73rem;
                font-weight: 600;
                white-space: nowrap;
                margin-right: 6px;
                border: 1px solid transparent;
            }

            .location-pill.state {
                background: #e8f1ff;
                color: #1e3a8a;
                border-color: #c7d5f5;
            }

            .location-pill.district {
                background: #edf7ff;
                color: #0f4e7a;
                border-color: #bfd8f2;
            }

            .location-pill.other {
                background: #f3f4f6;
                color: #475569;
                border-color: #d1d5db;
            }

            .dataTables_length select {
                appearance: none;
                -webkit-appearance: none;
                background-image: url("data:image/svg+xml;charset=US-ASCII,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20width%3D%22292.4%22%20height%3D%22292.4%22%3E%3Cpath%20fill%3D%22%2309496d%22%20d%3D%22M287%2069.4a17.6%2017.6%200%200%200-13-5.4H18.4c-5%200-9.3%201.8-12.9%205.4A17.6%2017.6%200%200%200%200%2082.2c0%205%201.8%209.3%205.4%2012.9l128%20127.9c3.6%203.6%207.8%205.4%2012.8%205.4s9.2-1.8%2012.8-5.4L287%2095c3.5-3.5%205.4-7.8%205.4-12.8%200-5-1.9-9.2-5.5-12.8z%22%2F%3E%3C%2Fsvg%3E");
                background-repeat: no-repeat;
                background-position: right 8px center;
                background-size: 10px auto;
                border-radius: var(--map-radius-sm) !important;
                border: 1.5px solid var(--map-border) !important;
                padding: 4px 26px 4px 10px !important;
                font-size: 0.85rem !important;
                background-color: #fff !important;
                color: var(--map-text-main) !important;
                margin: 0 4px !important;
                vertical-align: middle !important;
                outline: none !important;
                cursor: pointer;
                box-shadow: 0 1px 3px rgba(0, 0, 0, 0.04);
                transition: all 0.2s ease;
            }

            .dataTables_length select:hover,
            .dataTables_length select:focus {
                border-color: var(--map-primary) !important;
                box-shadow: 0 0 0 3px rgba(9, 73, 109, 0.12) !important;
            }

            .dataTables_paginate .paginate_button {
                border-radius: var(--map-radius-sm) !important;
                margin: 0 1px !important;
                padding: 4px 10px !important;
                font-size: 0.79rem !important;
                border: 1.5px solid transparent !important;
                font-family: var(--map-font-family) !important;
                transition: all .15s !important;
            }

            html body .dataTables_wrapper .dataTables_paginate .paginate_button.current,
            html body .dataTables_wrapper .dataTables_paginate .paginate_button.current:hover,
            html body div.dataTables_paginate span a.paginate_button.current {
                background: var(--map-grad) !important;
                border-color: var(--map-primary) !important;
                color: #ffffff !important;
            }

            html body .dataTables_wrapper .dataTables_paginate .paginate_button.current *,
            html body .dataTables_wrapper .dataTables_paginate .paginate_button.current:hover * {
                color: #ffffff !important;
            }

            .dataTables_paginate .paginate_button:not(.current):hover {
                background: var(--map-primary-lt) !important;
                border-color: #b5e4e5 !important;
                color: var(--map-primary-dk) !important;
            }

            .dataTables_info {
                font-size: 0.78rem;
                color: var(--map-text-muted);
                margin-top: 10px;
            }

            .dataTables_wrapper .dataTables_paginate {
                margin-top: 12px;
            }

            @media (max-width: 768px) {
                .stats-strip {
                    gap: 10px;
                }

                .stat-chip {
                    width: 100%;
                    justify-content: space-between;
                }

                .filter-grid {
                    grid-template-columns: 1fr;
                }

                .filter-group,
                .filter-group.fg-title,
                .filter-group.fg-agency,
                .filter-group.fg-year,
                .filter-group.fg-reset {
                    flex: 1 1 100%;
                }

                .table-card-header {
                    flex-direction: column;
                    align-items: flex-start;
                }

                #projectTable_wrapper {
                    padding: 16px 14px 18px;
                }
            }

            #projectTable_processing {
                background: rgba(255, 255, 255, .9) !important;
                border: none !important;
                box-shadow: var(--map-shadow-md) !important;
                border-radius: var(--map-radius-md) !important;
                color: var(--map-primary) !important;
                font-size: 0.83rem;
                font-family: var(--map-font-family) !important;
            }

.map-breadcrumb {
    background: #f5f5f5;
    padding: 15px 0;
    position: relative;
    overflow: hidden;
    border-bottom: 1px solid #e0e0e0;
}

.map-breadcrumb-inner {
    padding: 0 7%;
    position: relative;
    z-index: 2;
    text-align: left;
}

.map-breadcrumb-trail {
    display: flex;
    align-items: center;
    gap: 8px;
    font-size: .8rem;
    margin-bottom: 4px;
    justify-content: flex-start;
}

.map-breadcrumb-link {
    color: #09496d;
    text-decoration: none;
    font-weight: 500;
    transition: color .3s ease, opacity .3s ease;
}

.map-breadcrumb-link:hover {
    color: #003366;
    opacity: .7;
}

.map-breadcrumb-separator {
    color: #bbb;
}

.map-breadcrumb-current {
    color: #09496d;
    font-weight: 600;
}

.map-breadcrumb-subtitle {
    font-size: .88rem;
    color: #888;
    margin: 0;
    font-weight: 400;
}

.map-stat-dot {
    color: var(--map-primary);
    font-size: 8px;
}

.map-popup {
    max-width: 250px;
}

.map-popup-title {
    margin: 0 0 8px;
    font-size: .9rem;
    font-weight: 700;
}

.map-popup-row {
    margin: 4px 0;
    font-size: .8rem;
}