@layer properties {
    @supports (((-webkit-hyphens:none)) and (not (margin-trim:inline))) or ((-moz-orient:inline) and (not (color:rgb(from red r g b)))) {

        *,
        :before,
        :after,
        ::backdrop {
            --tw-border-style: solid;
            --tw-leading: initial;
            --tw-font-weight: initial;
            --tw-shadow: 0 0 #0000;
            --tw-shadow-color: initial;
            --tw-shadow-alpha: 100%;
            --tw-inset-shadow: 0 0 #0000;
            --tw-inset-shadow-color: initial;
            --tw-inset-shadow-alpha: 100%;
            --tw-ring-color: initial;
            --tw-ring-shadow: 0 0 #0000;
            --tw-inset-ring-color: initial;
            --tw-inset-ring-shadow: 0 0 #0000;
            --tw-ring-inset: initial;
            --tw-ring-offset-width: 0px;
            --tw-ring-offset-color: #fff;
            --tw-ring-offset-shadow: 0 0 #0000;
            --tw-blur: initial;
            --tw-brightness: initial;
            --tw-contrast: initial;
            --tw-grayscale: initial;
            --tw-hue-rotate: initial;
            --tw-invert: initial;
            --tw-opacity: initial;
            --tw-saturate: initial;
            --tw-sepia: initial;
            --tw-drop-shadow: initial;
            --tw-drop-shadow-color: initial;
            --tw-drop-shadow-alpha: 100%;
            --tw-drop-shadow-size: initial;
            --tw-duration: initial;
            --tw-translate-x: 0;
            --tw-translate-y: 0;
            --tw-translate-z: 0;
            --tw-space-y-reverse: 0;
            --tw-space-x-reverse: 0
        }
    }
}

:root,
:host {
    --color-blue-100: oklch(93.2% .032 255.585);
    --color-blue-200: oklch(88.2% .059 254.128);
    --color-blue-800: oklch(42.4% .199 265.638);
    --color-gray-200: oklch(92.8% .006 264.531);
    --color-gray-300: oklch(87.2% .01 258.338);
    --color-gray-400: oklch(70.7% .022 261.325);
    --color-gray-500: oklch(55.1% .027 264.364);
    --color-gray-600: oklch(44.6% .03 256.802);
    --color-gray-700: oklch(37.3% .034 259.733);
    --color-gray-800: oklch(27.8% .033 256.848);
    --color-black: #000;
    --color-white: #fff;
    --spacing: .25rem;
    --text-xs: .75rem;
    --text-xs--line-height: calc(1/.75);
    --text-sm: .875rem;
    --text-sm--line-height: calc(1.25/.875);
    --text-lg: 1.125rem;
    --text-lg--line-height: calc(1.75/1.125);
    --font-weight-normal: 400;
    --font-weight-medium: 500;
    --font-weight-semibold: 600;
    --font-weight-bold: 700;
    --radius-md: .375rem;
    --radius-lg: .5rem
}

.fi-date-range-picker .fi-date-range-picker-input-container {
    display: flex
}

.fi-date-range-picker .fi-date-range-picker-input-container.is-inline {
    align-items: center;
    gap: calc(var(--spacing)*3);
    flex-direction: row
}

.fi-date-range-picker .fi-date-range-picker-input-container.is-stacked,
.fi-date-range-picker .fi-date-range-picker-input-container.default\:stacked {
    gap: calc(var(--spacing)*2);
    flex-direction: column
}

.fi-date-range-picker .fi-date-range-picker-input-container.default\:inline {
    align-items: center;
    gap: calc(var(--spacing)*3);
    flex-direction: row
}

@media (min-width:640px) {
    .fi-date-range-picker .fi-date-range-picker-input-container.sm\:stacked {
        gap: calc(var(--spacing)*2);
        flex-direction: column
    }

    .fi-date-range-picker .fi-date-range-picker-input-container.sm\:inline {
        align-items: center;
        gap: calc(var(--spacing)*3);
        flex-direction: row
    }
}

@media (min-width:768px) {
    .fi-date-range-picker .fi-date-range-picker-input-container.md\:stacked {
        gap: calc(var(--spacing)*2);
        flex-direction: column
    }

    .fi-date-range-picker .fi-date-range-picker-input-container.md\:inline {
        align-items: center;
        gap: calc(var(--spacing)*3);
        flex-direction: row
    }
}

@media (min-width:1024px) {
    .fi-date-range-picker .fi-date-range-picker-input-container.lg\:stacked {
        gap: calc(var(--spacing)*2);
        flex-direction: column
    }

    .fi-date-range-picker .fi-date-range-picker-input-container.lg\:inline {
        align-items: center;
        gap: calc(var(--spacing)*3);
        flex-direction: row
    }
}

@media (min-width:1280px) {
    .fi-date-range-picker .fi-date-range-picker-input-container.xl\:stacked {
        gap: calc(var(--spacing)*2);
        flex-direction: column
    }

    .fi-date-range-picker .fi-date-range-picker-input-container.xl\:inline {
        align-items: center;
        gap: calc(var(--spacing)*3);
        flex-direction: row
    }
}

@media (min-width:1536px) {
    .fi-date-range-picker .fi-date-range-picker-input-container.\32 xl\:stacked {
        gap: calc(var(--spacing)*2);
        flex-direction: column
    }

    .fi-date-range-picker .fi-date-range-picker-input-container.\32 xl\:inline {
        align-items: center;
        gap: calc(var(--spacing)*3);
        flex-direction: row
    }
}

.fi-date-range-picker .fi-date-range-picker-input-container .fi-fo-date-range-picker-single-wrapper {
    width: 100%;
    position: relative
}

.fi-date-range-picker .fi-date-range-picker-input-container .fi-fo-date-range-picker-start-wrapper,
.fi-date-range-picker .fi-date-range-picker-input-container .fi-fo-date-range-picker-end-wrapper {
    position: relative
}

.fi-date-range-picker .fi-date-range-picker-input-container .fi-date-range-picker-field {
    min-width: calc(var(--spacing)*0)
}

