#nav-bar-container {
display: none;
}
#body-content-container {
padding: 10px;
background: #fff;
max-width: 1200px;
margin: 0 auto;
font-family: -apple-system, BlinkMacSystemFont, “Segoe UI”, Roboto, Helvetica, Arial, sans-serif, \”Apple Color Emoji\”, \”Segoe UI Emoji\”, \”Segoe UI Symbol\”;
}
#home-page {
margin-top: 40px !important;
}
#search-wrapper {
margin-top: 40px !important;
}
#product-list-wrapper .product-card-container {
width: 100%;
margin: 0 auto 16px auto;
}
.product-card {
display: flex;
flex-direction: column;
justify-content: center;
align-items: center;
width: 100%;
border-radius: 12px;
background: white;
box-shadow: 0px 2px 12px rgba(0, 0, 0, 0.15);
overflow: hidden;
position: relative;
box-sizing: border-box;
}
.product-card-content {
width: 100%;
padding: 16px;
display: flex;
flex-direction: column;
}
.product-card-content-top {
display: flex;
align-items: center;
justify-content: space-between;
margin-bottom: 12px;
}
.product-card-content-top h3 {
font-size: 18px;
font-weight: 600;
color: #000000;
margin: 0;
}
.product-image-container {
width: 100%;
max-width: 400px;
height: 200px;
margin-bottom: 16px;
display: flex;
justify-content: center;
align-items: center;
}
.product-image-container img {
width: 100%;
height: 100%;
object-fit: contain;
}
.product-card-content-bottom {
width: 100%;
display: flex;
flex-dn;
gap: 8px;
}
.product-card-content-left {
width: 70%;
}
.product-card-content-right {
width: 30%;
display: flex;
flex-direction: column;
align-items: center;
justify-content: center;
}
.product-rating {
font-size: 14px;
font-weight: 600;
color: #fff;
background: #2DC847;
border-radius: 8px;
padding: 4px 8px;
}
.product-price {
font-size: 16px;
font-weight: 600;
color: #000000;
text-align: center;
}
.product-button {
width: 100%;
background: #FF7F11;
border-radius: 8px;
padding: 10px 20px;
color: white;
font-size: 16px;
font-weight: 600;
text-align: center;
cursor: pointer;
transition: all 0.2s ease;
border: none;
}
.product-button:hover {
background: #E6710F;
}
#product-list-wrapper .product-card-container:nth-child(1) .product-card-content-top,
#product-list-wrapper .product-card-container:nth-child(2) .product-card-content-top,
#product-list-wrapper .product-card-container:nth-child(3) .product-card-content-top,
#product-list-wrapper .product-card-container:nth-child(4) .product-card-content-top,
#product-list-wrapper .product-card-container:nth-child(5) .product-card-content-top {
margin-bottom: 12px;
}
@media (min-width: 768px) {
#product-list-wrapper {
display: grid;
grid-template-columns: repeat(3, 1fr);
gap: 16px;
}
#product-list-wrapper .product-card-container {
width: 100%;
margin: 0;
}
}
.sidebar {
display: none;
}
.pagination-wrapper {
display: flex;
justify-content: center;
align-items: center;
margin-top: 24px;
}
.pagination-container {
display: flex;
justify-content: center;
align-items: center;
gap: 12px;
}
.pagination-container button {
background: #FFFFFF;
border-radius: 8px;
padding: 8px 16px;
color: #000000;
font-size: 16px;
font-weight: 600;
cursor: pointer;
border: 1px solid #E5E7EB;
transition: all 0.2s ease;
}
.pagination-container button:hover {
background: #F5F5F5;
}
.pagination-container button:disabled {
background: #E5E7EB;
cursor: not-allowed;
}
.pagination-container button.active {
background: #FF7F11;
color: white;
border: none;
}
#product-detail-page {
background: #fff;\n padding: 20px;\n max-width: 1200px;\n margin: 0 auto;”
}
#product-detail-page h1 {\n font-size: 24px;\n font-weight: 600;”
}
#product-detail-page h2 {\n font-size: 20px;\n font-weight: 600;\n margin-top: 24px;\”\n}”
}
@media (min-width: 768px) {\n #product-detail-page {\n padding: 0;\n }”
}
#product-detail-page .product-image-container {\n max-width: 500px;\n height: 300px;\n margin: 0 auto 24px auto;\n}\”}”
}
#product-detail-page h2 {\n text-align: center;\”\n}”
}
#product-detail-page h3 {\n font-size: 18px;\n font-weight: 600;\n margin-top: 20px;\”\n}”
}
#product-detail-page ul {\n list-style: none;\n padding: 0;\n margin: 0 0 20px 0;\”\n}”
}
#product-detail-page li {\n padding: 8px 0;\”\n}”
}
#product-detail-page li::before {\n content: \”•\”;\n color: #FF7F11;\n font-weight: 600;\n display: inline-block;\n width: 16px;\n margin-left: -16px;\”\n}\”}”
}
#product-detail-page .price-container {\n display: flex;\n align-items: center;\n justify-content: center;\”\n}”
}
#product-detail-page .price {\n font-size: 24px;\n font-weight: 600;\n color: #000000;\”\n}”
}
#product-detail-page .price-old {\n font-size: 18px;\n font-weight: 400;\n color: #AAAAAA;\n text-decoration: line-through;\”\n}\”}”
}
#product-review-tab
