.latest-pagination{width:100%;text-align:center;margin-top:22px;margin-bottom:22px;padding:5px;clear:both;white-space:nowrap}
.latest-pagination .page-btn{display:inline-flex;align-items:center;justify-content:center;min-width:38px;height:38px;line-height:38px;padding:0 10px;margin:2px;border:1px solid #ddd;border-radius:6px;background:#fff;color:#000;text-decoration:none;font-size:14px;font-weight:500;vertical-align:middle;box-sizing:border-box;transition:all 0.2s ease}
.latest-pagination .page-btn:hover{background:#5bbc2e;border-color:#5bbc2e;color:#fff;text-decoration:none}
.latest-pagination .page-btn.active{background:#5bbc2e;border-color:#5bbc2e;color:#fff;font-weight:600;box-shadow:0 2px 5px rgba(91,188,46,0.25)}
.latest-pagination .nav-btn{position:relative;min-width:105px;height:40px;padding:0 16px;margin-left:5px;margin-right:5px;border:1px solid #d7d7d7;border-radius:20px;background:linear-gradient( 135deg,#ffffff,#f5f5f5 );color:#000;font-size:14px;font-weight:600;line-height:40px;box-shadow:0 2px 5px rgba(0,0,0,0.08);transition:all 0.25s ease}
.latest-pagination .prev-btn i{font-size:18px;margin-right:7px;transition:transform 0.25s ease}
.latest-pagination .next-btn i{font-size:18px;margin-left:7px;transition:transform 0.25s ease}
.latest-pagination .prev-btn:hover{background:linear-gradient( 135deg,#5bbc2e,#4da822 );border-color:#5bbc2e;color:#fff;text-decoration:none;box-shadow:0 4px 10px rgba(91,188,46,0.25);transform:translateX(-2px)}
.latest-pagination .prev-btn:hover i{transform:translateX(-3px)}
.latest-pagination .next-btn:hover{background:linear-gradient( 135deg,#5bbc2e,#4da822 );border-color:#5bbc2e;color:#fff;text-decoration:none;box-shadow:0 4px 10px rgba(91,188,46,0.25);transform:translateX(2px)}
.latest-pagination .next-btn:hover i{transform:translateX(3px)}
.latest-pagination .nav-btn:active{transform:scale(0.97)}
.latest-pagination .page-dots{display:inline-flex;align-items:center;justify-content:center;min-width:25px;height:38px;line-height:38px;margin:2px 4px;color:#000;font-size:14px;vertical-align:middle}
@media (max-width:767px){
.latest-pagination{margin-top:18px;margin-bottom:18px;padding:5px 2px;overflow-x:auto;-webkit-overflow-scrolling:touch}
.latest-pagination .page-btn{min-width:34px;height:34px;line-height:34px;padding:0 7px;margin:2px;border-radius:5px;font-size:13px}
.latest-pagination .nav-btn{min-width:88px;height:36px;line-height:36px;padding:0 11px;margin-left:3px;margin-right:3px;border-radius:18px;font-size:13px}
.latest-pagination .nav-btn i{font-size:16px}
.latest-pagination .prev-btn i{margin-right:5px}
.latest-pagination .next-btn i{margin-left:5px}
.latest-pagination .page-dots{min-width:18px;height:34px;line-height:34px;margin:2px 3px;font-size:13px}
}
@media (max-width:380px){
.latest-pagination .page-btn{min-width:30px;height:32px;line-height:32px;padding:0 5px;margin:1px;font-size:12px}
.latest-pagination .nav-btn{min-width:78px;height:32px;line-height:32px;padding:0 8px;margin-left:2px;margin-right:2px;border-radius:16px;font-size:12px}
.latest-pagination .nav-btn i{font-size:14px}
.latest-pagination .page-dots{min-width:15px;height:32px;line-height:32px;margin:1px 2px;font-size:12px}
}
.swap-col{position:relative}
.swap-btn{width:42px;height:42px;padding:0;border-radius:50%;border:1px solid #cfe9bd;background:#fff;color:#5bbc2e;font-size:16px;line-height:1;cursor:pointer;box-shadow:0 1px 4px rgba(0,0,0,.08);transition:background .2s,color .2s,box-shadow .2s,transform .15s;-webkit-tap-highlight-color:transparent}
.swap-btn:focus{outline:none}
@media (hover:hover){
.swap-btn:hover{background:#5bbc2e;color:#fff;box-shadow:0 2px 8px rgba(91,188,46,.4)}
}
.swap-btn:focus-visible{box-shadow:0 0 0 3px rgba(91,188,46,.35)}
.swap-btn:active{transform:scale(.92)}
.swap-btn i{display:inline-block;transition:transform .4s ease}
.swap-btn.swapping i{transform:rotate(180deg)}
.swap-btn.shake{animation:swapShake .4s;border-color:#e0b4b4}
@keyframes swapShake{0%,100%{transform:translateX(0)}20%,60%{transform:translateX(-4px)}40%,80%{transform:translateX(4px)}}
.swap-tip{display:none;position:absolute;left:50%;top:100%;transform:translateX(-50%);margin-top:4px;padding:4px 8px;border-radius:4px;background:#444;color:#fff;font-size:11px;line-height:1.3;white-space:nowrap;z-index:20}
.swap-tip.show{display:block}
@media (max-width:767px){
.swap-col{margin:2px 0 6px}
.swap-btn i{transform:rotate(90deg)}
.swap-btn.swapping i{transform:rotate(270deg)}
}
