.damo-pagination {

 display: flex;
 vertical-align: middle;
 font-size: var(--damo-item-font-size);
 flex-wrap: nowrap;

}

.damo-pagination .damo-pagination-prefix {

 display: flex;
 align-items: center;
 margin: var(--damo-prefix-margin);
 
}

.damo-pagination .damo-pagination-suffix {

 display: flex;
 align-items: center;
 margin: var(--damo-suffix-margin);
 
}

.damo-pagination > *:not(:first-child) {

 margin: var(--damo-item-margin);
 
}

.damo-pagination .damo-select {

 width: var(--damo-select-width);
 
}

.damo-pagination.transition-disabled .damo-pagination-item {
transition: none!important;
}

.damo-pagination .damo-pagination-quick-jumper {

 white-space: nowrap;
 display: flex;
 color: var(--damo-jumper-text-color);
 transition: color .3s var(--damo-bezier);
 align-items: center;
 font-size: var(--damo-jumper-font-size);
 
}

.damo-pagination .damo-pagination-quick-jumper .damo-input {

 margin: var(--damo-input-margin);
 width: var(--damo-input-width);
 
}

.damo-pagination .damo-pagination-item {

 position: relative;
 cursor: pointer;
 user-select: none;
 -webkit-user-select: none;
 display: flex;
 align-items: center;
 justify-content: center;
 box-sizing: border-box;
 min-width: var(--damo-item-width);
 height: var(--damo-item-height);
 padding: var(--damo-item-padding);
 background-color: var(--damo-item-color);
 color: var(--damo-item-text-color);
 border-radius: var(--damo-item-border-radius);
 fill: var(--damo-button-icon-color);
 transition:
 color .3s var(--damo-bezier),
 border-color .3s var(--damo-bezier),
 background-color .3s var(--damo-bezier),
 fill .3s var(--damo-bezier);
 
}

.damo-pagination .damo-pagination-item.damo-pagination-item--button {

 background-color: var(--damo-item-color);
 color: var(--damo-button-icon-color);
 padding: 0;
 
}

.damo-pagination .damo-pagination-item.damo-pagination-item--button .damo-base-icon {

 font-size: var(--damo-button-icon-size);
 
}

.damo-pagination .damo-pagination-item:not(.damo-pagination-item--disabled).damo-pagination-item--hover {

 background: var(--damo-item-color-active);
 color: var(--damo-item-text-color-active);

}

.damo-pagination .damo-pagination-item:not(.damo-pagination-item--disabled).damo-pagination-item--hover.damo-pagination-item--button {

 background: var(--damo-button-color-hover);
 border: var(--damo-button-border-hover);
 color: var(--damo-button-icon-color-hover);
 
}

.damo-pagination .damo-pagination-item:not(.damo-pagination-item--disabled):hover {

 background: var(--damo-item-color-active);
 color: var(--damo-item-text-color-active);

}

.damo-pagination .damo-pagination-item:not(.damo-pagination-item--disabled):hover.damo-pagination-item--button {

 background: var(--damo-button-color-hover);
 border: var(--damo-button-border-hover);
 color: var(--damo-button-icon-color-hover);
 
}

.damo-pagination .damo-pagination-item:not(.damo-pagination-item--disabled):active {

 background: var(--damo-item-color-active);
 color: var(--damo-item-text-color-active);
 
}

.damo-pagination .damo-pagination-item:not(.damo-pagination-item--disabled):active.damo-pagination-item--button {

 background: var(--damo-button-color-pressed);
 color: var(--damo-button-icon-color-pressed);
 
}

.damo-pagination .damo-pagination-item:not(.damo-pagination-item--disabled).damo-pagination-item--active {

 background: var(--damo-item-color-active);
 color: var(--damo-item-text-color-active);
 
}

.damo-pagination .damo-pagination-item:not(.damo-pagination-item--disabled).damo-pagination-item--active:hover {

 background: var(--damo-item-color-active);
 color: var(--damo-item-text-color-active);
 
}

.damo-pagination .damo-pagination-item.damo-pagination-item--disabled {

 cursor: not-allowed;
 
}

.damo-pagination .damo-pagination-item.damo-pagination-item--disabled.damo-pagination-item--active, .damo-pagination .damo-pagination-item.damo-pagination-item--disabled.damo-pagination-item--button {

 opacity: 0.3;
 
}

.damo-pagination.damo-pagination--disabled {

 cursor: not-allowed;
 
}

.damo-pagination.damo-pagination--disabled .damo-pagination-quick-jumper {

 color: var(--damo-jumper-text-color-disabled);
 
}

.damo-pagination.damo-pagination--simple {

 display: flex;
 align-items: center;
 flex-wrap: nowrap;
 
}

.damo-pagination.damo-pagination--simple .damo-pagination-quick-jumper .damo-input {

 margin: 0;
 
}