.fi-date-range-picker .fi-date-range-picker-input-container.is-inline .fi-date-range-picker-field {
    flex: 1
}

.fi-date-range-picker .fi-date-range-picker-input-container.is-stacked .fi-date-range-picker-field,
.fi-date-range-picker .fi-date-range-picker-input-container.default\:stacked .fi-date-range-picker-field {
    width: 100%
}

.fi-date-range-picker .fi-date-range-picker-input-container.default\:inline .fi-date-range-picker-field {
    flex: 1
}

@media (min-width:640px) {
    .fi-date-range-picker .fi-date-range-picker-input-container.sm\:stacked .fi-date-range-picker-field {
        width: 100%
    }

    .fi-date-range-picker .fi-date-range-picker-input-container.sm\:inline .fi-date-range-picker-field {
        flex: 1
    }
}

@media (min-width:768px) {
    .fi-date-range-picker .fi-date-range-picker-input-container.md\:stacked .fi-date-range-picker-field {
        width: 100%
    }

    .fi-date-range-picker .fi-date-range-picker-input-container.md\:inline .fi-date-range-picker-field {
        flex: 1
    }
}

@media (min-width:1024px) {
    .fi-date-range-picker .fi-date-range-picker-input-container.lg\:stacked .fi-date-range-picker-field {
        width: 100%
    }

    .fi-date-range-picker .fi-date-range-picker-input-container.lg\:inline .fi-date-range-picker-field {
        flex: 1
    }
}

@media (min-width:1280px) {
    .fi-date-range-picker .fi-date-range-picker-input-container.xl\:stacked .fi-date-range-picker-field {
        width: 100%
    }

    .fi-date-range-picker .fi-date-range-picker-input-container.xl\:inline .fi-date-range-picker-field {
        flex: 1
    }
}

@media (min-width:1536px) {
    .fi-date-range-picker .fi-date-range-picker-input-container.\32 xl\:stacked .fi-date-range-picker-field {
        width: 100%
    }

    .fi-date-range-picker .fi-date-range-picker-input-container.\32 xl\:inline .fi-date-range-picker-field {
        flex: 1
    }
}

.fi-date-range-picker .fi-date-range-picker-input-container .fi-date-range-picker-input-inner {
    flex-grow: 1;
    position: relative
}

.fi-date-range-picker .fi-date-range-picker-input {
    --tw-border-style: none;
    width: 100%;
    padding-inline: calc(var(--spacing)*3);
    padding-block: calc(var(--spacing)*1.5);
    font-size: var(--text-sm);
    line-height: var(--tw-leading, var(--text-sm--line-height));
    --tw-leading: calc(var(--spacing)*6);
    line-height: calc(var(--spacing)*6);
    color: var(--gray-950);
    --tw-outline-style: none;
    background-color: #0000;
    border-style: none;
    outline-style: none
}

@media (forced-colors:active) {
    .fi-date-range-picker .fi-date-range-picker-input {
        outline-offset: 2px;
        outline: 2px solid #0000
    }
}

.fi-date-range-picker .fi-date-range-picker-input {
    transition-property: color, background-color, border-color, outline-color, text-decoration-color, fill, stroke, --tw-gradient-from, --tw-gradient-via, --tw-gradient-to, opacity, box-shadow, transform, translate, scale, rotate, filter, -webkit-backdrop-filter, backdrop-filter, display, content-visibility, overlay, pointer-events;
    transition-timing-function: var(--tw-ease, ease);
    transition-duration: var(--tw-duration, 0s);
    --tw-duration: 75ms;
    transition-duration: 75ms
}

.fi-date-range-picker .fi-date-range-picker-input::placeholder {
    color: var(--gray-400)
}

.fi-date-range-picker .fi-date-range-picker-input:focus {
    --tw-ring-shadow: var(--tw-ring-inset, )0 0 0 calc(0px + var(--tw-ring-offset-width))var(--tw-ring-color, currentcolor);
    box-shadow: var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow)
}

.fi-date-range-picker .fi-date-range-picker-input:disabled {
    color: var(--gray-500);
    -webkit-text-fill-color: var(--color-gray-500)
}

.fi-date-range-picker .fi-date-range-picker-input:where(.dark, .dark *) {
    color: var(--color-white)
}

.fi-date-range-picker .fi-date-range-picker-input:where(.dark, .dark *)::placeholder {
    color: var(--gray-500)
}

.fi-date-range-picker .fi-date-range-picker-input:where(.dark, .dark *):disabled {
    color: var(--gray-400);
    -webkit-text-fill-color: var(--color-gray-400)
}

.fi-date-range-picker .fi-date-range-picker-input.is-active {
    --tw-font-weight: var(--font-weight-semibold);
    font-weight: var(--font-weight-semibold)
}

.fi-date-range-picker .fi-date-range-picker-clear-button {
    --tw-translate-y: calc(calc(1/2*100%)*-1);
    translate: var(--tw-translate-x)var(--tw-translate-y);
    appearance: none;
    color: var(--gray-400);
    position: absolute;
    top: 50%
}

@media (hover:hover) {
    .fi-date-range-picker .fi-date-range-picker-clear-button:hover {
        color: var(--gray-500)
    }
}

.fi-date-range-picker .fi-date-range-picker-clear-button:where(.dark, .dark *) {
    color: var(--gray-500)
}

@media (hover:hover) {
    .fi-date-range-picker .fi-date-range-picker-clear-button:where(.dark, .dark *):hover {
        color: var(--gray-400)
    }
}

.fi-date-range-picker .fi-date-range-picker-clear-button {
    inset-inline-end: .625rem
}

.fi-date-range-picker .fi-date-range-picker-clear-button .fi-date-range-picker-clear-icon {
    height: calc(var(--spacing)*5);
    width: calc(var(--spacing)*5)
}

