/**
 * Blog listing redesign — load-more button + related searches.
 *
 * Replaces the old numbered pagination (1 2 3 4 ... Older posts) with a
 * single centered "More posts" pill, and adds a Google-style "People
 * also search for" list underneath, sourced from the site's own tags.
 * Purely additive: loaded after style.css, nothing here is removed from
 * the base theme.
 */

.gridbit-load-more-nav{
    text-align:center;
    margin:8px 0 40px 0;
    padding:0;
    border:none;
}

.gridbit-load-more-btn{
    display:inline-flex;
    align-items:center;
    gap:10px;
    font-family:-apple-system,BlinkMacSystemFont,'Segoe UI',Roboto,Helvetica,Arial,sans-serif;
    font-size:14px;
    font-weight:600;
    color:#3a7bd5;
    background:#ffffff;
    border:1px solid #dbe3f0;
    border-radius:999px;
    padding:13px 26px;
    cursor:pointer;
    transition:background .18s ease, border-color .18s ease, color .18s ease;
}
.gridbit-load-more-btn:hover,
.gridbit-load-more-btn:focus-visible{
    background:#f4f6fb;
    border-color:#3a7bd5;
}
.gridbit-load-more-btn:active{transform:translateY(1px);}
.gridbit-load-more-btn i{font-size:12px;transition:transform .18s ease;}
.gridbit-load-more-btn:hover i{transform:translateY(2px);}

.gridbit-load-more-btn.is-loading{
    color:#5b6478;
    cursor:default;
    pointer-events:none;
}
.gridbit-load-more-btn.is-loading i{
    animation:gridbit-lm-spin .8s linear infinite;
}
@keyframes gridbit-lm-spin{
    from{transform:rotate(0deg);}
    to{transform:rotate(360deg);}
}

/* ---------- People also search for ---------- */

.gridbit-related-searches{
    max-width:640px;
    margin:0 auto 40px auto;
}

.gridbit-related-searches-title{
    font-family:-apple-system,BlinkMacSystemFont,'Segoe UI',Roboto,Helvetica,Arial,sans-serif;
    font-size:15px;
    font-weight:700;
    color:#1a2233;
    text-align:left;
    margin:0 0 4px 0;
    padding:0 4px;
}

.gridbit-related-searches-list{
    background:#ffffff;
    border:1px solid #e2e8f0;
}

.gridbit-related-search-row{
    display:flex;
    align-items:center;
    gap:14px;
    padding:14px 16px;
    font-family:-apple-system,BlinkMacSystemFont,'Segoe UI',Roboto,Helvetica,Arial,sans-serif;
    font-size:14px;
    color:#1a2233;
    text-decoration:none;
    border-bottom:1px solid #e2e8f0;
    transition:background .15s ease;
}
.gridbit-related-searches-list a.gridbit-related-search-row:last-child{border-bottom:none;}
.gridbit-related-search-row:hover,
.gridbit-related-search-row:focus-visible{
    background:#f4f6fb;
    color:#1a2233;
}
.gridbit-related-search-row .fa-search{
    color:#5b6478;
    font-size:13px;
    flex-shrink:0;
}
.gridbit-related-search-label{flex:1;font-weight:500;}
.gridbit-related-search-go{
    color:#c3cbdb;
    font-size:12px;
    opacity:0;
    transform:translateX(-4px);
    transition:opacity .15s ease, transform .15s ease;
}
.gridbit-related-search-row:hover .gridbit-related-search-go{
    opacity:1;
    transform:translateX(0);
    color:#3a7bd5;
}

@media only screen and (max-width:480px){
    .gridbit-related-search-row{padding:12px 14px;font-size:13px;}
}

/* ---------- Dark mode ---------- */

html[data-urs-theme='dark'] .gridbit-load-more-btn{
    background:#131b30;
    border-color:#1e2a45;
    color:#60a5fa;
}
html[data-urs-theme='dark'] .gridbit-load-more-btn:hover{
    background:#1a2540;
    border-color:#3a7bd5;
}
html[data-urs-theme='dark'] .gridbit-load-more-btn.is-loading{color:#8892aa;}

html[data-urs-theme='dark'] .gridbit-related-searches-title{color:#e8ecf5;}
html[data-urs-theme='dark'] .gridbit-related-searches-list{
    background:#0f1828;
    border-color:#1e2a45;
}
html[data-urs-theme='dark'] .gridbit-related-search-row{
    color:#e8ecf5;
    border-bottom-color:#1e2a45;
}
html[data-urs-theme='dark'] .gridbit-related-search-row:hover{
    background:#1a2540;
    color:#e8ecf5;
}
html[data-urs-theme='dark'] .gridbit-related-search-row .fa-search{color:#8892aa;}