@import url("reference.css");


body{
}

main{
max-width: none;
padding: 0 0 5em 0;
}

.page-title{
    font-size:2em;
    margin:0 0 -.5em .5em;
    padding:.5em .75em;
    border-radius: .125em;
    display: inline-block;
    background:var(--color-blueDark);
    color:#fff;
    transform:rotate(-2deg);
}

.page-description{
    max-width:60ch;
    padding:1.5em 1em 1em;
    line-height: 1.4;
}

.flx{
    position: relative;
    display: flex;
    flex-flow: row wrap;
    align-items: flex-end;
}

form#refTable{

    border-top:1px solid rgba(0,0,0,.2);
    border-bottom:1px solid rgba(0,0,0,.2);
}

.table-controls{
    background:#fff;
}
.table-controls ul.top-cntls{
    display: flex;
    flex-flow:row  wrap;
    align-items: flex-start;
    justify-content: space-between;
}
.table-controls ul.top-cntls li{
    padding:2em 1em 1em;
    flex:3 1 auto;
}
.table-controls > ul li.set-adv-crits{
    flex:3 2 38ch;
}
.table-controls > ul li.set-adv-crits select{
    width:100%;
    border-radius: .25em;
}


.search-wrap .iw input[type="text"]{
    min-width: 34ch;
}





.search-wrap .togs {
    font-size: .75em
}
.search-wrap .togs label{
    display: flex;
    flex-flow:row nowrap;
    gap:.25em;
    padding:.125em;
    align-items: center;
}













.table-controls .advanced-search{
}

.table-controls.show-adv .advanced-search{
    display: block;
}



.table-controls .advanced-search ul.spec-list{
    --numCols: 2;
    --gap: 24px;
    --subt: calc(calc(calc(var(--numCols) - 1) * var(--gap))  /   var(--numCols));
    display: flex;
    flex-flow: row wrap;
    gap:var(--gap);
    background:#fff;
}
.table-controls .advanced-search ul.specs-set{
    padding:1em 1em 1em;
    box-shadow: inset 0px 3px 6px -5px rgba(0,0,0,0.5) ;
    border:1px solid rgba(0,0,0,0.05);
    border-bottom:1px solid rgba(0,0,0,0.25);
    border-top:1px solid rgba(0,0,0,0.25);
    background-color: rgba(0, 0, 0, 0.05)
}