.fi-date-range-picker .fi-date-range-picker-separator {
    font-size: var(--text-sm);
    line-height: var(--tw-leading, var(--text-sm--line-height));
    color: var(--gray-500);
    display: inline-flex
}

.fi-date-range-picker .fi-date-range-picker-separator:where(.dark, .dark *) {
    color: var(--gray-400)
}

.fi-date-range-picker .fi-date-range-picker-separator .fi-date-range-picker-separator-value {
    display: none
}

.fi-date-range-picker .fi-date-range-picker-separator.is-inline {
    flex-shrink: 0
}

.fi-date-range-picker .fi-date-range-picker-separator.is-inline .fi-date-range-picker-separator-value.is-inline {
    display: inline-flex
}

.fi-date-range-picker .fi-date-range-picker-separator.is-inline .fi-date-range-picker-separator-value.is-stacked {
    display: none
}

.fi-date-range-picker .fi-date-range-picker-separator.is-stacked {
    justify-content: center
}

.fi-date-range-picker .fi-date-range-picker-separator.is-stacked .fi-date-range-picker-separator-value.is-stacked {
    display: inline-flex
}

.fi-date-range-picker .fi-date-range-picker-separator.is-stacked .fi-date-range-picker-separator-value.is-inline {
    display: none
}

.fi-date-range-picker .fi-date-range-picker-separator.default\:stacked {
    justify-content: center
}

.fi-date-range-picker .fi-date-range-picker-separator.default\:stacked .fi-date-range-picker-separator-value.is-stacked {
    display: inline-flex
}

.fi-date-range-picker .fi-date-range-picker-separator.default\:stacked .fi-date-range-picker-separator-value.is-inline {
    display: none
}

.fi-date-range-picker .fi-date-range-picker-separator.default\:inline {
    flex-shrink: 0
}

.fi-date-range-picker .fi-date-range-picker-separator.default\:inline .fi-date-range-picker-separator-value.is-inline {
    display: inline-flex
}

.fi-date-range-picker .fi-date-range-picker-separator.default\:inline .fi-date-range-picker-separator-value.is-stacked {
    display: none
}

@media (min-width:640px) {
    .fi-date-range-picker .fi-date-range-picker-separator.sm\:stacked {
        justify-content: center
    }

    .fi-date-range-picker .fi-date-range-picker-separator.sm\:stacked .fi-date-range-picker-separator-value.is-stacked {
        display: inline-flex
    }

    .fi-date-range-picker .fi-date-range-picker-separator.sm\:stacked .fi-date-range-picker-separator-value.is-inline {
        display: none
    }

    .fi-date-range-picker .fi-date-range-picker-separator.sm\:inline {
        flex-shrink: 0
    }

    .fi-date-range-picker .fi-date-range-picker-separator.sm\:inline .fi-date-range-picker-separator-value.is-inline {
        display: inline-flex
    }

    .fi-date-range-picker .fi-date-range-picker-separator.sm\:inline .fi-date-range-picker-separator-value.is-stacked {
        display: none
    }
}

@media (min-width:768px) {
    .fi-date-range-picker .fi-date-range-picker-separator.md\:stacked {
        justify-content: center
    }

    .fi-date-range-picker .fi-date-range-picker-separator.md\:stacked .fi-date-range-picker-separator-value.is-stacked {
        display: inline-flex
    }

    .fi-date-range-picker .fi-date-range-picker-separator.md\:stacked .fi-date-range-picker-separator-value.is-inline {
        display: none
    }

    .fi-date-range-picker .fi-date-range-picker-separator.md\:inline {
        flex-shrink: 0
    }

    .fi-date-range-picker .fi-date-range-picker-separator.md\:inline .fi-date-range-picker-separator-value.is-inline {
        display: inline-flex
    }

    .fi-date-range-picker .fi-date-range-picker-separator.md\:inline .fi-date-range-picker-separator-value.is-stacked {
        display: none
    }
}

@media (min-width:1024px) {
    .fi-date-range-picker .fi-date-range-picker-separator.lg\:stacked {
        justify-content: center
    }

    .fi-date-range-picker .fi-date-range-picker-separator.lg\:stacked .fi-date-range-picker-separator-value.is-stacked {
        display: inline-flex
    }

    .fi-date-range-picker .fi-date-range-picker-separator.lg\:stacked .fi-date-range-picker-separator-value.is-inline {
        display: none
    }

    .fi-date-range-picker .fi-date-range-picker-separator.lg\:inline {
        flex-shrink: 0
    }

    .fi-date-range-picker .fi-date-range-picker-separator.lg\:inline .fi-date-range-picker-separator-value.is-inline {
        display: inline-flex
    }

    .fi-date-range-picker .fi-date-range-picker-separator.lg\:inline .fi-date-range-picker-separator-value.is-stacked {
        display: none
    }
}

@media (min-width:1280px) {
    .fi-date-range-picker .fi-date-range-picker-separator.xl\:stacked {
        justify-content: center
    }

    .fi-date-range-picker .fi-date-range-picker-separator.xl\:stacked .fi-date-range-picker-separator-value.is-stacked {
        display: inline-flex
    }

    .fi-date-range-picker .fi-date-range-picker-separator.xl\:stacked .fi-date-range-picker-separator-value.is-inline {
        display: none
    }

    .fi-date-range-picker .fi-date-range-picker-separator.xl\:inline {
        flex-shrink: 0
    }

    .fi-date-range-picker .fi-date-range-picker-separator.xl\:inline .fi-date-range-picker-separator-value.is-inline {
        display: inline-flex
    }

    .fi-date-range-picker .fi-date-range-picker-separator.xl\:inline .fi-date-range-picker-separator-value.is-stacked {
        display: none
    }
}

