
/*  PICO REPLACEMENT SUB-SET */

:root{
	--pico-spacing:5px;
	--pico-border-radius:5px;
}

a[role=button] {
    display: inline-block
}
[role=button],[type=button],[type=file]::file-selector-button,[type=reset],[type=submit],button {
    --pico-background-color: var(--button-bg);
    --pico-border-color: var(--pico-primary-border);
    --pico-color: var(--button-text-color);
    --pico-box-shadow: var(--pico-button-box-shadow, 0 0 0 rgba(0, 0, 0, 0));
    padding: 8px 15px;
    border: none;
    border-radius: .5rem;
    outline: 0;
    background-color: var(--button-bg);
    box-shadow: var(--pico-box-shadow);
    color: var(--button-text-color);
    font-weight: var(--pico-font-weight);
    font-size: 1rem;
    line-height: var(--pico-line-height);
    text-align: center;
    text-decoration: none;
    cursor: pointer;
    -webkit-user-select: none;
    -moz-user-select: none;
    user-select: none;
}

[role=button]:is(:hover,:active,:focus),[role=button]:is([aria-current]:not([aria-current=false])),[type=button]:is(:hover,:active,:focus),[type=button]:is([aria-current]:not([aria-current=false])),[type=file]::file-selector-button:is(:hover,:active,:focus),[type=file]::file-selector-button:is([aria-current]:not([aria-current=false])),[type=reset]:is(:hover,:active,:focus),[type=reset]:is([aria-current]:not([aria-current=false])),[type=submit]:is(:hover,:active,:focus),[type=submit]:is([aria-current]:not([aria-current=false])),button:is(:hover,:active,:focus),button:is([aria-current]:not([aria-current=false])) {
    --pico-background-color: var(--button-hover-bg);
    --pico-border-color: var(--pico-primary-hover-border);
    --pico-box-shadow: var(--pico-button-hover-box-shadow, 0 0 0 rgba(0, 0, 0, 0));
    --pico-color: var(--button-hover-color)
}

[role=button]:focus,[role=button]:is([aria-current]:not([aria-current=false])):focus,[type=button]:focus,[type=button]:is([aria-current]:not([aria-current=false])):focus,[type=file]::file-selector-button:focus,[type=file]::file-selector-button:is([aria-current]:not([aria-current=false])):focus,[type=reset]:focus,[type=reset]:is([aria-current]:not([aria-current=false])):focus,[type=submit]:focus,[type=submit]:is([aria-current]:not([aria-current=false])):focus,button:focus,button:is([aria-current]:not([aria-current=false])):focus {
    --pico-box-shadow: var(--pico-button-hover-box-shadow, 0 0 0 rgba(0, 0, 0, 0)),0 0 0 var(--pico-outline-width) var(--pico-primary-focus)
}

[type=checkbox],[type=radio],[type=range],progress {
    accent-color: var(--pico-primary)
}

progress {
    display: inline-block;
    vertical-align: baseline
}

progress {
    -webkit-appearance: none;
    -moz-appearance: none;
    display: inline-block;
    appearance: none;
    width: 100%;
    height: .5rem;
    margin-bottom: calc(var(--pico-spacing) * .5);
    overflow: hidden;
    border: 0;
    border-radius: var(--pico-border-radius);
    background-color: var(--inverted-main-bg-color);
    color: var(--button-hover-bg)
}

progress::-webkit-progress-bar {
    border-radius: var(--pico-border-radius);
    background: 0 0
}

progress[value]::-webkit-progress-value {
    background-color: var(--button-hover-bg);
    -webkit-transition: inline-size var(--pico-transition);
    transition: inline-size var(--pico-transition)
}

progress::-moz-progress-bar {
    background-color: var(--button-hover-bg)
}

@media (prefers-reduced-motion:no-preference) {
    progress:indeterminate {
        background: var(--button-bg) linear-gradient(to right,var(--button-hover-bg) 30%,var(--inverted-main-bg-color) 30%) top left/150% 150% no-repeat;
        animation: progress-indeterminate 1s linear infinite
    }

    progress:indeterminate[value]::-webkit-progress-value {
        background-color: transparent
    }

    progress:indeterminate::-moz-progress-bar {
        background-color: transparent
    }
}

@media (prefers-reduced-motion:no-preference) {
    [dir=rtl] progress:indeterminate {
        animation-direction: reverse
    }
}

@keyframes progress-indeterminate {
    0% {
        background-position: 200% 0
    }

    100% {
        background-position: -200% 0
    }
}

@media (prefers-reduced-motion:reduce) {
    :not([aria-busy=true]),:not([aria-busy=true])::after,:not([aria-busy=true])::before {
        background-attachment: initial!important;
        animation-duration: 1ms!important;
        animation-delay: -1ms!important;
        animation-iteration-count: 1!important;
        scroll-behavior: auto!important;
        transition-delay: 0s!important;
        transition-duration: 0s!important
    }
}

