.datepicker__main {
    width: auto; // ie hack
    width: initial;
    font-family: @fb-font-family-sans-serif;
    outline: 0;
    @border-color: #cccccc;
    @gutter: 10px;

    table {
        min-height: 270px;

        th td:last-child {
            border-right-width: 0;
        }

        th.today {
            border-width: 1px 0 0 0;
        }
    }

    td, th {
        border: 1px solid @fb-color-grey;
        border-width: 0px 1px 1px 0;
        font-weight: normal;
        text-shadow: none;
        border-radius: 0;
    }


    &.datepicker-orient-top {
        position: absolute;
        margin-top: @gutter;
        //.create-arrow-pointing-up-with-border();//50%, 5px, 1px, #fff, rgba(0, 0, 0, 0.15));
        &:after {
            border-bottom-color: @fb-color-grey-light;
        }
    }

    &.datepicker-orient-bottom {
        position: absolute;
        top: -270px - @gutter;
        margin-bottom: @gutter;
        //.create-arrow-pointing-down-with-border();//50%, 5px, 1px, #fff, rgba(0, 0, 0, 0.15));
    }

    .next {
        border-right: none;
    }

    .next, .prev {
        font-size: 16px;
    }

    .datepicker-months, .datepicker-years {
        table td {
            border-width: 0;
        }

        thead {
            tr {
                &:first-child {
                    th {
                        border-color: @border-color;
                        background-color: @fb-color-grey-light;
                    }
                }
            }

            th {
                &:hover {
                    background: transparent;
                }
            }
        }

        span.year, span.month {
            border-radius: 0;

            &.active, &.active:hover {
                background: @fb-color-primary;
            }
        }
    }

    .datepicker-days {
        thead {
            tr {
                &:first-child {
                    th {
                        border-color: @border-color;
                        background-color: @fb-color-grey-light;
                    }
                }

                &:last-child {
                    color: @fb-color-grey-medium;
                    font-size: @fb-font-size-base-small;
                }
            }

            th {
                &:hover {
                    background: transparent;
                }

                &:last-child {
                    border-right: none;
                }
            }
        }

        td {
            padding: 0px 6px;

            &:last-child {
                border-right: 0px;
            }

            &.today, &.today:hover {
                background-color: @fb-color-grey;
                border-color: @fb-color-grey;
            }

            &.today:hover {
                background-color: #eeeeee;
                border-color: @fb-color-grey;
            }
        }
    }

    td {
        // veckonummer
        &.cw {
            color: @fb-color-grey-medium;
            font-size: @fb-font-size-base-small;
        }

        &.selected {
            &.day {
                &:hover {
                    border-color: @fb-color-grey;
                    color: @fb-color-typography;
                }

                &.active:hover {
                    color: @fb-color-white;
                }
            }
        }

        &.day, &.month, &.year {
            &.selected {
                background: @fb-color-grey;
                border-color: @fb-color-grey;
                color: @fb-color-typography;

                &:hover {
                    background-color: @fb-color-grey;
                }
            }

            &.active, &span.active {
                background-color: @fb-color-primary;
                //text-shadow: none;
                border-color: @fb-color-grey;
                color: @fb-color-white;

                &:hover {
                    background-color: @fb-color-primary;
                    border-color: @fb-color-grey;
                }
            }

            &.old, &.new {
                color: @fb-color-grey-medium;
                //background: @fb-color-grey;
                border-color: @fb-color-grey;
            }
        }
    }
}