//
// Component: Pagination
//
// ========================================================================


// Variables
// ========================================================================

//
// New
//

@pagination-item-border-mode:                            ~'';

@pagination-item-border-width:                           0;

@pagination-item-border:                                 transparent;
@pagination-item-hover-border:                           transparent;
@pagination-item-active-border:                          transparent;
@pagination-item-disabled-border:                        transparent;


// Component
// ========================================================================

.hook-pagination() {}


// Items
// ========================================================================

.hook-pagination-item() when not (@pagination-item-border-width = 0) {
    border@{pagination-item-border-mode}: @pagination-item-border-width solid @pagination-item-border;
}

.hook-pagination-item-hover() when not (@pagination-item-border-width = 0) {
    border@{pagination-item-border-mode}-color: @pagination-item-hover-border;
}

.hook-pagination-item-active() when not (@pagination-item-border-width = 0) {
    border@{pagination-item-border-mode}-color: @pagination-item-active-border;
}

.hook-pagination-item-disabled() when not (@pagination-item-border-width = 0) {
    border@{pagination-item-border-mode}-color: @pagination-item-disabled-border;
}


// Miscellaneous
// ========================================================================

.hook-pagination-misc() {}


// Inverse
// ========================================================================

@inverse-pagination-item-border:                                 transparent;
@inverse-pagination-item-hover-border:                           transparent;
@inverse-pagination-item-active-border:                          transparent;
@inverse-pagination-item-disabled-border:                        transparent;

.hook-inverse-pagination-item() when not (@pagination-item-border-width = 0) {
    border@{pagination-item-border-mode}-color: @inverse-pagination-item-border;
}
.hook-inverse-pagination-item-hover() when not (@pagination-item-border-width = 0) {
    border@{pagination-item-border-mode}-color: @inverse-pagination-item-hover-border;
}
.hook-inverse-pagination-item-active() when not (@pagination-item-border-width = 0) {
    border@{pagination-item-border-mode}-color: @inverse-pagination-item-active-border;
}
.hook-inverse-pagination-item-disabled() when not (@pagination-item-border-width = 0) {
    border@{pagination-item-border-mode}-color: @inverse-pagination-item-disabled-border;
}