/* ==================================================
   PAGINATION — Driveandgo
================================================== */

#pagination{
  display:flex;
  justify-content:center;
  align-items:center;
  flex-wrap:wrap;
  gap:10px;
}

#pagination .pg-page,
#pagination .pg-arrow,
#pagination .pg-dots,
#pagination button{
  min-width:44px;
  height:44px;
  padding:0 12px;
  display:inline-flex;
  align-items:center;
  justify-content:center;
  border-radius:999px;
  border:1px solid rgba(233,135,67,.18);
  background:rgba(255,250,245,.94);
  color:#17120d;
  font-size:14px;
  font-weight:900;
  box-shadow:0 12px 28px rgba(120,74,36,.10);
  transition:transform .14s ease, border-color .14s ease, box-shadow .14s ease, background .14s ease;
}

#pagination .pg-page:hover,
#pagination .pg-arrow:hover,
#pagination button:hover{
  transform:translateY(-1px);
  border-color:rgba(233,135,67,.32);
  background:#fff7ef;
  color:#d87431;
  box-shadow:0 16px 34px rgba(120,74,36,.14), 0 0 0 1px rgba(233,135,67,.10);
}

#pagination .pg-page.active,
#pagination button.active{
  background:linear-gradient(135deg, #e98743, #f0a15e);
  border-color:transparent;
  color:#fff;
  box-shadow:0 16px 34px rgba(233,135,67,.24);
  cursor:default;
}

#pagination .disabled{
  opacity:.45;
  pointer-events:none;
  box-shadow:none;
}

#pagination .pg-dots{
  background:transparent;
  border-color:transparent;
  box-shadow:none;
  min-width:auto;
  padding:0 4px;
}

@media (max-width:768px){
  #pagination{
    gap:8px;
  }

  #pagination .pg-page,
  #pagination .pg-arrow,
  #pagination button{
    min-width:40px;
    height:40px;
    font-size:13px;
  }
}