@import '~styles/schema.scss';
@import '~styles/utils.scss';

.pagingContainer {
	text-align:center;
}

.paging {
	margin: 20px auto;
	display:inline-block;
	margin-left: auto; 
  	margin-right: auto;

  	span {
  		cursor:default;
  	}

  	button {
  		padding:5px 15px;
  		margin:0px 10px;
  		font-size:$paging-button-font-size;
  		color:$paging-button-text-color;
  		background-color:$paging-button-color;
  		font-weight:600;
  		border: $paging-border-size solid $paging-border-color;
  		cursor:pointer;
  		@include rounded();

  		&:hover {
  			color:$paging-button-text-color-hover;
  			background-color:$paging-button-color-hover;
  		}

  		&:disabled {
  			color:$paging-button-text-color-disabled;
  			background-color:$paging-button-color-disabled;
  			cursor:default;
  		}
  	}


	a {
		font-size: $paging-font-size;
		font-weight: 600;
		color: $paging-font-color;

		padding: 4px 8px;
		margin:2px;
		display: inline-block;
		text-decoration: none;

		@include rounded();

		&:hover {
			color:$paging-hover-color;
			background-color:$paging-hover-text-color;
		}
	}

	a.active {
		color:$paging-active-text-color;
		background-color:$paging-active-color;
	}



}