@media (min-width:1536px) {
    .fi-date-range-picker .fi-date-range-picker-separator.\32 xl\:stacked {
        justify-content: center
    }

    .fi-date-range-picker .fi-date-range-picker-separator.\32 xl\:stacked .fi-date-range-picker-separator-value.is-stacked {
        display: inline-flex
    }

    .fi-date-range-picker .fi-date-range-picker-separator.\32 xl\:stacked .fi-date-range-picker-separator-value.is-inline {
        display: none
    }

    .fi-date-range-picker .fi-date-range-picker-separator.\32 xl\:inline {
        flex-shrink: 0
    }

    .fi-date-range-picker .fi-date-range-picker-separator.\32 xl\:inline .fi-date-range-picker-separator-value.is-inline {
        display: inline-flex
    }

    .fi-date-range-picker .fi-date-range-picker-separator.\32 xl\:inline .fi-date-range-picker-separator-value.is-stacked {
        display: none
    }
}

.fi-date-range-picker .fi-date-range-picker-panel {
    z-index: 10;
    position: absolute
}

:where(.fi-date-range-picker .fi-date-range-picker-panel>:not(:last-child)) {
    --tw-space-y-reverse: 0;
    margin-block-start: calc(calc(var(--spacing)*3)*var(--tw-space-y-reverse));
    margin-block-end: calc(calc(var(--spacing)*3)*calc(1 - var(--tw-space-y-reverse)))
}

.fi-date-range-picker .fi-date-range-picker-panel {
    border-radius: var(--radius-lg);
    background-color: var(--color-white);
    padding: calc(var(--spacing)*4);
    --tw-shadow: 0 10px 15px -3px var(--tw-shadow-color, #0000001a), 0 4px 6px -4px var(--tw-shadow-color, #0000001a);
    --tw-ring-shadow: var(--tw-ring-inset, )0 0 0 calc(1px + var(--tw-ring-offset-width))var(--tw-ring-color, currentcolor);
    box-shadow: var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow);
    --tw-ring-color: color-mix(in oklab, var(--color-black)5%, transparent)
}

.fi-date-range-picker .fi-date-range-picker-panel:where(.dark, .dark *) {
    background-color: var(--gray-900);
    --tw-ring-color: #ffffff1a
}

@supports (color:color-mix(in lab, red, red)) {
    .fi-date-range-picker .fi-date-range-picker-panel:where(.dark, .dark *) {
        --tw-ring-color: color-mix(in oklab, var(--color-white)10%, transparent)
    }
}

.fi-date-range-picker .fi-date-range-picker-panel.is-dual {
    min-width: calc(var(--spacing)*96)
}

.fi-date-range-picker .fi-date-range-picker-panel.is-single {
    min-width: calc(var(--spacing)*56)
}

.fi-date-range-picker .fi-date-range-picker-panel .fi-date-range-picker-panel-header {
    margin-bottom: calc(var(--spacing)*2);
    padding-inline: calc(var(--spacing)*1);
    justify-content: space-between;
    align-items: center;
    display: flex;
    position: relative
}

.fi-date-range-picker .fi-date-range-picker-panel .fi-date-range-picker-panel-header .fi-date-range-picker-nav-button {
    top: calc(var(--spacing)*0);
    z-index: 10;
    margin: calc(var(--spacing)*-2);
    justify-content: center;
    align-items: center;
    gap: calc(var(--spacing)*1.5);
    border-radius: var(--radius-lg);
    padding: calc(var(--spacing)*2);
    font-size: var(--text-sm);
    line-height: var(--tw-leading, var(--text-sm--line-height));
    --tw-font-weight: var(--font-weight-medium);
    font-weight: var(--font-weight-medium);
    color: var(--gray-700);
    --tw-outline-style: none;
    outline-style: none;
    display: inline-flex;
    position: absolute
}

@media (hover:hover) {
    .fi-date-range-picker .fi-date-range-picker-panel .fi-date-range-picker-panel-header .fi-date-range-picker-nav-button:hover {
        background-color: var(--gray-50)
    }
}

.fi-date-range-picker .fi-date-range-picker-panel .fi-date-range-picker-panel-header .fi-date-range-picker-nav-button:focus {
    background-color: var(--gray-50)
}

.fi-date-range-picker .fi-date-range-picker-panel .fi-date-range-picker-panel-header .fi-date-range-picker-nav-button:disabled {
    pointer-events: none;
    opacity: .7
}

.fi-date-range-picker .fi-date-range-picker-panel .fi-date-range-picker-panel-header .fi-date-range-picker-nav-button:where(.dark, .dark *) {
    color: var(--gray-200)
}

@media (hover:hover) {
    .fi-date-range-picker .fi-date-range-picker-panel .fi-date-range-picker-panel-header .fi-date-range-picker-nav-button:where(.dark, .dark *):hover {
        background-color: #ffffff0d
    }

    @supports (color:color-mix(in lab, red, red)) {
        .fi-date-range-picker .fi-date-range-picker-panel .fi-date-range-picker-panel-header .fi-date-range-picker-nav-button:where(.dark, .dark *):hover {
            background-color: color-mix(in oklab, var(--color-white)5%, transparent)
        }
    }
}

.fi-date-range-picker .fi-date-range-picker-panel .fi-date-range-picker-panel-header .fi-date-range-picker-nav-button:where(.dark, .dark *):focus {
    background-color: #ffffff0d
}

@supports (color:color-mix(in lab, red, red)) {
    .fi-date-range-picker .fi-date-range-picker-panel .fi-date-range-picker-panel-header .fi-date-range-picker-nav-button:where(.dark, .dark *):focus {
        background-color: color-mix(in oklab, var(--color-white)5%, transparent)
    }
}

.fi-date-range-picker .fi-date-range-picker-panel .fi-date-range-picker-panel-header .fi-date-range-picker-nav-button.is-prev {
    inset-inline-start: 0
}

.fi-date-range-picker .fi-date-range-picker-panel .fi-date-range-picker-panel-header .fi-date-range-picker-nav-button.is-next {
    inset-inline-end: 0
}

.fi-date-range-picker .fi-date-range-picker-panel .fi-date-range-picker-panel-header .fi-date-range-picker-nav-button .fi-date-range-picker-nav-icon {
    height: calc(var(--spacing)*5);
    width: calc(var(--spacing)*5)
}

