:root {
        /* ersatt pa sikt */
        --bo-radius-lg: 16px;
        --bo-radius-md: 12px;
        --bo-radius-sm: 10px;
        --bo-border: 1px solid #e9ecef;
        --bo-muted: #6c757d;
        --bo-soft: #f8f9fa;
        --bo-debug: 2px solid rgba(255, 0, 180, .55);
        /* rosa stroke */
        --bo-blue-100: #F2FAFF;
        --bo-blue-200: #D3EEFF;
        --bo-neutral-50: #FDFDFD;
        --bo-neutral-100: #F8F9FA;
        --bo-neutral-400: #969CB8;
        --bo-ink-900: #1B262C;
        --bo-accent-500: #00C896;
    }

    button{
        border:0;
        outline:none;
    }

    .bo-btn-query{
        display: inline-flex;
        align-items: center;
        gap: 1px;
    }

    .bo-btn-query .bo-icon{
        width: 1.5rem;
        height:1.5rem;
    }

    .bo-btn-query .is-active{
      background: var(--bo-blue-200);
    }

    .bo-filter.is-hidden {
        display: none;
    }

    .bo-filter-hidden .bo-page {
        grid-template-columns: 1fr;
    }

    .bo-quick-btn {
        background: var(--bo-blue-100);
        margin: 2px;
    }

    .bo-quick-btn:hover{
        background: var(--bo-blue-200);
    }

    .bo-quick-btn.is-active, 
    .bo-quick-btn :focus {
        background:var(--bo-blue-200);
    }

    .bo-filter-count{
        padding:0 .45rem;
        background:var(--bo-soft);
        font-size:.85rem;
        color:var(--bo-ink-900);
        border-radius:.25rem;
        border:1px solid #eaeaea;
    }

    .bo-filter-group{
        margin:0 0 .25rem 0;
    }

    .bo-filter-body{
        display: grid;
        gap: .25rem;
        padding: .25rem;
    }

    .bo-filter-group .is-active .bo-filter-title {
        font-weight: 600;
    }

    .bo-filter-head {
        display: flex;
        align-items: center;
        justify-content: space-between;
        gap: .75rem;
        padding: .65rem;
        border-radius: .25rem;
        background: var(--bo-neutral-100);
        cursor:pointer;
    }

    .bo-filter-head:hover {
        background: rgba(0, 0, 0, .03);
        border-radius: .75rem;
    }

    .bo-filter-toggle {
        display: inline-flex;
        align-items: center;
        justify-content: space-between;
        gap: .75rem;
        flex: 1;
        border: 0;
        background: transparent;
        padding: 0;
        text-align: left;
    }

    .bo-filter-actions {
        display: inline-flex;
        align-items: center;
        gap: .5rem;
    }

    .bo-filter-clear {
        display: inline-flex;
        align-items: center;
        justify-content: center;
        width: 2rem;
        height: 2rem;
        border: 0;
        background: transparent;
        border-radius: .75rem;
        opacity: .75;
        padding: 0;
    }

    .bo-filter-clear:hover {
        opacity: 1;
        background: rgba(0, 0, 0, .06);
    }

    .bo-filter-head.is-active .bo-filter-title {
        font-weight: 600;
    }

    .bo-filter-actions .bo-icon{
        width: 1.25rem;
        height: 1.25rem;
    }

    .bo-filter-chevron-btn {
        border: 0;
        background: transparent;
        padding: 0;
        display: inline-flex;
        align-items: center;
        justify-content: center;
    }


    .bo-range-inputs {
        display: grid;
        grid-template-columns: minmax(0, 1fr) minmax(0, 1fr);
        gap: .75rem;
    }

    .bo-range input {
        width: 100%;
        min-width: 0;
        box-sizing: border-box;
        padding: .45rem;
        border-radius: .25rem;
        border: 1px solid var(--bo-neutral-400);
    }

    .bo-badge .bo-icon{
        width:1.25rem;
        height:1.25rem;
    }

    .bo-meta-ico .bo-icon{
        width:1.75rem;
        height:1.75rem;
    }

    .bo-btn-cta .bo-icon{
        width: 1.25rem;
        height: 1.25rem;
    }

    .bo-loc .bo-icon{
        width: 1.25rem;
        height: 1.25rem;
    }


    /**Query**/

    .bo-query-row{
        padding:1.25rem 0;
        gap:1rem;
    }

    .bo-query-top{
        display: flex;
        flex-direction: row;
        flex-wrap: wrap;
        justify-content: space-between;
        align-items: center;
    }

    .bo-query-top h1,
    .bo-query-top h2,
    .bo-query-top h3,
    .bo-query-top h4,
    .bo-query-top h5,
    .bo-query-top h6{
        font-weight:700;
        margin:0;
    }

    .bo-query-bottom {
        display: flex;
        gap: 1rem;
        align-items: end;
        justify-content: space-between;
        flex-wrap: wrap;
    }

    .boQuerySort{
        display: flex;
        flex-wrap: wrap;
        gap:1rem;
        align-items: center;
    }

    .boQuerySort .bo-icons{
        width:1.5rem;
        height:1.5rem;
    }

    .boQuerySort select{
        min-width: 0;
        box-sizing: border-box;
        padding: .45rem;
        border-radius: .25rem;
        border: 1px solid var(--bo-neutral-400);
    }

    .bo-query-tags-header{
        margin-bottom:.45rem; /* Rensa denna senare */
    }

    /**Toggle > Grid > Row > Filter**/

    #boToggleGrid,
    #boToggleRow{
        border:none;
        outline:none;
    }

    #boToggleFilter{
        outline:none;
        border:0;
    }

    #boToggleGrid.is-active,
    #boToggleRow.is-active{
        background:var(--bo-blue-200);
    }


    #boToogleCover.is-active {
        outline: 2px solid currentColor;
    }


    .bo-filter-container{
        padding:1.5rem .75rem 1.5rem .75rem;
    }

    .bo-pager-container{
        display: flex;
        justify-content: center;
        padding: 1.5rem .75rem 1.5rem .75rem;
    }

    .bo-range-sliders {
        position: relative;
        height: 32px;
    }

    .bo-range-slider {
        width: 100%;
        margin: 0;
        height: 34px;
    }

    .bo-noui {
    margin: 1.25rem .75rem;
    }

    .noUi-target {
        border: 0;
        box-shadow: none;
        background: rgba(0, 0, 0, .12);
        border-radius: 999px;
        height: 6px;
    }

    .noUi-connect {
        background: rgba(93, 94, 93, 0.35);
    }

    .noUi-handle {
        width: 18px !important;
        height: 18px !important;
        border-radius: 999px;
        background: var(--bo-ink-900);
        border: 2px solid #fff;
        box-shadow: 0 2px 8px rgba(0, 0, 0, .15);
        top: -6px !important;
        right: -9px !important;
    }

    .noUi-handle:before,
    .noUi-handle:after {
        display: none;
    }

    .noUi-touch-area{
        cursor: grab;
    }