.custom-pagination{display:-webkit-box;display:-ms-flexbox;display:flex;gap:16px;-webkit-box-align:center;-ms-flex-align:center;align-items:center;-webkit-box-pack:start;-ms-flex-pack:start;justify-content:flex-start;padding:0}.custom-pagination__dot{height:5px;width:6px;margin:5px;background-color:#222;border-radius:2px;cursor:pointer;-webkit-transition:all .3s ease;transition:all .3s ease;outline:none}.custom-pagination__dot:hover{background-color:rgba(34,34,34,.6)}.custom-pagination__dot:focus-visible{outline:2px solid #222;outline-offset:2px}.custom-pagination__dot.active{background-color:#222;width:24px}.custom-pagination[data-color]:not([data-color=""]) .custom-pagination__dot{background-color:rgba(var(--pagination-color),.2)}.custom-pagination[data-color]:not([data-color=""]) .custom-pagination__dot:hover{background-color:rgba(var(--pagination-color),.6)}.custom-pagination[data-color]:not([data-color=""]) .custom-pagination__dot:focus-visible{outline-color:rgb(var(--pagination-color))}.custom-pagination[data-color]:not([data-color=""]) .custom-pagination__dot.active{background-color:rgb(var(--pagination-color))}.custom-pagination--center{-webkit-box-pack:center;-ms-flex-pack:center;justify-content:center}.custom-pagination--right{-webkit-box-pack:end;-ms-flex-pack:end;justify-content:flex-end}.custom-pagination--compact{gap:16px;padding:16px}.custom-pagination--small .custom-pagination__dot{height:2px;width:64px}.custom-pagination--large .custom-pagination__dot{height:6px;width:128px}