.fi-date-range-picker .fi-date-range-picker-panel .fi-date-range-picker-panel-header .fi-date-range-picker-months {
    flex-grow: 1;
    justify-content: space-around;
    align-items: center;
    display: flex
}

.fi-date-range-picker .fi-date-range-picker-panel .fi-date-range-picker-panel-header .fi-date-range-picker-month {
    justify-content: center;
    align-items: center;
    display: flex
}

:where(.fi-date-range-picker .fi-date-range-picker-panel .fi-date-range-picker-panel-header .fi-date-range-picker-month>:not(:last-child)) {
    --tw-space-x-reverse: 0;
    margin-inline-start: calc(calc(var(--spacing)*1)*var(--tw-space-x-reverse));
    margin-inline-end: calc(calc(var(--spacing)*1)*calc(1 - var(--tw-space-x-reverse)))
}

:where(.fi-date-range-picker .fi-date-range-picker-panel .fi-date-range-picker-panel-header .fi-date-range-picker-month:where(:dir(rtl), [dir=rtl], [dir=rtl] *)>:not(:last-child)) {
    --tw-space-x-reverse: 1
}

.fi-date-range-picker .fi-date-range-picker-panel .fi-date-range-picker-panel-header .fi-date-range-picker-month.is-dual {
    width: 50%
}

.fi-date-range-picker .fi-date-range-picker-panel .fi-date-range-picker-panel-header .fi-date-range-picker-month.is-single {
    width: 100%
}

.fi-date-range-picker .fi-date-range-picker-panel .fi-date-range-picker-panel-header .fi-date-range-picker-month>span {
    font-size: var(--text-sm);
    line-height: var(--tw-leading, var(--text-sm--line-height));
    --tw-font-weight: var(--font-weight-semibold);
    font-weight: var(--font-weight-semibold);
    color: var(--gray-950)
}

.fi-date-range-picker .fi-date-range-picker-panel .fi-date-range-picker-panel-header .fi-date-range-picker-month>span:where(.dark, .dark *) {
    color: var(--color-white)
}

.fi-date-range-picker .fi-date-range-picker-panel .fi-date-range-picker-panel-body {
    display: flex
}

:where(.fi-date-range-picker .fi-date-range-picker-panel .fi-date-range-picker-panel-body>:not(:last-child)) {
    --tw-space-x-reverse: 0;
    margin-inline-start: calc(calc(var(--spacing)*4)*var(--tw-space-x-reverse));
    margin-inline-end: calc(calc(var(--spacing)*4)*calc(1 - var(--tw-space-x-reverse)))
}

:where(.fi-date-range-picker .fi-date-range-picker-panel .fi-date-range-picker-panel-body:where(:dir(rtl), [dir=rtl], [dir=rtl] *)>:not(:last-child)) {
    --tw-space-x-reverse: 1
}

.fi-date-range-picker .fi-date-range-picker-panel .fi-date-range-picker-panel-body .fi-date-range-picker-presets {
    width: calc(var(--spacing)*40);
    border-color: var(--gray-200)
}

.fi-date-range-picker .fi-date-range-picker-panel .fi-date-range-picker-panel-body .fi-date-range-picker-presets:where(.dark, .dark *) {
    border-color: var(--gray-700)
}

.fi-date-range-picker .fi-date-range-picker-panel .fi-date-range-picker-panel-body .fi-date-range-picker-presets {
    border-inline-end-width: 1px;
    margin-inline-end: 1rem;
    padding-inline-end: 1rem
}

.fi-date-range-picker .fi-date-range-picker-panel .fi-date-range-picker-panel-body .fi-date-range-picker-presets .fi-date-range-picker-presets-heading {
    margin-bottom: calc(var(--spacing)*2);
    font-size: var(--text-xs);
    line-height: var(--tw-leading, var(--text-xs--line-height));
    --tw-font-weight: var(--font-weight-semibold);
    font-weight: var(--font-weight-semibold);
    color: var(--gray-500);
    text-transform: uppercase
}

.fi-date-range-picker .fi-date-range-picker-panel .fi-date-range-picker-panel-body .fi-date-range-picker-presets .fi-date-range-picker-presets-heading:where(.dark, .dark *) {
    color: var(--gray-400)
}

.fi-date-range-picker .fi-date-range-picker-panel .fi-date-range-picker-panel-body .fi-date-range-picker-presets .fi-date-range-picker-presets-heading {
    letter-spacing: .025em
}

.fi-date-range-picker .fi-date-range-picker-panel .fi-date-range-picker-panel-body .fi-date-range-picker-presets .fi-date-range-picker-presets-list {
    gap: calc(var(--spacing)*1);
    flex-direction: column;
    display: flex
}

.fi-date-range-picker .fi-date-range-picker-panel .fi-date-range-picker-panel-body .fi-date-range-picker-presets .fi-date-range-picker-preset {
    border-radius: var(--radius-md);
    padding-inline: calc(var(--spacing)*2);
    padding-block: calc(var(--spacing)*1);
    text-align: left;
    font-size: var(--text-xs);
    line-height: var(--tw-leading, var(--text-xs--line-height));
    transition-property: color, background-color, border-color, outline-color, text-decoration-color, fill, stroke, --tw-gradient-from, --tw-gradient-via, --tw-gradient-to;
    transition-timing-function: var(--tw-ease, ease);
    transition-duration: var(--tw-duration, 0s)
}

.fi-date-range-picker .fi-date-range-picker-panel .fi-date-range-picker-panel-body .fi-date-range-picker-presets .fi-date-range-picker-preset.is-active {
    background-color: var(--primary-600);
    color: var(--color-white)
}

.fi-date-range-picker .fi-date-range-picker-panel .fi-date-range-picker-panel-body .fi-date-range-picker-presets .fi-date-range-picker-preset.is-active:where(.dark, .dark *) {
    background-color: var(--primary-500)
}

