.vm-range-picker {
    --color: #222;
    --border: 1px solid #dadadaff;
    --hover-color: #40a9ff;

    &.dark {
        --color: #a9d5d3ff;
        --border: 1px solid #3c7073ff;
        --bg-color: #0d1a1b;
        --hover-color: white;
        .ant-picker-active-bar {
            background: #59ffe2;
        }
    }
    background-color: var(--bg-color) !important;
    border: var(--border) !important;

    .ant-picker-suffix {
        color: var(--color);
    }

    &:hover {
        border-color: var(--hover-color);
    }

    .ant-picker-input {
        input {
            color: var(--color);
        }
    }

    .ant-picker-separator {
        color: var(--color);
    }

    .ant-picker-clear {
        color: var(--color);
        background: transparent;
    }
}
.vm-select {
    &.dark {
        .ant-select-selector {
            background-color: #0d1a1b !important;
            border: 1px solid #3c7073 !important;
            .ant-select-selection-item {
                color: #a9d5d3;
            }
        }
        &:hover {
            .ant-select-selector {
                border: 1px solid #6cc9ce !important;
            }
        }
    }
}

.vm-select-dropdown {
    &.dark {
        background: #0d1a1b;
        .ant-select-item {
            color: white;
        }
        .ant-select-item-option-selected:not(.ant-select-item-option-disabled) {
            background-color: #2d575a;
        }
        .ant-select-item-option-active:not(.ant-select-item-option-disabled) {
            background-color: #1c3436;
        }
    }
}
.vm-range-picker-dropdown {
    &.dark {
        .ant-picker-range-arrow {
            background: none;
            &::before {
                background: #0d1a1be6;
            }
        }
        .ant-picker-panel-container {
            background: #0d1a1be6;
            box-shadow: 0 3px 6px -4px #ffffff1f, 0 6px 16px #ffffff14, 0 9px 28px 8px #5454540d;
            .ant-picker-header {
                button {
                    color: white;
                    &:hover {
                        color: #95fff9;
                    }
                }
            }
            .ant-picker-content {
                th {
                    color: white;
                }
                .ant-picker-cell-inner {
                    color: white;
                }
                .ant-picker-cell-in-view.ant-picker-cell-in-range::before {
                    background: #6cff2340;
                }
                .ant-picker-cell-in-view.ant-picker-cell-range-start:not(.ant-picker-cell-range-start-single)::before,
                .ant-picker-cell-in-view.ant-picker-cell-range-end:not(.ant-picker-cell-range-end-single)::before {
                    background: #6cff2340;
                }
                .ant-picker-cell-in-view.ant-picker-cell-selected .ant-picker-cell-inner,
                .ant-picker-cell-in-view.ant-picker-cell-range-start .ant-picker-cell-inner,
                .ant-picker-cell-in-view.ant-picker-cell-range-end .ant-picker-cell-inner {
                    background: #52c41a;
                }
                .ant-picker-cell:hover:not(.ant-picker-cell-in-view) .ant-picker-cell-inner,
                .ant-picker-cell:hover:not(.ant-picker-cell-selected):not(.ant-picker-cell-range-start):not(.ant-picker-cell-range-end):not(.ant-picker-cell-range-hover-start):not(.ant-picker-cell-range-hover-end)
                    .ant-picker-cell-inner {
                    background: #f5f5f55e;
                }
                .ant-picker-cell-in-view.ant-picker-cell-today .ant-picker-cell-inner::before {
                    border: 1px solid #52c41a;
                }

                .ant-picker-cell-in-view.ant-picker-cell-in-range.ant-picker-cell-range-hover::before,
                .ant-picker-cell-in-view.ant-picker-cell-range-start.ant-picker-cell-range-hover::before,
                .ant-picker-cell-in-view.ant-picker-cell-range-end.ant-picker-cell-range-hover::before,
                .ant-picker-cell-in-view.ant-picker-cell-range-start:not(.ant-picker-cell-range-start-single).ant-picker-cell-range-hover-start::before,
                .ant-picker-cell-in-view.ant-picker-cell-range-end:not(.ant-picker-cell-range-end-single).ant-picker-cell-range-hover-end::before,
                .ant-picker-panel
                    > :not(.ant-picker-date-panel)
                    .ant-picker-cell-in-view.ant-picker-cell-in-range.ant-picker-cell-range-hover-start::before,
                .ant-picker-panel
                    > :not(.ant-picker-date-panel)
                    .ant-picker-cell-in-view.ant-picker-cell-in-range.ant-picker-cell-range-hover-end::before {
                    background: #52c41abb;
                }

                .ant-picker-cell-in-view.ant-picker-cell-in-range.ant-picker-cell-range-hover-start
                    .ant-picker-cell-inner::after,
                .ant-picker-cell-in-view.ant-picker-cell-in-range.ant-picker-cell-range-hover-end
                    .ant-picker-cell-inner::after {
                    background: #52c41abb !important;
                }
            }
        }
    }
}
