/*
 * INSTAY board common components
 * - category tabs for category-enabled community boards
 * - Gnuboard paging reset shared by every INSTAY board skin
 */

.instay-board-categories {
    overflow: hidden;
    margin: -26px 0 44px;
    padding-bottom: 18px;
    border-bottom: 1px solid var(--ic-line, #d9cec1);
}
.instay-board-categories ul {
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
    margin: 0;
    padding: 0;
    list-style: none;
}
.instay-board-categories li { margin: 0; padding: 0; }
.instay-board-categories a {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-height: 42px;
    padding: 0 19px;
    border: 1px solid var(--ic-line, #d9cec1);
    border-radius: 0;
    background: #fff;
    color: var(--ic-muted, #74695e) !important;
    font-size: 13px;
    font-weight: 750;
    line-height: 1;
    text-decoration: none;
    white-space: nowrap;
    transition: border-color .18s ease, background-color .18s ease, color .18s ease;
}
.instay-board-categories a:hover,
.instay-board-categories a:focus-visible,
.instay-board-categories a.is-active {
    border-color: var(--ic-dark, #211b17);
    background: var(--ic-dark, #211b17);
    color: #fff !important;
}

.instay-community-paging,
.instay-magazine-pagination,
.instay-magazine-paging,
.instay-coordibook-paging {
    display: block !important;
    clear: both !important;
    width: 100% !important;
    margin: 54px 0 0 !important;
    padding: 0 !important;
    text-align: center !important;
}

:is(.instay-community-paging, .instay-magazine-pagination, .instay-magazine-paging, .instay-coordibook-paging) .pg_wrap {
    display: block !important;
    float: none !important;
    width: 100% !important;
    margin: 0 !important;
    padding: 0 !important;
    text-align: center !important;
}
:is(.instay-community-paging, .instay-magazine-pagination, .instay-magazine-paging, .instay-coordibook-paging) .pg {
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    gap: 6px !important;
    margin: 0 !important;
    padding: 0 !important;
    background: transparent !important;
    text-align: center !important;
    font-size: 0 !important;
}
:is(.instay-community-paging, .instay-magazine-pagination, .instay-magazine-paging, .instay-coordibook-paging) .pg_page,
:is(.instay-community-paging, .instay-magazine-pagination, .instay-magazine-paging, .instay-coordibook-paging) .pg_current {
    display: inline-flex !important;
    float: none !important;
    align-items: center !important;
    justify-content: center !important;
    width: 44px !important;
    min-width: 44px !important;
    height: 44px !important;
    margin: 0 !important;
    padding: 0 !important;
    border: 1px solid var(--ic-line, var(--mg-line, var(--cb-line, #d9cec1))) !important;
    border-radius: 0 !important;
    background: #fff !important;
    background-image: none !important;
    box-shadow: none !important;
    color: #74695e !important;
    font-family: Pretendard, "Noto Sans KR", "Apple SD Gothic Neo", sans-serif !important;
    font-size: 13px !important;
    font-weight: 750 !important;
    line-height: 1 !important;
    text-align: center !important;
    text-decoration: none !important;
    text-indent: 0 !important;
    vertical-align: top !important;
}
:is(.instay-community-paging, .instay-magazine-pagination, .instay-magazine-paging, .instay-coordibook-paging) .pg_current {
    border-color: #211b17 !important;
    background: #211b17 !important;
    color: #fff !important;
}
:is(.instay-community-paging, .instay-magazine-pagination, .instay-magazine-paging, .instay-coordibook-paging) a.pg_page:hover,
:is(.instay-community-paging, .instay-magazine-pagination, .instay-magazine-paging, .instay-coordibook-paging) a.pg_page:focus-visible {
    border-color: #211b17 !important;
    color: #211b17 !important;
}
:is(.instay-community-paging, .instay-magazine-pagination, .instay-magazine-paging, .instay-coordibook-paging) :is(.pg_start, .pg_prev, .pg_next, .pg_end) {
    overflow: hidden !important;
    font-size: 0 !important;
}
:is(.instay-community-paging, .instay-magazine-pagination, .instay-magazine-paging, .instay-coordibook-paging) :is(.pg_start, .pg_prev, .pg_next, .pg_end)::before {
    display: block;
    color: inherit;
    font: 500 18px/1 Arial, sans-serif;
}
:is(.instay-community-paging, .instay-magazine-pagination, .instay-magazine-paging, .instay-coordibook-paging) .pg_start::before { content: "«"; }
:is(.instay-community-paging, .instay-magazine-pagination, .instay-magazine-paging, .instay-coordibook-paging) .pg_prev::before { content: "‹"; }
:is(.instay-community-paging, .instay-magazine-pagination, .instay-magazine-paging, .instay-coordibook-paging) .pg_next::before { content: "›"; }
:is(.instay-community-paging, .instay-magazine-pagination, .instay-magazine-paging, .instay-coordibook-paging) .pg_end::before { content: "»"; }

@media (max-width: 760px) {
    .instay-board-categories {
        overflow-x: auto;
        margin: -14px 0 34px;
        padding-bottom: 14px;
        scrollbar-width: none;
    }
    .instay-board-categories::-webkit-scrollbar { display: none; }
    .instay-board-categories ul { flex-wrap: nowrap; width: max-content; }
    .instay-board-categories a { min-height: 40px; padding: 0 15px; font-size: 12px; }

    .instay-community-paging,
    .instay-magazine-pagination,
    .instay-magazine-paging,
    .instay-coordibook-paging { margin-top: 42px !important; }

    :is(.instay-community-paging, .instay-magazine-pagination, .instay-magazine-paging, .instay-coordibook-paging) .pg { gap: 4px !important; }
    :is(.instay-community-paging, .instay-magazine-pagination, .instay-magazine-paging, .instay-coordibook-paging) .pg_page,
    :is(.instay-community-paging, .instay-magazine-pagination, .instay-magazine-paging, .instay-coordibook-paging) .pg_current {
        width: 40px !important;
        min-width: 40px !important;
        height: 40px !important;
        font-size: 12px !important;
    }
}