.fi-date-range-picker .fi-date-range-picker-panel .fi-date-range-picker-panel-body .fi-date-range-picker-presets .fi-date-range-picker-preset.is-inactive {
    color: var(--gray-700)
}

@media (hover:hover) {
    .fi-date-range-picker .fi-date-range-picker-panel .fi-date-range-picker-panel-body .fi-date-range-picker-presets .fi-date-range-picker-preset.is-inactive:hover {
        background-color: var(--gray-100)
    }
}

.fi-date-range-picker .fi-date-range-picker-panel .fi-date-range-picker-panel-body .fi-date-range-picker-presets .fi-date-range-picker-preset.is-inactive:where(.dark, .dark *) {
    color: var(--gray-200)
}

@media (hover:hover) {
    .fi-date-range-picker .fi-date-range-picker-panel .fi-date-range-picker-panel-body .fi-date-range-picker-presets .fi-date-range-picker-preset.is-inactive:where(.dark, .dark *):hover {
        background-color: #ffffff0d
    }

    @supports (color:color-mix(in lab, red, red)) {
        .fi-date-range-picker .fi-date-range-picker-panel .fi-date-range-picker-panel-body .fi-date-range-picker-presets .fi-date-range-picker-preset.is-inactive:where(.dark, .dark *):hover {
            background-color: color-mix(in oklab, var(--color-white)5%, transparent)
        }
    }
}

.fi-date-range-picker .fi-date-range-picker-panel .fi-date-range-picker-panel-body .fi-date-range-picker-calendars {
    display: flex
}

:where(.fi-date-range-picker .fi-date-range-picker-panel .fi-date-range-picker-panel-body .fi-date-range-picker-calendars>:not(:last-child)) {
    --tw-space-x-reverse: 0;
    margin-inline-start: calc(calc(var(--spacing)*4)*var(--tw-space-x-reverse));
    margin-inline-end: calc(calc(var(--spacing)*4)*calc(1 - var(--tw-space-x-reverse)))
}

:where(.fi-date-range-picker .fi-date-range-picker-panel .fi-date-range-picker-panel-body .fi-date-range-picker-calendars:where(:dir(rtl), [dir=rtl], [dir=rtl] *)>:not(:last-child)) {
    --tw-space-x-reverse: 1
}

.fi-date-range-picker .fi-date-range-picker-panel .fi-date-range-picker-panel-body .fi-date-range-picker-calendar {
    row-gap: calc(var(--spacing)*1);
    display: grid
}

.fi-date-range-picker .fi-date-range-picker-panel .fi-date-range-picker-panel-body .fi-date-range-picker-calendar-header {
    gap: calc(var(--spacing)*1);
    grid-template-columns: repeat(7, minmax(0, 1fr));
    display: grid
}

.fi-date-range-picker .fi-date-range-picker-panel .fi-date-range-picker-panel-body .fi-date-range-picker-calendar-header .fi-date-range-picker-calendar-header-day {
    text-align: center;
    font-size: var(--text-sm);
    line-height: var(--tw-leading, var(--text-sm--line-height));
    --tw-font-weight: var(--font-weight-medium);
    font-weight: var(--font-weight-medium);
    color: var(--gray-500)
}

.fi-date-range-picker .fi-date-range-picker-panel .fi-date-range-picker-panel-body .fi-date-range-picker-calendar-header .fi-date-range-picker-calendar-header-day:where(.dark, .dark *) {
    color: var(--gray-400)
}

.fi-date-range-picker .fi-date-range-picker-panel .fi-date-range-picker-panel-body .fi-date-range-picker-calendar-grid {
    row-gap: calc(var(--spacing)*.5);
    grid-template-columns: repeat(7, minmax(0, 1fr));
    display: grid
}

.fi-date-range-picker .fi-date-range-picker-panel .fi-date-range-picker-panel-body .fi-date-range-picker-calendar-day {
    padding: calc(var(--spacing)*1.5);
    font-size: var(--text-xs);
    line-height: var(--tw-leading, var(--text-xs--line-height));
    --tw-leading: 1;
    transition-property: color, background-color, border-color, outline-color, text-decoration-color, fill, stroke, --tw-gradient-from, --tw-gradient-via, --tw-gradient-to, opacity, box-shadow, transform, translate, scale, rotate, filter, -webkit-backdrop-filter, backdrop-filter, display, content-visibility, overlay, pointer-events;
    transition-timing-function: var(--tw-ease, ease);
    transition-duration: var(--tw-duration, 0s);
    --tw-duration: 75ms;
    justify-content: center;
    align-items: center;
    line-height: 1;
    transition-duration: 75ms;
    display: flex
}

.fi-date-range-picker .fi-date-range-picker-panel .fi-date-range-picker-panel-body .fi-date-range-picker-calendar-day.is-disabled {
    pointer-events: none;
    cursor: not-allowed;
    opacity: .5
}

.fi-date-range-picker .fi-date-range-picker-panel .fi-date-range-picker-panel-body .fi-date-range-picker-calendar-day:not(.is-disabled) {
    cursor: pointer
}

.fi-date-range-picker .fi-date-range-picker-panel .fi-date-range-picker-panel-body .fi-date-range-picker-calendar-day.is-selected {
    background-color: var(--primary-600);
    color: var(--color-white)
}

.fi-date-range-picker .fi-date-range-picker-panel .fi-date-range-picker-panel-body .fi-date-range-picker-calendar-day.is-selected:where(.dark, .dark *) {
    background-color: var(--primary-400)
}

.fi-date-range-picker .fi-date-range-picker-panel .fi-date-range-picker-panel-body .fi-date-range-picker-calendar-day.is-in-range {
    background-color: var(--primary-100);
    color: var(--primary-700)
}

.fi-date-range-picker .fi-date-range-picker-panel .fi-date-range-picker-panel-body .fi-date-range-picker-calendar-day.is-in-range:where(.dark, .dark *) {
    background-color: var(--primary-700)
}

