.single-product div.product .ostu-gpanel {
display: grid;
gap: 12px;
min-width: 0;
margin-top: 16px;
}
.single-product div.product .ostu-gpanel.ostu-gpanel--desk {
display: none;
}
.single-product div.product .ostu-gpanel .ostu-gpanel__box {
min-width: 0;
margin: 0;
padding: 14px 16px 16px;
background-color: var(--surface, #ffffff);
border: 1px solid var(--border, #e2e8f0);
border-radius: var(--radius-lg, 16px);
}
.single-product div.product .ostu-gpanel .ostu-gpanel__h {
display: flex;
align-items: baseline;
justify-content: space-between;
gap: 8px;
margin: 0 0 10px;
padding: 0;
font: 600 15px/1.25 var(--font-display, "Space Grotesk", "DM Sans", sans-serif);
letter-spacing: -.01em;
color: var(--slate-dark, #1e293b);
text-transform: none;
}
.single-product div.product .ostu-gpanel .ostu-gpanel__h small {
font: 500 12.5px/1.2 var(--font-body, "DM Sans", "Segoe UI", sans-serif);
letter-spacing: 0;
color: var(--slate-500, #64748b);
}
.single-product div.product .ostu-gpanel .ostu-gpanel__text {
color: var(--slate-600, #475569);
font-size: 14px;
line-height: 1.55;
}
.single-product div.product .ostu-gpanel .ostu-gpanel__text > * {
margin: 0;
}
.single-product div.product .ostu-gpanel .ostu-gpanel__text > * + * {
margin-top: 8px;
}
.single-product div.product .ostu-gpanel :is(.ostu-gpanel__text ul, .ostu-gpanel__checks) {
display: grid;
gap: 6px;
margin: 0;
padding: 0;
list-style: none;
}
.single-product div.product .ostu-gpanel :is(.ostu-gpanel__text ul, .ostu-gpanel__checks) > li {
position: relative;
margin: 0;
padding-left: 24px;
color: var(--slate-dark, #1e293b);
font-size: 14px;
line-height: 1.45;
}
.single-product div.product .ostu-gpanel :is(.ostu-gpanel__text ul, .ostu-gpanel__checks) > li::before {
content: "";
position: absolute;
left: 0;
top: 2px;
width: 16px;
height: 16px;
border-radius: 50%;
background: rgba(4, 120, 87, .1) center / 10px no-repeat url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 12 12'%3E%3Cpath d='M2 6.3l2.4 2.4L10 3.2' fill='none' stroke='%23047857' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E");
}
.single-product div.product .ostu-gpanel .ostu-gpanel__specs {
display: grid;
margin: 0;
font-size: 13.5px;
line-height: 1.4;
}
.single-product div.product .ostu-gpanel .ostu-gpanel__specs > div {
display: grid;
grid-template-columns: minmax(0, 42%) minmax(0, 1fr);
gap: 12px;
padding: 7px 0;
border-top: 1px dashed var(--border, #e2e8f0);
}
.single-product div.product .ostu-gpanel .ostu-gpanel__specs > div:first-child {
border-top: 0;
padding-top: 0;
}
.single-product div.product .ostu-gpanel .ostu-gpanel__specs dt {
margin: 0;
color: var(--slate-500, #64748b);
font-weight: 500;
}
.single-product div.product .ostu-gpanel .ostu-gpanel__specs dd {
margin: 0;
color: var(--slate-dark, #1e293b);
font-weight: 600;
overflow-wrap: anywhere;
}
.single-product div.product .ostu-gpanel .ostu-keyspecs__more {
margin-top: 10px;
}
.single-product div.product .ostu-gpanel .ostu-gpanel__box-list {
display: flex;
flex-wrap: wrap;
gap: 6px;
margin: 0;
padding: 0;
list-style: none;
}
.single-product div.product .ostu-gpanel .ostu-gpanel__box-list > li {
display: inline-flex;
align-items: center;
gap: 6px;
max-width: 100%;
min-height: 30px;
margin: 0;
padding: 3px 10px 3px 4px;
border: 1px solid var(--border, #e2e8f0);
border-radius: 999px;
background-color: var(--surface-2, #f8fafc);
color: var(--slate-dark, #1e293b);
font-size: 13px;
line-height: 1.3;
}
.single-product div.product .ostu-gpanel .ostu-gpanel__box-list > li:not(:has(b)) {
padding-left: 10px;
}
.single-product div.product .ostu-gpanel .ostu-gpanel__box-list b {
display: inline-grid;
place-items: center;
flex: none;
min-width: 22px;
height: 22px;
padding: 0 5px;
border-radius: 999px;
background-color: var(--slate-dark, #1e293b);
color: #ffffff;
font: 700 11px/1 var(--font-body, "DM Sans", "Segoe UI", sans-serif);
font-variant-numeric: tabular-nums;
}
.single-product div.product .ostu-gpanel .ostu-gpanel__box-list span {
min-width: 0;
overflow-wrap: anywhere;
}
@media (max-width: 768px) {
.og-gpanel.single-product .summary .ostu-gpanel.ostu-gpanel--mob {
order: 3;
}
}
@media (min-width: 900px) {
.single-product div.product .ostu-gpanel.ostu-gpanel--desk {
display: grid;
}
.single-product div.product .ostu-gpanel.ostu-gpanel--mob {
display: none;
}
.og-gpanel.single-product div.product > .ostu-gallery-col {
align-self: stretch;
}
.og-gpanel.single-product.woocommerce div.product .ostu-gallery-col div.images.woocommerce-product-gallery {
position: relative;
top: auto;
}
.og-gpanel.single-product div.product .ostu-gallery-col__in.is-fit {
position: sticky;
top: var(--og-gcol-top, 96px);
}
}