.pagination{display:flex;justify-content:center;align-items:center;gap:12px;margin:40px 0;flex-wrap:wrap}
.pagination a,.pagination span{padding:12px 20px;text-decoration:none;border:none;color:#444;border-radius:8px;transition:all .3s ease;font-weight:500;box-shadow:0 2px 5px rgba(0,0,0,.1);background:#fff;font-size:15px}
.pagination a:hover:not(.current){background:#f0f7ff;box-shadow:0 4px 12px rgba(0,123,255,.2);transform:translateY(-1px)}
.pagination .current{background:linear-gradient(135deg,#007bff,#0056b3);color:#fff;box-shadow:0 4px 12px rgba(0,123,255,.3);font-weight:600}
.pagination .dots{color:#888;padding:12px 8px;box-shadow:none;background:0 0;cursor:default}
.pagination .next,.pagination .prev{background:#f8f9fa;color:#555;display:flex;align-items:center;gap:6px}
.pagination .next:hover,.pagination .prev:hover{background:linear-gradient(135deg,#6c757d,#495057);color:#103dd1}
@media (max-width:768px){
.pagination{gap:6px;flex-wrap:wrap}
.pagination a,.pagination span{padding:8px 12px;font-size:13px}
.pagination .next,.pagination .prev{white-space:nowrap;font-size:12px}
}
@media (max-width:480px){
.pagination{justify-content:flex-start;overflow-x:auto;-webkit-overflow-scrolling:touch;gap:4px;padding-bottom:10px}
.pagination::-webkit-scrollbar{height:6px}
.pagination::-webkit-scrollbar-track{background:#f1f1f1;border-radius:3px}
.pagination::-webkit-scrollbar-thumb{background:#ccc;border-radius:3px}
}