@supports (color:color-mix(in lab, red, red)) {
    .fi-date-range-picker .fi-date-range-picker-panel .fi-date-range-picker-panel-body .fi-date-range-picker-calendar-day.is-in-range:where(.dark, .dark *) {
        background-color: color-mix(in oklab, var(--primary-700)30%, transparent)
    }
}

.fi-date-range-picker .fi-date-range-picker-panel .fi-date-range-picker-panel-body .fi-date-range-picker-calendar-day.is-in-range:where(.dark, .dark *) {
    color: var(--primary-300)
}

.fi-date-range-picker .fi-date-range-picker-panel .fi-date-range-picker-panel-body .fi-date-range-picker-calendar-day.is-today:not(.is-in-range):not(.is-selected) {
    --tw-font-weight: var(--font-weight-semibold);
    font-weight: var(--font-weight-semibold);
    color: var(--primary-600)
}

.fi-date-range-picker .fi-date-range-picker-panel .fi-date-range-picker-panel-body .fi-date-range-picker-calendar-day.is-today:not(.is-in-range):not(.is-selected):where(.dark, .dark *) {
    color: var(--primary-400)
}

.fi-date-range-picker .fi-date-range-picker-panel .fi-date-range-picker-panel-body .fi-date-range-picker-calendar-day.focused:not(.is-selected):not(.is-disabled) {
    background-color: var(--gray-100)
}

.fi-date-range-picker .fi-date-range-picker-panel .fi-date-range-picker-panel-body .fi-date-range-picker-calendar-day.focused:not(.is-selected):not(.is-disabled):where(.dark, .dark *) {
    background-color: #ffffff1a
}

@supports (color:color-mix(in lab, red, red)) {
    .fi-date-range-picker .fi-date-range-picker-panel .fi-date-range-picker-panel-body .fi-date-range-picker-calendar-day.focused:not(.is-selected):not(.is-disabled):where(.dark, .dark *) {
        background-color: color-mix(in oklab, var(--color-white)10%, transparent)
    }
}

@media (hover:hover) {
    .fi-date-range-picker .fi-date-range-picker-panel .fi-date-range-picker-panel-body .fi-date-range-picker-calendar-day:not(.is-disabled):not(.is-selected):not(.is-in-range):hover {
        background-color: var(--gray-100)
    }

    .fi-date-range-picker .fi-date-range-picker-panel .fi-date-range-picker-panel-body .fi-date-range-picker-calendar-day:not(.is-disabled):not(.is-selected):not(.is-in-range):where(.dark, .dark *):hover {
        background-color: var(--gray-700)
    }
}

.fi-date-range-picker .fi-date-range-picker-time {
    margin-top: calc(var(--spacing)*3);
    border-top-style: var(--tw-border-style);
    border-top-width: 1px;
    border-color: var(--gray-200);
    padding-top: calc(var(--spacing)*3)
}

.fi-date-range-picker .fi-date-range-picker-time:where(.dark, .dark *) {
    border-color: var(--gray-700)
}

.fi-date-range-picker .fi-date-range-picker-time .fi-date-range-picker-all-day {
    justify-content: space-between;
    align-items: center;
    display: flex
}

.fi-date-range-picker .fi-date-range-picker-time .fi-date-range-picker-all-day-label {
    font-size: var(--text-xs);
    line-height: var(--tw-leading, var(--text-xs--line-height));
    --tw-font-weight: var(--font-weight-medium);
    font-weight: var(--font-weight-medium);
    color: var(--gray-500)
}

.fi-date-range-picker .fi-date-range-picker-time .fi-date-range-picker-all-day-label:where(.dark, .dark *) {
    color: var(--gray-400)
}

.fi-date-range-picker .fi-date-range-picker-time .fi-date-range-picker-time-grid {
    margin-top: calc(var(--spacing)*2);
    gap: calc(var(--spacing)*3);
    grid-template-columns: repeat(2, minmax(0, 1fr));
    display: grid
}

.fi-date-range-picker .fi-date-range-picker-time .fi-date-range-picker-time-field {
    gap: calc(var(--spacing)*1);
    display: grid
}

.fi-date-range-picker .fi-date-range-picker-time .fi-date-range-picker-time-input {
    width: 100%
}

.fi-date-range-picker .fi-date-range-picker-time .fi-date-range-time-label {
    font-size: var(--text-xs);
    line-height: var(--tw-leading, var(--text-xs--line-height));
    --tw-font-weight: var(--font-weight-medium);
    font-weight: var(--font-weight-medium);
    color: var(--gray-500)
}

.fi-date-range-picker .fi-date-range-picker-time .fi-date-range-time-label:where(.dark, .dark *) {
    color: var(--gray-400)
}

.fi-date-range-picker .fi-date-range-picker-footer {
    margin-top: calc(var(--spacing)*2);
    justify-content: flex-end;
    align-items: center;
    display: flex
}

:where(.fi-date-range-picker .fi-date-range-picker-footer>:not(:last-child)) {
    --tw-space-x-reverse: 0;
    margin-inline-start: calc(calc(var(--spacing)*2)*var(--tw-space-x-reverse));
    margin-inline-end: calc(calc(var(--spacing)*2)*calc(1 - var(--tw-space-x-reverse)))
}

.fi-date-range-picker .fi-date-range-picker-footer {
    border-top-style: var(--tw-border-style);
    border-top-width: 1px;
    border-color: var(--gray-200);
    padding-top: calc(var(--spacing)*4)
}

:where(.fi-date-range-picker .fi-date-range-picker-footer:where(:dir(rtl), [dir=rtl], [dir=rtl] *)>:not(:last-child)) {
    --tw-space-x-reverse: 1
}

.fi-date-range-picker .fi-date-range-picker-footer:where(.dark, .dark *) {
    border-color: var(--gray-700)
}

.fi-date-range-picker .fi-date-range-picker-footer .fi-date-range-picker-footer-action {
    font-size: var(--text-xs);
    line-height: var(--tw-leading, var(--text-xs--line-height));
    --tw-font-weight: var(--font-weight-medium);
    font-weight: var(--font-weight-medium);
    --tw-outline-style: none;
    outline-style: none;
    justify-content: center;
    align-items: center;
    display: inline-flex
}

