.navbar-brand img {width: 100%;height: 34px;}
.navbar-light .navbar-toggler{border: none;}
.offcanvas-end{width:300px}
.main_carousel{width: 100%;height: 650px;}
.main_carousel img{width: 100%;height: 650px;object-fit: cover;}
.carousel-caption{padding: 1.25rem;background: rgba(0, 0, 0, 0.5);}
.company-logo{width: auto;margin: 5vh auto;}
.company-logo img{width: auto;height: 10vh;}
.product-img .carousel-inner .carousel-item{height: 400px;width: 100%;}
.product-img .carousel-inner .carousel-item img{height: 100%;width: 100%;object-fit: cover;object-position: center;}
.carousel-inner .carousel-item iframe{position: relative;align-self: stretch;width: 100%;height: 400px;object-fit: cover;}
.product-img-thumb img{width: 50px;height: 50px; margin: 0.5rem;cursor: pointer;}
.product-price{padding: 1rem;}
.product-info {min-height: 400px;}
.product-info li h3{padding: 1rem;border-bottom: 1px solid #cecece;}
.product-info li p{padding: 1rem;margin-bottom: 1rem;}
.product-info .card-body {height: 100%;display: flex;flex-direction: column;}
.product-info .card-body ul {height: 100%;display: flex;flex-direction: column;justify-content: space-between;}
.product-info .card-body ul li:first-child {align-self: flex-start;}
.product-info .card-body ul li:last-child {align-self: flex-end;}
.btn_container{padding: 1rem;}
.btn_container button{width: 100%;font-weight: 500;font-size: 1.2rem;}
.btn_container a{color: #fff;text-decoration: none;}
.btn_container a:hover{color: rgba(255, 255, 255, 0.8);}
span.bi{font-size: 1.4rem;padding-right: 1rem;}
.card{border: none;padding-bottom: 1rem;border-bottom: 1px solid #ccc;}
section.product:not(:has(+ section.product)) .card{border-bottom: none;}
.intro_container{width: 100%;padding: 3rem 2rem;}
.intro_container .intro_text{padding: 5%;background: rgba(255, 255, 255, 0.9);border-radius: 20px;text-align: center;}
.intro_container .intro_text h2{font-size: 2rem;line-height: 1;margin-bottom: 2rem;border-bottom: 1px solid #BD5301;color: #BD5301;padding: 1rem 2rem;}
.intro_container .intro_text p{font-size: 1.3rem;line-height: 2;padding: 1rem 2rem;margin-bottom: 1.5rem;color: #733200;}
#intro_bg{background: url(https://showwood.xrt.com.tw/iphone/dist/img/intro_bg.jpg);background-size: cover;background-position: center;}

/* footer */
.footer_container{background: #D27D3B; color: #fff; padding: 1rem;display: flex;justify-content: center;align-items: center;}
h2.footer_title{font-size: 1rem;margin-bottom: 0;line-height: 1;}
.footer_container .footer_text{display: flex;align-items: center;}
.footer_container span{margin: 0 1.5rem;}
.footer_container a{color: #fff;display: flex;align-items: center;}
.footer_container a:hover{color: rgba(255, 255, 255, 0.8);}
.footer_container i{font-size: 1.5rem;margin: 0 0.5rem;line-height: 1;}

/* modal */
.modal-header{border-bottom: none;padding: 1.5rem 1.5rem 0;}
.modal-body{padding: 1.5rem;}
.modal-footer{border-top: none;padding:0 1.5rem 1.5rem;}

/* AR */
model-viewer{width: 100%; height: 100%;}
.model-wrapper {position: relative;display: inline-block;}
.qrcode-wrapper {display: flex;justify-content: center;align-items: center;padding: 10px;}
.qrcode-wrapper img {max-width: 100%;height: auto;}
.icon-ar {display: none;}
@media (max-width: 1024px) {
.icon-ar {display: flex;position: absolute;bottom: 16px;right: 16px;width: 40px;height: 40px;border-radius: 50%;background: #ffffff;align-items: center;justify-content: center;box-shadow: 0 2px 6px rgba(0,0,0,0.2);cursor: pointer;z-index: 100;}
.icon-ar a{color: #666666;width: 40px;height: 40px}
.icon-ar svg {width: 24px;height: 24px;color: #666666;}
}
/* Add spacing between popover and icon on left placement */
.ar-popover-box.bs-popover-start,
.ar-popover-box.bs-popover-left{
  margin-right: 10px !important;
}
/* Popover arrow centered vertically and aligned to right edge (for left placement) */
.ar-popover-box.bs-popover-start .popover-arrow,
.ar-popover-box.bs-popover-left .popover-arrow {
  top: 50% !important;
  right: -8px !important;
  left: auto !important;
  transform: translateY(-50%) !important;
}
@media screen and (max-width: 480px) {
    .product-img-thumb img{margin: 0;}
}

.page-item.active .page-link {z-index: 3;color: #fff;background-color: #0d6efd;border-color: #0d6efd;}
.page-link{border: none;border-radius: 5px;padding: 0.5rem 1rem;margin: 0.5rem; font-size: larger;}