html {scrollbar-width: auto;}
.detail {padding-block: 50px; --clr-primary-dk: #092d5b; --clr-light: #ededed; --fs-xl: 44px;}
.detail .head h2 {font-weight: var(--fw-semi-bold); font-size: var(--fs-xl); color: var(--clr-primary-dk); margin-bottom: 5px;}
.detail .head button {font-weight: var(--fw-regular); font-size: var(--fs-400);}
.detail .head span {display: block; font-size: var(--fs-600); color: var(--clr-primary-dk);}
.detail .head ul {display: inline-flex; align-items: center; margin-block: 10px 20px;}
.detail .head li {margin-right: 3px;}
.detail .head li svg {fill: var(--clr-secondary);}
.detail .overlay {position: absolute; inset: 0; height: 100%; width: 100%; display: flex; align-items: center; justify-content: center;  background-color: rgb(0 0 0 / .5);}
.detail .feedback {position: relative; width: 500px; margin-inline: auto; background-color: #fff; z-index: 100;}
.detail .feedback button:first-child {position: absolute; top: -20px; right: -20px;}
.detail .feedback .title {border-bottom: 1px solid var(--clr-border); padding: 16px;}
.detail .feedback .title h2 {position: relative; text-align: center; font-size: var(--fs-xl); font-weight: var(--fw-semi-bold); line-height: 160%; color: var(--clr-primary); margin-bottom: 16px;}
.detail .feedback .title h2::before {position: absolute; inset: auto 0 0; margin-inline: auto; width: 168px; height: 5px; background-color: var(--clr-secondary-lt); content: '';}
.detail .feedback form {position: relative; padding: 36px 16px 50px; display: flex; align-items: center; justify-content: center; flex-wrap: wrap; gap: 10px 5px;}
.detail .feedback form :where(input, select, textarea) {width: 48%; padding: 5px; font-size: var(--fs-400); height: 38px; border: 1px solid rgb(118, 118, 118); color: rgb(118, 118, 118);;}
.detail .feedback form select {appearance: none;}
.detail .feedback form input[type="file"]{    padding: 10px 15px 10px 50px !important;background-image: url(https://www.ybyboxes.com.au/wp-content/themes/ybyboxesca/assets/images/icons/file_upload.webp);background-repeat: no-repeat;background-position: 1%;}
.detail .feedback form input[type="number"]::-webkit-inner-spin-button {appearance: none;}
.detail .feedback form textarea {width: 97%; height: 100px; resize: none; margin-bottom: 10px;}
.detail .feedback form button[type="submit"] {width: 138px; color: #fff; background: linear-gradient(#ff3019 0,#cf0404 100%); padding-block: 8px; font-size: var(--fs-400); margin-inline: 8px auto;}
.detail .reviews-list ul {display: flex; flex-direction: column; justify-content: center; gap: 10px;}
.detail .reviews-list ul li  {padding: 60px 15px 26px; background: no-repeat 15px 20px/30px url(https://www.ybyboxes.com.au//wp-content/uploads/2024/03/pp.webp); background-color: var(--clr-light);}
.detail .reviews-list ul li label {margin-block: 10px 16px; font-weight: var(--fw-bold); font-size: var(--fs-300);}
.detail .reviews-list ul li .span {color: #b2b2b2; font-weight: var(--fw-semi-bold);}
.detail .reviews-list ul li p {font-size: calc(var(--fs-400) - 1px); margin-top: 15px;}
.detail .pagination {margin-bottom: 35px;}
.detail .pagination {display: inline-flex; justify-content: end; width: 100%; margin-top: 20px; padding-inline: 20px;}
span.page-numbers {padding: 11px 12px; border: 1px solid #dee2e6; background-color: var(--clr-primary); color: #fff;}
span.page-numbers.current {background-color: var(--clr-secondary);}
a.page-numbers {padding: 11px 12px; border: 1px solid #dee2e6; background-color: var(--clr-primary); color: #fff;}

@media only screen and (width < 991px) {
.detail {--fs-xl: 36px; padding-top: 25px;}
}
@media only screen and (width < 767px) {
.detail {--fs-xl: 32px; --fs-600: 18px;}
.custom__btn-primary {width: 130px; height: 40px;}
}
@media only screen and (width < 575px) {
.detail {--fs-xl: 28px; --fs-600: 16px;}
.detail .head button {font-size: 15px; margin-bottom: 10px;}
.detail .feedback {max-width: 380px;}
}
@media only screen and (width < 475px) {
.detail .feedback {max-width: 280px;}
.detail .feedback .title h2 {margin-bottom: 0;}
.detail .feedback .title h2::before {width: 110px;}
.detail .feedback form {flex-direction: column; padding-block: 20px;}
.detail .feedback form :is(input, select, textarea) {width: 100%;}
}