.fi-date-range-picker .fi-date-range-picker-footer .fi-date-range-picker-cancel-button {
    color: var(--gray-700)
}

@media (hover:hover) {
    .fi-date-range-picker .fi-date-range-picker-footer .fi-date-range-picker-cancel-button:hover {
        text-decoration-line: underline
    }
}

.fi-date-range-picker .fi-date-range-picker-footer .fi-date-range-picker-cancel-button:focus {
    text-decoration-line: underline
}

.fi-date-range-picker .fi-date-range-picker-footer .fi-date-range-picker-cancel-button:where(.dark, .dark *) {
    color: var(--gray-200)
}

.fi-date-range-picker .fi-date-range-picker-footer .fi-date-range-picker-apply-button {
    color: var(--primary-600)
}

@media (hover:hover) {
    .fi-date-range-picker .fi-date-range-picker-footer .fi-date-range-picker-apply-button:hover {
        text-decoration-line: underline
    }
}

.fi-date-range-picker .fi-date-range-picker-footer .fi-date-range-picker-apply-button:focus {
    text-decoration-line: underline
}

.fi-date-range-picker .fi-date-range-picker-footer .fi-date-range-picker-apply-button:where(.dark, .dark *) {
    color: var(--primary-500)
}

@property --tw-border-style {
    syntax: "*";
    inherits: false;
    initial-value: solid
}

@property --tw-leading {
    syntax: "*";
    inherits: false
}

@property --tw-font-weight {
    syntax: "*";
    inherits: false
}

@property --tw-shadow {
    syntax: "*";
    inherits: false;
    initial-value: 0 0 #0000
}

@property --tw-shadow-color {
    syntax: "*";
    inherits: false
}

@property --tw-shadow-alpha {
    syntax: "<percentage>";
    inherits: false;
    initial-value: 100%
}

@property --tw-inset-shadow {
    syntax: "*";
    inherits: false;
    initial-value: 0 0 #0000
}

@property --tw-inset-shadow-color {
    syntax: "*";
    inherits: false
}

@property --tw-inset-shadow-alpha {
    syntax: "<percentage>";
    inherits: false;
    initial-value: 100%
}

@property --tw-ring-color {
    syntax: "*";
    inherits: false
}

@property --tw-ring-shadow {
    syntax: "*";
    inherits: false;
    initial-value: 0 0 #0000
}

@property --tw-inset-ring-color {
    syntax: "*";
    inherits: false
}

@property --tw-inset-ring-shadow {
    syntax: "*";
    inherits: false;
    initial-value: 0 0 #0000
}

@property --tw-ring-inset {
    syntax: "*";
    inherits: false
}

@property --tw-ring-offset-width {
    syntax: "<length>";
    inherits: false;
    initial-value: 0
}

@property --tw-ring-offset-color {
    syntax: "*";
    inherits: false;
    initial-value: #fff
}

@property --tw-ring-offset-shadow {
    syntax: "*";
    inherits: false;
    initial-value: 0 0 #0000
}

@property --tw-blur {
    syntax: "*";
    inherits: false
}

@property --tw-brightness {
    syntax: "*";
    inherits: false
}

@property --tw-contrast {
    syntax: "*";
    inherits: false
}

@property --tw-grayscale {
    syntax: "*";
    inherits: false
}

@property --tw-hue-rotate {
    syntax: "*";
    inherits: false
}

@property --tw-invert {
    syntax: "*";
    inherits: false
}

@property --tw-opacity {
    syntax: "*";
    inherits: false
}

@property --tw-saturate {
    syntax: "*";
    inherits: false
}

@property --tw-sepia {
    syntax: "*";
    inherits: false
}

@property --tw-drop-shadow {
    syntax: "*";
    inherits: false
}

@property --tw-drop-shadow-color {
    syntax: "*";
    inherits: false
}

@property --tw-drop-shadow-alpha {
    syntax: "<percentage>";
    inherits: false;
    initial-value: 100%
}

@property --tw-drop-shadow-size {
    syntax: "*";
    inherits: false
}

@property --tw-duration {
    syntax: "*";
    inherits: false
}

@property --tw-translate-x {
    syntax: "*";
    inherits: false;
    initial-value: 0
}

@property --tw-translate-y {
    syntax: "*";
    inherits: false;
    initial-value: 0
}

@property --tw-translate-z {
    syntax: "*";
    inherits: false;
    initial-value: 0
}

@property --tw-space-y-reverse {
    syntax: "*";
    inherits: false;
    initial-value: 0
}

@property --tw-space-x-reverse {
    syntax: "*";
    inherits: false;
    initial-value: 0
}

@media (max-width: 640px) {
    .fi-date-range-picker .fi-date-range-picker-calendars {
        flex-direction: column !important;
    }

    .fi-date-range-picker .fi-date-range-picker-calendars>*:not(:last-child) {
        margin-inline-end: 0 !important;
        margin-bottom: 1rem !important;
    }

    /* Panel full width, scroll vertikal */
    .fi-date-range-picker .fi-date-range-picker-panel {
        min-width: unset !important;
        max-height: unset !important;
        border-radius: 0.5rem !important;
        padding: 1rem !important;
        box-sizing: border-box !important;
    }

    .fi-date-range-picker .fi-date-range-picker-panel.is-dual,
    .fi-date-range-picker .fi-date-range-picker-panel.is-single {
        min-width: unset !important;
    }

    .fi-date-range-picker .fi-date-range-picker-calendar-day {
        padding: 0.6rem !important;
        font-size: 0.875rem !important;
    }

    /* Sembunyikan header "Agustus 2026" */
    .fi-date-range-picker .fi-date-range-picker-month.is-dual:last-child {
        display: none !important;
    }

    /* Header bulan pertama ambil full width */
    .fi-date-range-picker .fi-date-range-picker-month.is-dual:first-child {
        width: 100% !important;
    }
}