{"id":2704,"date":"2026-02-02T04:33:38","date_gmt":"2026-02-02T04:33:38","guid":{"rendered":"https:\/\/amiseminary.org\/brothers\/?page_id=2704"},"modified":"2026-02-24T06:22:59","modified_gmt":"2026-02-24T06:22:59","slug":"media-library","status":"publish","type":"page","link":"https:\/\/amiseminary.org\/brothers\/media-library\/","title":{"rendered":"Media Library"},"content":{"rendered":"\t\t<div data-elementor-type=\"wp-page\" data-elementor-id=\"2704\" class=\"elementor elementor-2704\" data-elementor-post-type=\"page\">\n\t\t\t\t<div class=\"elementor-element elementor-element-19ea5ee e-flex e-con-boxed e-con e-parent\" data-id=\"19ea5ee\" data-element_type=\"container\">\n\t\t\t\t\t<div class=\"e-con-inner\">\n\t\t<div class=\"elementor-element elementor-element-9b20e40 e-con-full e-flex e-con e-child\" data-id=\"9b20e40\" data-element_type=\"container\" data-settings=\"{&quot;background_background&quot;:&quot;classic&quot;}\">\n\t\t\t\t<div class=\"elementor-element elementor-element-78ac302 elementor-widget elementor-widget-heading\" data-id=\"78ac302\" data-element_type=\"widget\" data-widget_type=\"heading.default\">\n\t\t\t\t\t<h2 class=\"elementor-heading-title elementor-size-default\">Media Library<\/h2>\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t<div class=\"elementor-element elementor-element-6ba6e35 e-con-full e-flex e-con e-child\" data-id=\"6ba6e35\" data-element_type=\"container\">\n\t\t\t\t<div class=\"elementor-element elementor-element-46f72fb elementor-widget elementor-widget-html\" data-id=\"46f72fb\" data-element_type=\"widget\" data-widget_type=\"html.default\">\n\t\t\t\t\t<!-- \u0641\u06cc\u0644\u062a\u0631\u0647\u0627\u06cc \u0622\u0628\u0634\u0627\u0631\u06cc -->\r\n<div id=\"filters-container\">\r\n    <select id=\"filter-section\">\r\n        <option value=\"\">Select Section<\/option>\r\n    <\/select>\r\n    <select id=\"filter-subsection\">\r\n        <option value=\"\">Select Subsection<\/option>\r\n    <\/select>\r\n    <select id=\"filter-subject\">\r\n        <option value=\"\">Select Subject<\/option>\r\n    <\/select>\r\n    <select id=\"filter-year\">\r\n        <option value=\"\">Select Year<\/option>\r\n    <\/select>\r\n<\/div>\r\n\r\n<!-- \u067e\u0646\u0644 \u0646\u0645\u0627\u06cc\u0634 \u0641\u06cc\u0644\u062a\u0631\u0647\u0627\u06cc \u0641\u0639\u0627\u0644 (\u062c\u062f\u06cc\u062f) -->\r\n<div class=\"active-filters-panel\" id=\"active-filters-panel\" style=\"display: none;\">\r\n    <span class=\"active-filters-title\">Active filters:<\/span>\r\n    <div id=\"active-filters-list\" class=\"active-filters-list\"><\/div>\r\n    <button class=\"clear-all-filters\" id=\"clear-all-filters\" style=\"display: none;\">Clear all<\/button>\r\n<\/div>\r\n\r\n<!-- \u0646\u0645\u0627\u06cc\u0634 \u062a\u0639\u062f\u0627\u062f \u067e\u0633\u062a\u200c\u0647\u0627 \u0648 \u0644\u0648\u062f\u06cc\u0646\u06af -->\r\n<div class=\"gallery-stats\">\r\n    <span class=\"stats-wrapper\">\r\n        <span id=\"gallery-total-count\">0<\/span> Items Found\r\n    <\/span>\r\n    <div class=\"advanced-loader\" id=\"advanced-loader\" style=\"display: none;\">\r\n        <div class=\"loader-container\">\r\n            <div class=\"loader-dots\">\r\n                <span class=\"loader-dot\"><\/span>\r\n                <span class=\"loader-dot\"><\/span>\r\n                <span class=\"loader-dot\"><\/span>\r\n                <span class=\"loader-dot\"><\/span>\r\n            <\/div>\r\n            <span class=\"loader-text\">Loading gallery...<\/span>\r\n        <\/div>\r\n    <\/div>\r\n<\/div>\r\n\r\n<!-- \u06af\u0631\u06cc\u062f \u06af\u0627\u0644\u0631\u06cc -->\r\n<div id=\"listing-grid\" class=\"gallery-grid\"><\/div>\r\n\r\n<!-- \u062f\u06a9\u0645\u0647 Load More -->\r\n<div class=\"load-more-wrapper\" id=\"gallery-load-more-wrapper\" style=\"display: none;\">\r\n    <button class=\"load-more-btn\" id=\"gallery-load-more\">\r\n        <span class=\"btn-text\">Load More<\/span>\r\n        <span class=\"btn-spinner\"><\/span>\r\n    <\/button>\r\n<\/div>\r\n\r\n<script>\r\njQuery(document).ready(function($) {\r\n    \/\/ ===== \u0645\u062a\u063a\u06cc\u0631\u0647\u0627\u06cc state =====\r\n    let currentState = {\r\n        section: '',\r\n        subsection: '',\r\n        subject: '',\r\n        year: '',\r\n        page: 1,\r\n        total: 0,\r\n        hasMore: false,\r\n        isLoading: false\r\n    };\r\n\r\n    \/\/ ===== \u062a\u0627\u0628\u0639 \u062b\u0627\u0628\u062a \u0646\u06af\u0647 \u062f\u0627\u0634\u062a\u0646 \u0639\u0631\u0636 \u0641\u06cc\u0644\u062a\u0631\u0647\u0627 =====\r\n    function fixFilterWidth() {\r\n        var containerWidth = $('#filters-container').parent().width();\r\n        \r\n        if (containerWidth && containerWidth > 100) {\r\n            $('#filters-container').css({\r\n                'width': containerWidth + 'px',\r\n                'max-width': containerWidth + 'px',\r\n                'flex': 'none'\r\n            });\r\n            \r\n            var gap = 15;\r\n            var selectCount = $('#filters-container select').length;\r\n            \r\n            if (selectCount > 0) {\r\n                var totalGap = gap * (selectCount - 1);\r\n                var selectWidth = (containerWidth - totalGap) \/ selectCount;\r\n                \r\n                $('#filters-container select').css({\r\n                    'width': selectWidth + 'px',\r\n                    'flex': 'none',\r\n                    'min-width': selectWidth + 'px',\r\n                    'max-width': selectWidth + 'px'\r\n                });\r\n                return true;\r\n            }\r\n        }\r\n        return false;\r\n    }\r\n\r\n    function tryFixFilterWidth(attempts = 10, delay = 100) {\r\n        if (attempts <= 0) return;\r\n        \r\n        if (fixFilterWidth()) {\r\n            console.log('Filter width fixed');\r\n        } else {\r\n            setTimeout(function() {\r\n                tryFixFilterWidth(attempts - 1, delay);\r\n            }, delay);\r\n        }\r\n    }\r\n\r\n    \/\/ ===== \u062a\u0648\u0627\u0628\u0639 \u0645\u062f\u06cc\u0631\u06cc\u062a \u0641\u06cc\u0644\u062a\u0631\u0647\u0627\u06cc \u0641\u0639\u0627\u0644 =====\r\n    function updateActiveFilters() {\r\n        console.log('Updating active filters...');\r\n        \r\n        let activeFilters = [];\r\n        let filterLabels = {\r\n            section: 'Section',\r\n            subsection: 'Subsection',\r\n            subject: 'Subject',\r\n            year: 'Year'\r\n        };\r\n        \r\n        $('#filters-container select').each(function() {\r\n            let $this = $(this);\r\n            let id = $this.attr('id').replace('filter-', '');\r\n            let value = $this.val();\r\n            let text = $this.find('option:selected').text();\r\n            \r\n            \/\/ \u062d\u0630\u0641 \u06a9\u0644\u0627\u0633 active \u0627\u0632 \u0647\u0645\u0647\r\n            $this.removeClass('filter-active');\r\n            \r\n            if (value && value !== '') {\r\n                activeFilters.push({\r\n                    type: id,\r\n                    label: filterLabels[id] || id,\r\n                    value: value,\r\n                    text: text\r\n                });\r\n                \r\n                \/\/ \u0627\u0636\u0627\u0641\u0647 \u06a9\u0631\u062f\u0646 \u06a9\u0644\u0627\u0633 active \u0628\u0647 \u0633\u0644\u06a9\u062a\r\n                $this.addClass('filter-active');\r\n            }\r\n        });\r\n        \r\n        \/\/ \u0646\u0645\u0627\u06cc\u0634 \u067e\u0646\u0644 \u0641\u06cc\u0644\u062a\u0631\u0647\u0627\u06cc \u0641\u0639\u0627\u0644\r\n        if (activeFilters.length > 0) {\r\n            let chips = '';\r\n            activeFilters.forEach(filter => {\r\n                chips += `\r\n                    <div class=\"active-filter-chip\" data-type=\"${filter.type}\" data-value=\"${filter.value}\">\r\n                        <span><strong>${filter.label}:<\/strong> ${filter.text}<\/span>\r\n                        <button class=\"remove-filter\" data-type=\"${filter.type}\">\u2715<\/button>\r\n                    <\/div>\r\n                `;\r\n            });\r\n            \r\n            $('#active-filters-list').html(chips);\r\n            $('#active-filters-panel').fadeIn(300);\r\n            $('#clear-all-filters').show();\r\n        } else {\r\n            $('#active-filters-panel').fadeOut(300);\r\n            $('#clear-all-filters').hide();\r\n        }\r\n    }\r\n\r\n    \/\/ ===== \u062a\u0648\u0627\u0628\u0639 \u0646\u0645\u0627\u06cc\u0634 \u0644\u0648\u062f\u06cc\u0646\u06af =====\r\n    function showAdvancedLoader() {\r\n        currentState.isLoading = true;\r\n        $('#advanced-loader').stop(true, true).fadeIn(200);\r\n        $('#gallery-load-more').prop('disabled', true);\r\n    }\r\n\r\n    function hideAdvancedLoader() {\r\n        $('#advanced-loader').stop(true, true).fadeOut(200, function() {\r\n            currentState.isLoading = false;\r\n        });\r\n        $('#gallery-load-more').prop('disabled', false);\r\n    }\r\n\r\n    \/\/ ===== \u0628\u0647\u200c\u0631\u0648\u0632\u0631\u0633\u0627\u0646\u06cc \u062a\u0639\u062f\u0627\u062f \u067e\u0633\u062a\u200c\u0647\u0627 =====\r\n    function updateGalleryCount() {\r\n        let countText = currentState.total.toLocaleString();\r\n        \r\n        if (currentState.total > 0) {\r\n            $('#gallery-total-count')\r\n                .text(countText)\r\n                .addClass('has-items');\r\n        } else {\r\n            $('#gallery-total-count')\r\n                .text('0')\r\n                .removeClass('has-items');\r\n        }\r\n    }\r\n\r\n    \/\/ ===== \u0628\u0627\u0631\u06af\u0630\u0627\u0631\u06cc \u0641\u06cc\u0644\u062a\u0631\u0647\u0627 =====\r\n    function loadFilters() {\r\n        \/\/ Sections\r\n        $.post(ajaxurl, { action: 'load_top_level_terms' }, function(data) {\r\n            $('#filter-section').html('<option value=\"\">Select Section<\/option>');\r\n            $.each(data, function(i, term) {\r\n                $('#filter-section').append('<option value=\"' + term.id + '\">' + term.name + '<\/option>');\r\n            });\r\n            tryFixFilterWidth(10, 100);\r\n            updateActiveFilters();\r\n        });\r\n\r\n        \/\/ Years\r\n        $.post(ajaxurl, { action: 'load_child_terms', parent_id: 0, taxonomy: 'gallery-year' }, function(data) {\r\n            $('#filter-year').html('<option value=\"\">Select Year<\/option>');\r\n            $.each(data, function(i, term) {\r\n                $('#filter-year').append('<option value=\"' + term.id + '\">' + term.name + '<\/option>');\r\n            });\r\n            tryFixFilterWidth(10, 100);\r\n            updateActiveFilters();\r\n        });\r\n    }\r\n\r\n    \/\/ ===== \u0628\u0627\u0631\u06af\u0630\u0627\u0631\u06cc \u067e\u0633\u062a\u200c\u0647\u0627 =====\r\n    function loadPosts(reset = true) {\r\n        if (currentState.isLoading) return;\r\n\r\n        if (reset) {\r\n            currentState.page = 1;\r\n            $('#listing-grid').empty();\r\n        }\r\n\r\n        showAdvancedLoader();\r\n\r\n        $.post(ajaxurl, {\r\n            action: 'load_posts',\r\n            section: currentState.section,\r\n            subsection: currentState.subsection,\r\n            subject: currentState.subject,\r\n            year: currentState.year,\r\n            page: currentState.page\r\n        }, function(response) {\r\n            if (reset) {\r\n                $('#listing-grid').html(response.html);\r\n            } else {\r\n                $('#listing-grid').append(response.html);\r\n            }\r\n\r\n            currentState.total = response.total || 0;\r\n            currentState.hasMore = response.has_more || false;\r\n\r\n            updateGalleryCount();\r\n\r\n            if (currentState.hasMore) {\r\n                $('#gallery-load-more-wrapper').fadeIn(300);\r\n            } else {\r\n                $('#gallery-load-more-wrapper').fadeOut(300);\r\n            }\r\n\r\n            hideAdvancedLoader();\r\n            updateActiveFilters();\r\n            tryFixFilterWidth(10, 100);\r\n        }).fail(function() {\r\n            $('#listing-grid').html('<div class=\"no-posts error\">Error loading posts. Please try again.<\/div>');\r\n            hideAdvancedLoader();\r\n        });\r\n    }\r\n\r\n    \/\/ ===== \u0631\u0648\u06cc\u062f\u0627\u062f \u062d\u0630\u0641 \u0641\u06cc\u0644\u062a\u0631 \u062a\u06a9\u06cc =====\r\n    $(document).on('click', '.remove-filter', function(e) {\r\n        e.preventDefault();\r\n        let type = $(this).data('type');\r\n        console.log('Removing filter:', type);\r\n        $(`#filter-${type}`).val('').trigger('change');\r\n    });\r\n\r\n    \/\/ ===== \u0631\u0648\u06cc\u062f\u0627\u062f \u067e\u0627\u06a9 \u06a9\u0631\u062f\u0646 \u0647\u0645\u0647 \u0641\u06cc\u0644\u062a\u0631\u0647\u0627 =====\r\n    $('#clear-all-filters').on('click', function(e) {\r\n        e.preventDefault();\r\n        console.log('Clearing all filters');\r\n        $('#filters-container select').val('').trigger('change');\r\n    });\r\n\r\n    \/\/ ===== \u0631\u0648\u06cc\u062f\u0627\u062f \u062a\u063a\u06cc\u06cc\u0631 Section =====\r\n    $('#filter-section').on('change', function() {\r\n        $('#filter-subsection').html('<option value=\"\">Select Subsection<\/option>');\r\n        $('#filter-subject').html('<option value=\"\">Select Subject<\/option>');\r\n\r\n        currentState.section = $(this).val();\r\n        currentState.subsection = '';\r\n        currentState.subject = '';\r\n\r\n        if (currentState.section) {\r\n            $.post(ajaxurl, { action: 'load_child_terms', parent_id: currentState.section }, function(data) {\r\n                $('#filter-subsection').html('<option value=\"\">Select Subsection<\/option>');\r\n                $.each(data, function(i, term) {\r\n                    $('#filter-subsection').append('<option value=\"' + term.id + '\">' + term.name + '<\/option>');\r\n                });\r\n                tryFixFilterWidth(10, 100);\r\n            });\r\n        }\r\n\r\n        loadPosts(true);\r\n        updateActiveFilters();\r\n    });\r\n\r\n    \/\/ ===== \u0631\u0648\u06cc\u062f\u0627\u062f \u062a\u063a\u06cc\u06cc\u0631 Subsection =====\r\n    $('#filter-subsection').on('change', function() {\r\n        $('#filter-subject').html('<option value=\"\">Select Subject<\/option>');\r\n\r\n        currentState.subsection = $(this).val();\r\n        currentState.subject = '';\r\n\r\n        if (currentState.subsection) {\r\n            $.post(ajaxurl, { action: 'load_child_terms', parent_id: currentState.subsection }, function(data) {\r\n                $('#filter-subject').html('<option value=\"\">Select Subject<\/option>');\r\n                $.each(data, function(i, term) {\r\n                    $('#filter-subject').append('<option value=\"' + term.id + '\">' + term.name + '<\/option>');\r\n                });\r\n                tryFixFilterWidth(10, 100);\r\n            });\r\n        }\r\n\r\n        loadPosts(true);\r\n        updateActiveFilters();\r\n    });\r\n\r\n    \/\/ ===== \u0631\u0648\u06cc\u062f\u0627\u062f \u062a\u063a\u06cc\u06cc\u0631 Subject \u0648 Year =====\r\n    $('#filter-subject, #filter-year').on('change', function() {\r\n        currentState.subject = $('#filter-subject').val();\r\n        currentState.year = $('#filter-year').val();\r\n        loadPosts(true);\r\n        updateActiveFilters();\r\n    });\r\n\r\n    \/\/ ===== \u0631\u0648\u06cc\u062f\u0627\u062f \u06a9\u0644\u06cc\u06a9 \u0631\u0648\u06cc Load More =====\r\n    $('#gallery-load-more').on('click', function() {\r\n        if (!currentState.isLoading && currentState.hasMore) {\r\n            currentState.page++;\r\n            loadPosts(false);\r\n        }\r\n    });\r\n\r\n    \/\/ ===== \u0631\u0648\u06cc\u062f\u0627\u062f \u062a\u063a\u06cc\u06cc\u0631 \u0633\u0627\u06cc\u0632 \u0635\u0641\u062d\u0647 =====\r\n    $(window).on('resize', function() {\r\n        tryFixFilterWidth(5, 50);\r\n    });\r\n\r\n    \/\/ ===== \u0627\u062c\u0631\u0627\u06cc \u0627\u0648\u0644\u06cc\u0647 =====\r\n    loadFilters();\r\n    loadPosts(true);\r\n    updateActiveFilters();\r\n    \r\n    setTimeout(function() { tryFixFilterWidth(10, 100); }, 500);\r\n    setTimeout(function() { tryFixFilterWidth(10, 100); }, 1000);\r\n    \r\n    $(window).on('load', function() {\r\n        tryFixFilterWidth(20, 50);\r\n        updateActiveFilters();\r\n    });\r\n    \r\n    $(document).ajaxComplete(function() {\r\n        tryFixFilterWidth(10, 100);\r\n        updateActiveFilters();\r\n    });\r\n});\r\n<\/script>\r\n\r\n<style>\r\n    \/* ===== \u0627\u0633\u062a\u0627\u06cc\u0644\u200c\u0647\u0627\u06cc \u0627\u0635\u0644\u06cc ===== *\/\r\n    * {\r\n        box-sizing: border-box;\r\n    }\r\n\r\n    \/* ===== Container \u0641\u06cc\u0644\u062a\u0631\u0647\u0627 ===== *\/\r\n    #filters-container {\r\n        display: flex;\r\n        flex-wrap: wrap;\r\n        gap: 15px;\r\n        width: 100%;\r\n        justify-content: flex-start;\r\n        margin-bottom: 10px;\r\n        min-width: 100%;\r\n        position: relative;\r\n        z-index: 10;\r\n    }\r\n    \r\n\r\n\r\n    \/* select \u0647\u0627 *\/\r\n    #filters-container select {\r\n        flex: 1 1 calc(25% - 15px);\r\n        min-width: 180px;\r\n        max-width: 100%;\r\n        padding: 14px 18px;\r\n        border-radius: 12px;\r\n        border: 1px solid #f0f0f0;\r\n        font-size: 15px;\r\n        font-weight: 500;\r\n        background-color: #fff;\r\n        outline: none;\r\n        cursor: pointer;\r\n        transition: all 0.3s ease;\r\n        appearance: none;\r\n        background-image: url(\"data:image\/svg+xml,%3Csvg xmlns='http:\/\/www.w3.org\/2000\/svg' width='20' height='20' viewBox='0 0 24 24' fill='none' stroke='%23999' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpolyline points='6 9 12 15 18 9'%3E%3C\/polyline%3E%3C\/svg%3E\");\r\n        background-repeat: no-repeat;\r\n        background-position: right 15px center;\r\n        background-size: 18px;\r\n    }\r\n\r\n    #filters-container select:hover {\r\n        border-color: #e85d21;\r\n        box-shadow: 0 3px 10px rgba(232, 93, 33, 0.1);\r\n    }\r\n\r\n    \/* ===== \u0622\u0645\u0627\u0631 \u06af\u0627\u0644\u0631\u06cc \u0648 \u0644\u0648\u062f\u06cc\u0646\u06af ===== *\/\r\n    .gallery-stats {\r\n        display: flex;\r\n        justify-content: space-between;\r\n        align-items: center;\r\n        margin: 10px 0 25px 0;\r\n        padding: 15px 0;\r\n        border-bottom: 2px solid #f0f0f0;\r\n        min-height: 70px;\r\n    }\r\n    \r\n    .stats-wrapper {\r\n        font-weight: 500;\r\n        font-size: 16px;\r\n        color: #4b5563;\r\n        background: #f8f9fa;\r\n        padding: 10px 25px;\r\n        border-radius: 40px;\r\n        box-shadow: 0 2px 8px rgba(0,0,0,0.02);\r\n    }\r\n    \r\n    \r\n    #gallery-total-count {\r\n        font-weight: 800;\r\n        color: #e85d21;\r\n        font-size: 26px;\r\n        margin-right: 5px;\r\n        transition: all 0.3s ease;\r\n    }\r\n\r\n    \/* ===== \u0644\u0648\u062f\u06cc\u0646\u06af \u067e\u06cc\u0634\u0631\u0641\u062a\u0647 ===== *\/\r\n.advanced-loader {\r\n    display: inline-flex;\r\n    align-items: center;\r\n    background: linear-gradient(135deg, #fff5f0 0%, #fff 100%);\r\n    border-radius: 50px;\r\n    padding: 8px 20px 8px 15px;\r\n    box-shadow: 0 2px 8px rgba(232, 93, 33, 0.08);  \/* \u0633\u0627\u06cc\u0647 \u06a9\u0645\u062a\u0631 *\/\r\n    border: 1px solid rgba(232, 93, 33, 0.2);\r\n    animation: loaderPulse 2s ease infinite;\r\n}\r\n\r\n    .loader-container {\r\n        display: flex;\r\n        align-items: center;\r\n        gap: 12px;\r\n    }\r\n\r\n    .loader-dots {\r\n        display: flex;\r\n        gap: 6px;\r\n        align-items: center;\r\n    }\r\n\r\n    .loader-dot {\r\n        width: 10px;\r\n        height: 10px;\r\n        border-radius: 50%;\r\n        background: #e85d21;\r\n        animation: dotPulse 1.5s ease infinite;\r\n    }\r\n\r\n    .loader-dot:nth-child(1) { animation-delay: 0s; }\r\n    .loader-dot:nth-child(2) { animation-delay: 0.2s; }\r\n    .loader-dot:nth-child(3) { animation-delay: 0.4s; }\r\n    .loader-dot:nth-child(4) { animation-delay: 0.6s; }\r\n\r\n    .loader-text {\r\n        font-size: 14px;\r\n        font-weight: 600;\r\n        color: #e85d21;\r\n        letter-spacing: 0.5px;\r\n        background: linear-gradient(135deg, #e85d21, #f97316);\r\n        -webkit-background-clip: text;\r\n        -webkit-text-fill-color: transparent;\r\n    }\r\n\r\n    \/* ===== \u06af\u0631\u06cc\u062f \u06af\u0627\u0644\u0631\u06cc ===== *\/\r\n    .gallery-grid {\r\n        display: grid;\r\n        grid-template-columns: repeat(3, 1fr);\r\n        gap: 30px;\r\n        margin: 20px 0;\r\n        width: 100%;\r\n        transition: opacity 0.3s ease;\r\n        min-height: 400px;\r\n    }\r\n\r\n    \/* ===== Load More ===== *\/\r\n    .load-more-wrapper {\r\n        text-align: center;\r\n        margin: 50px 0 30px;\r\n        width: 100%;\r\n    }\r\n\r\n    .load-more-btn {\r\n        display: inline-flex;\r\n        align-items: center;\r\n        justify-content: center;\r\n        gap: 2px;\r\n        padding: 16px 50px;\r\n        background: white;\r\n        border: 2px solid #e85d21;\r\n        border-radius: 60px;\r\n        color: #e85d21;\r\n        font-size: 18px;\r\n        font-weight: 600;\r\n        cursor: pointer;\r\n        transition: all 0.3s ease;\r\n        box-shadow: 0 8px 20px rgba(232, 93, 33, 0.15);\r\n        position: relative;\r\n        overflow: hidden;\r\n    }\r\n\r\n    .load-more-btn:hover {\r\n        background: #e85d21;\r\n        color: white;\r\n        transform: translateY(-3px);\r\n        box-shadow: 0 15px 30px rgba(232, 93, 33, 0.3);\r\n    }\r\n\r\n    .load-more-btn:disabled {\r\n        opacity: 0.6;\r\n        cursor: not-allowed;\r\n        transform: none;\r\n        box-shadow: none;\r\n    }\r\n\r\n    .btn-spinner {\r\n        display: inline-block;\r\n        width: 20px;\r\n        height: 20px;\r\n        border: 3px solid rgba(232, 93, 33, 0.3);\r\n        border-top-color: #e85d21;\r\n        border-radius: 50%;\r\n        animation: spin 0.8s linear infinite;\r\n        opacity: 0;\r\n        transition: opacity 0.3s;\r\n    }\r\n\r\n    .load-more-btn:disabled .btn-spinner {\r\n        opacity: 1;\r\n    }\r\n\r\n    \/* ===== \u0627\u0646\u06cc\u0645\u06cc\u0634\u0646\u200c\u0647\u0627 ===== *\/\r\n    @keyframes dotPulse {\r\n        0%, 100% {\r\n            transform: scale(1);\r\n            opacity: 1;\r\n            background: #e85d21;\r\n        }\r\n        50% {\r\n            transform: scale(1.5);\r\n            opacity: 0.7;\r\n            background: #f97316;\r\n        }\r\n    }\r\n@keyframes loaderPulse {\r\n    0%, 100% {\r\n        box-shadow: 0 2px 8px rgba(232, 93, 33, 0.08);  \/* \u0633\u0627\u06cc\u0647 \u06a9\u0645\u062a\u0631 *\/\r\n    }\r\n    50% {\r\n        box-shadow: 0 4px 12px rgba(232, 93, 33, 0.12);  \/* \u0633\u0627\u06cc\u0647 \u06a9\u0645\u062a\u0631 *\/\r\n    }\r\n}\r\n\r\n    @keyframes spin {\r\n        to { transform: rotate(360deg); }\r\n    }\r\n\r\n    @keyframes slideIn {\r\n        from {\r\n            opacity: 0;\r\n            transform: translateY(20px);\r\n        }\r\n        to {\r\n            opacity: 1;\r\n            transform: translateY(0);\r\n        }\r\n    }\r\n\r\n    .gallery-grid > * {\r\n        animation: slideIn 0.4s ease forwards;\r\n    }\r\n\r\n    \/* ===== No Posts ===== *\/\r\n    .no-posts {\r\n        width: 100%;\r\n        text-align: center;\r\n        padding: 80px 20px;\r\n        font-size: 18px;\r\n        color: #6b7280;\r\n        background: #f9fafb;\r\n        border-radius: 30px;\r\n        grid-column: 1 \/ -1;\r\n        border: 2px dashed #e0e0e0;\r\n    }\r\n    \r\n    .no-posts.error {\r\n        background: #fff5f5;\r\n        color: #dc2626;\r\n        border-color: #fecaca;\r\n    }\r\n\r\n    \/* ===== \u0631\u06cc\u0633\u067e\u0627\u0646\u0633\u06cc\u0648 ===== *\/\r\n    @media (max-width: 1200px) {\r\n        .gallery-grid {\r\n            grid-template-columns: repeat(2, 1fr);\r\n            gap: 25px;\r\n        }\r\n    }\r\n\r\n    @media (max-width: 992px) {\r\n        #filters-container select {\r\n            flex: 1 1 calc(50% - 15px);\r\n            min-width: 200px;\r\n        }\r\n    }\r\n\r\n    @media (max-width: 768px) {\r\n        #filters-container select {\r\n            flex: 1 1 100%;\r\n            min-width: 100%;\r\n        }\r\n        \r\n        .gallery-grid {\r\n            grid-template-columns: 1fr;\r\n            gap: 20px;\r\n        }\r\n        \r\n        .gallery-stats {\r\n            flex-direction: column;\r\n            gap: 15px;\r\n            align-items: flex-start;\r\n        }\r\n        \r\n        .stats-wrapper {\r\n            width: 100%;\r\n            text-align: center;\r\n        }\r\n        \r\n        .advanced-loader {\r\n            width: 100%;\r\n            justify-content: center;\r\n        }\r\n    }\r\n\r\n    @media (max-width: 480px) {\r\n        .gallery-grid {\r\n            gap: 15px;\r\n        }\r\n        \r\n        .load-more-btn {\r\n            width: 100%;\r\n            padding: 14px 20px;\r\n        }\r\n        \r\n        .loader-text {\r\n            font-size: 13px;\r\n        }\r\n    }\r\n    \r\n    \/* ===== \u0631\u0648\u0634 \u06f1: \u062a\u063a\u06cc\u06cc\u0631 \u0627\u0633\u062a\u0627\u06cc\u0644 \u0633\u0644\u06a9\u062a \u0641\u0639\u0627\u0644 ===== *\/\r\n#filters-container select.filter-active {\r\n    border-color: #e85d21 !important;\r\n    border-width: 2px !important;\r\n    background-color: #fff8f5 !important;\r\n    color: #e85d21 !important;\r\n    font-weight: 600 !important;\r\n    box-shadow: 0 4px 12px rgba(232, 93, 33, 0.15) !important;\r\n    background-image: url(\"data:image\/svg+xml,%3Csvg xmlns='http:\/\/www.w3.org\/2000\/svg' width='20' height='20' viewBox='0 0 24 24' fill='none' stroke='%23e85d21' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpolyline points='6 9 12 15 18 9'%3E%3C\/polyline%3E%3C\/svg%3E\") !important;\r\n}\r\n\r\n\/* ===== \u0631\u0648\u0634 \u06f2: \u0646\u0645\u0627\u06cc\u0634 \u0686\u06cc\u067e\u200c\u0647\u0627\u06cc \u0641\u06cc\u0644\u062a\u0631\u0647\u0627\u06cc \u0641\u0639\u0627\u0644 ===== *\/\r\n.active-filters-panel {\r\n    display: flex;\r\n    flex-wrap: wrap;\r\n    align-items: center;\r\n    gap: 10px;\r\n    margin: 10px 0 20px 0;\r\n    padding: 10px 0;\r\n    min-height: 40px;\r\n}\r\n\r\n.active-filters-title {\r\n    font-size: 14px;\r\n    font-weight: 500;\r\n    color: #6b7280;\r\n    margin-right: 5px;\r\n}\r\n\r\n.active-filter-chip {\r\n    display: inline-flex;\r\n    align-items: center;\r\n    gap: 8px;\r\n    padding: 8px 15px;\r\n    background: linear-gradient(135deg, #fff5f0 0%, #fff 100%);\r\n    border: 1px solid #e85d21;\r\n    border-radius: 30px;\r\n    font-size: 13px;\r\n    font-weight: 500;\r\n    color: #e85d21;\r\n    box-shadow: 0 2px 8px rgba(232, 93, 33, 0.1);\r\n    animation: chipSlideIn 0.3s ease;\r\n}\r\n\r\n.active-filter-chip span {\r\n    max-width: 150px;\r\n    white-space: nowrap;\r\n    overflow: hidden;\r\n    text-overflow: ellipsis;\r\n}\r\n\r\n.active-filter-chip button {\r\n    background: none;\r\n    border: none;\r\n    color: #e85d21;\r\n    font-size: 16px;\r\n    cursor: pointer;\r\n    padding: 0 0 0 5px;\r\n    display: flex;\r\n    align-items: center;\r\n    justify-content: center;\r\n    transition: all 0.2s ease;\r\n}\r\n\r\n.active-filter-chip button:hover {\r\n    color: #c44c1a;\r\n    transform: scale(1.2);\r\n}\r\n\r\n@keyframes chipSlideIn {\r\n    from {\r\n        opacity: 0;\r\n        transform: translateX(-10px);\r\n    }\r\n    to {\r\n        opacity: 1;\r\n        transform: translateX(0);\r\n    }\r\n}\r\n\r\n.clear-all-filters {\r\n    background: none;\r\n    border: none;\r\n    color: #9ca3af;\r\n    font-size: 12px;\r\n    cursor: pointer;\r\n    text-decoration: underline;\r\n    margin-left: 10px;\r\n    transition: color 0.2s ease;\r\n}\r\n\r\n.clear-all-filters:hover {\r\n    color: #e85d21;\r\n}\r\n<\/style>\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t","protected":false},"excerpt":{"rendered":"<p>Media Library Select Section Select Subsection Select Subject Select Year Active filters: Clear all 0 Items Found Loading gallery&#8230; Load More<\/p>\n","protected":false},"author":1,"featured_media":0,"parent":0,"menu_order":0,"comment_status":"closed","ping_status":"closed","template":"","meta":{"_acf_changed":false,"footnotes":""},"class_list":["post-2704","page","type-page","status-publish","hentry"],"acf":[],"_links":{"self":[{"href":"https:\/\/amiseminary.org\/brothers\/wp-json\/wp\/v2\/pages\/2704","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/amiseminary.org\/brothers\/wp-json\/wp\/v2\/pages"}],"about":[{"href":"https:\/\/amiseminary.org\/brothers\/wp-json\/wp\/v2\/types\/page"}],"author":[{"embeddable":true,"href":"https:\/\/amiseminary.org\/brothers\/wp-json\/wp\/v2\/users\/1"}],"replies":[{"embeddable":true,"href":"https:\/\/amiseminary.org\/brothers\/wp-json\/wp\/v2\/comments?post=2704"}],"version-history":[{"count":262,"href":"https:\/\/amiseminary.org\/brothers\/wp-json\/wp\/v2\/pages\/2704\/revisions"}],"predecessor-version":[{"id":3596,"href":"https:\/\/amiseminary.org\/brothers\/wp-json\/wp\/v2\/pages\/2704\/revisions\/3596"}],"wp:attachment":[{"href":"https:\/\/amiseminary.org\/brothers\/wp-json\/wp\/v2\/media?parent=2704"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}