/* grid-control-top */
.grid-control-top-section {width: 100%; display: flex; justify-content: flex-start; margin: 0 0 1.5rem 0; padding: 0; border: 0;}

/* grid-control-select */
.grid-control-select {margin: 0; padding: 0;}
.grid-control-select.order-by {min-width: 26rem;}
.grid-control-select-body {display: block; width: 100%; position: relative; margin: 0; padding: 0;}
/* grid-control-select-title */
.grid-control-select-title {width: 100%; display: flex; justify-content: space-between; align-items: center; margin: 0; cursor: pointer;
    padding: 1.3rem 2rem 1.2rem 2rem; background-color: #fdfdfd; border: 1px solid #5f7fa1; border-radius: 1rem;}
.grid-control-select-title > span {font-size: 1.9rem; font-family: "Manrope", sans-serif; font-weight: 700; color: #192B41; line-height: 1;}
.grid-control-select-title::after {content: ""; width:23px; height: 10px; display: inline-block; transform: rotate(-180deg);  
    background: url("../../icon/filter-item-name-arrow.svg") center/contain no-repeat; transition: all 0.3s ease 0s;}
.grid-control-select.open .grid-control-select-title::after {transform: rotate(0deg); transition: all 0.3s ease 0s;}    
/* grid-control-select-content */
.grid-control-select-content {opacity: 0; visibility: hidden; height: 0; transition: all 0.3s ease 0s; position: absolute; top: 100%; left:0;
    width: 100%; padding: 1rem 2rem 1rem 2rem; background-color: #fdfdfd; border: 1px solid #e3e7f1; border-radius: 1rem;
    z-index: 1; box-shadow: 0 0 1rem rgba(0, 0, 0, 0.25);}
.grid-control-select-content > ul {list-style: none; margin: 0; padding: 0; width: 100%;}
.grid-control-select-content > ul > li {font-size: 1.6rem; font-weight: 400; color: #192b41; padding: 0.9rem 0 0.9rem 0; cursor: pointer; 
    line-height: 1; transition: all 0.3s ease}
.grid-control-select-content > ul > li:hover {color: #3a6fa7;}
.grid-control-select-content > ul > li.current {display: none;}
.grid-control-select.open .grid-control-select-content {opacity: 1; visibility: visible; height: auto;}

/* grid-control-bottom */
.grid-control-bottom-section {width: 100%; display: block; margin: 4rem 0 4rem 0; padding: 0; border: 0;}

/* grid-control-pagination */
.grid-control-pagination {display: block; width: 100%; margin: 0; padding: 0;}
.grid-control-pagination ul {display: flex; list-style: none; width: 100%; margin: 0; padding: 0; gap: 1rem; justify-content: center; align-items: center;}
.grid-control-pagination ul > li {}
/* grid-control-pagination - span,a */
.grid-control-pagination ul > li > span,
.grid-control-pagination ul > li > a {display: flex; width: 4.5rem; height: 4.5rem; color: #192b41; font-size: 1.9rem;
    justify-content: center; align-items: center; border-radius: 0.5rem;}
.grid-control-pagination ul > li > span {}
.grid-control-pagination ul > li > a {text-decoration: none; transition: all 0.3s}
.grid-control-pagination ul > li > a:hover {color: #fff; background-color: #3a6fa7;}
.grid-control-pagination ul > li.active > span {color: #fff; background-color: #3a628c; }
.grid-control-pagination ul > li.disabled > span {opacity: 0.4;}
/* grid-control-pagination - span,a - svg */
.grid-control-pagination ul > li > span > svg,
.grid-control-pagination ul > li > a > svg {width: 80%;}
.grid-control-pagination ul > li > a:hover > svg {fill: #fff;}