.#{$prefix}datepicker {
    position: relative;

    .#{$prefix}monthpicker {
        left: 0;
        top: 0;
        display: block;
    }

    .#{$prefix}monthpicker-months,
    .#{$prefix}monthpicker-years {
        height: 100%;
    }
}

.#{$prefix}datepicker-inner {
    table-layout: fixed;
    width: 100%;
    border-collapse: separate;
}

.#{$prefix}datepicker-cell {
    padding: 0;
}

.#{$prefix}datepicker-header {
    position: relative;
}

.#{$prefix}datepicker-arrow {
    position: absolute;
    outline: none;
    font-size: 0;

    @if $enable-font-icons {
        display: table;
        &:before {
            display: table-cell;
            text-align: center;
            vertical-align: middle;
        }
    }
}

.#{$prefix}datepicker-column-header {
    padding: 0;
}

.#{$prefix}datepicker-date {
    display: block;
    text-decoration: none;
}

.#{$prefix}monthpicker {
    display: table;
}
.#{$prefix}monthpicker-body {
    height: 100%;
    position: relative; // so that monthpicker buttons can be absolutely positioned inside
}

.#{$prefix}monthpicker-months,
.#{$prefix}monthpicker-years {
    float: left;
}

.#{$prefix}monthpicker-item {
    float: left;
}

.#{$prefix}monthpicker-item-inner {
    display: block;
    text-decoration: none;
}

.#{$prefix}monthpicker-yearnav-button-ct {
    float: left;
    text-align: center;
}

.#{$prefix}monthpicker-yearnav-button {
    display: inline-block;
    outline: none;
    font-size: 0;
}

.#{$prefix}monthpicker-buttons {
    width: 100%;
}

.#{$prefix}datepicker .#{$prefix}monthpicker-buttons {
    position: absolute;
    bottom: 0;
}

.#{$prefix}datepicker-month .#{$prefix}btn-split > .#{$prefix}btn-button:after {
    // hide the split border
    content: none;
}