.advanced-search ul li.spec{
    flex:0 0 calc( calc(100% / var(--numCols)) -  var(--subt));
    max-width:700px;
    display: none;
    flex-flow:row nowrap;
    align-items: stretch;
    font-size:.75em;
    background:rgb(255, 255, 255);
    background-image: linear-gradient(to bottom, #fff 0%,#e9e9e9 100%);
    border-radius: 5px;
    border:1px solid rgba(0, 0, 0, 0.5);
    min-height: 4em;
    position: relative;
    padding-left:.5em;
}
.advanced-search ul li.spec .cx{
    position: absolute;
    top:-.25em; left:-.25em;
    font-size:24px;
    color:rgb(157, 157, 157);

}
.advanced-search ul li.spec .cx:hover{
    cursor: pointer;
    color:rgb(255, 100, 84);

}

.advanced-search ul li.spec.use{
    display: flex;
}


.advanced-search ul li.spec .prop-lbl{
    display: flex;
    flex-flow:row wrap;
    justify-content: flex-end;
    align-items: center;
    gap:.5em;
}
.advanced-search ul li.spec .prop-lbl em{
    font-size: 1.25em;
    font-weight: bold;
    order:3;
}
.advanced-search ul li.spec .prop-lbl > span{
    font-size: .85em;
    font-style: italic;
}
.advanced-search ul li.spec .nm{
    flex:1 0 5em;
    align-self: center;
    text-align: right;
    padding:.5em 1em;
    font-size:1.2em;
}

.advanced-search ul li.spec .un{
    flex:0 0 4.5em;
    padding:0 .5em;
    font-weight: bold;
    text-align: center;
    align-self: center;
}

.advanced-search ul li.spec .set-numeric{
    flex:0 0 15em;
    display: flex;
    font-size: 1.25em;
    font-family: var(--fontFamMono);
}


.advanced-search ul li.spec .v-fr,
.advanced-search ul li.spec .v-to{
    width:50%;
    border-left:1px solid rgba(0,0,0,0.2);
    border-right:1px solid rgba(0,0,0,0.2);
    background-color: rgba(255,255,255,1);
}
.advanced-search ul li.spec .v-to{
    display: none;
}
.advanced-search ul li.spec.use-range  .v-to{
    display: block;
}

.advanced-search ul li.spec .rng-tog{
display: flex;
gap:.5em;
flex-flow: row nowrap;
justify-content: flex-end;
font-size:.85em;
margin-top:.25em;
}

.advanced-search ul li.spec.enum .nm{
    flex:0 0 40%;
}
.advanced-search ul li.spec.enum .ms{
    flex:0 0 60%;
    align-self: stretch;
}
.advanced-search ul li.spec.enum .ms .selectize-control{
        height:100%;
}
.advanced-search ul li.spec.enum .ms .selectize-control .selectize-input{
    height:100%;
    box-shadow: inset 0px 3px 6px -5px rgba(0,0,0,0.5) !important;
    background-color: rgba(255, 255, 255, 1) !important;
    border-radius: 0 .25em .25em 0;
    padding:.5em 1em ;
}
.advanced-search ul li.spec.enum .ms .selectize-control .selectize-input.items .item{
    background-image: linear-gradient(to bottom, #f7f7f7 0%,#e4e4e4 100%);
    border-bottom:1px solid rgba(0,0,0,0.3);
}
.advanced-search ul li.spec.enum .ms .selectize-control .selectize-input.items .item.active{
    background: rgb(212, 251, 255);
    color:#333;
}

/*
.advanced-search ul li.spec select.v{
    flex:0 0 14.5em;
    border-radius: 0 5px 5px 0;
    width:100%;
    border:none;
    font-size:1.25em;
    border-left:1px solid rgba(0,0,0,0.3);
}
*/

.advanced-search ul li.spec.num input[type="text"]{
    width:100%;
    text-align: center;
    padding-left:.25em;
    padding-right:.25em;
}
.advanced-search ul li.spec.num input:focus{
    background-color: rgba(252, 255, 200, 1);
}
.advanced-search ul li.spec.num input:not(:placeholder-shown),
#partnumSearch:not(:placeholder-shown)
{
    background-color: rgb(231, 250, 255);
    color:rgb(31, 77, 47);
    font-weight: bold;
}





.table-controls ul.bot-cntls{
    display: flex;
    flex-flow:row  wrap;
    align-items: center;
    justify-content: flex-start;
    gap:1em;
    border-top:1px solid rgba(0,0,0,0.2);
}

.table-controls ul.bot-cntls > li{
     padding:.5em 1em;
 }


.sbm{
    display: flex;
    align-items: center;
    justify-content: flex-end;
    gap:1em;
}

.pagination{
    margin-left:auto;

}


.sub-btn{
    background-color: var(--color-blue);
    color:#fff;
    border-radius: .5em;
}
.form-altered .sub-btn{
    display: block;
}
.clear-btn{
    display: flex;
    flex-flow: row nowrap;
    align-items: center;
    gap:.5em;
    color:#fff;
    border-radius: .5em;
    border:1px solid rgb(144, 66, 75);
    color:var(--color-red);
}
.clear-btn:hover{
    text-decoration: none;
    color:rgb(144, 66, 75)
}





.tf{
    display: flex;
    flex-flow:row nowrap;
    gap:.5em;
    justify-content: flex-start;
    align-items: center;
    align-self: stretch;
    background-color: rgb(255, 237, 0);
    color:rgba(0,0,0,0.85);
}
.tf em{
    font-weight:900;
}
.tf span{
}


.none-found{
    padding:2em;
    text-align: center;
}
.none-found h2{
    font-size: 2em;
    margin-bottom: 1em;
}

.none-found .try-again{
    font-size: 1.5em;
    border-radius: .5em;
    background-color: var(--color-blue);
    color:#fff;
}




















/* _____________________________________________________________________________________


_____________________________________________________________________________________ */


@media (max-width: 1080px) {

    .table-controls .advanced-search ul.spec-list{
        --numCols: 1;
        --gap: 16px;
    }

    .advanced-search ul li.spec{
        max-width:none;
    }

}




@page {
    size: landscape legal;
    margin:1cm;
}
@media print{
    .no-print, .no-print * { display: none !important; }

    header,
    .breadcrumbs,
    footer,
    .btn-row,
    .table-controls,
    .page-title
    {display: none;}
    html, body{
        background:#fff;
    }


    .scrollable{
        overflow: visible;
        border:none !important;
    }
    .scrollable::before,
    .scrollable::after{
        content:none !important;
    }

    article.page::before{
        content:"from reference.huntingtonaudio.com";
        display: block;
        position:absolute;
        right:0;
        text-align: right;
        font-family: var(--fontFamMono);
        margin-bottom:1em;
    }
    #componentList th{
        font-size:.5em;
        font-weight: 700;
        background:#fff !important;
        filter:none;
    }
    #componentList th .si{
        display: none;
    }

    article.page{
        box-shadow: none !Important;
    }

    article.page section.title{
        background-color: #fff;
        color:#000;
    }

    table.component-list tr td{
        font-size:.65em !important;
        page-break-inside: avoid;

    }
    table.component-list tr td{
        background-color:transparent;
    }
    table.component-list tr:hover td{
        filter:none !important;
    }
    table.component-list tr:hover td.partnum{
        text-align:left !important;
    }

    table.component-list tr.og{
        background:#ccc;
        border:none !important;
    }
    table.component-list tr.og td{
        background:rgba(255,255,255,.25)
    }
    table.component-list tr.og td.last{
        background:#fff;
    }
    table.component-list tr.og td.partnum{
        border:2px solid #000;
    }

    .matched{
        border-bottom:none !important;
    }

    .partnum {
        font-size:.75rem !important;
    }
    .partnum .st{display: none !important;}

    .descr a{
        color:inherit;
    }
    .table-descr button{
        color: inherit !important;
        font-weight: 400 !important;
    }
    .table-descr button::after{
        content: " (on reference.huntingtonaudio.com)";
        font-weight:bold;
    }
    .rsc-links a{
        color:#fff;
        position: relative;
    }
    .rsc-links a::after{
        content:attr(href);
        font-size:.7em;
        font-family: var(--fontFamMono);
        display: block;
        color:#000;
        position: absolute;
        top:0;
    }

}