.product-card .product-sticker.theme {
top: 58px;
right: 8px;
}
.product-card figure:has(.card-contador) .product-sticker.soon {
bottom: 2.4rem;
}
.product-card {
display: flex;
flex-direction: column;
}
.product-card .product-info {
flex: 1;
display: flex;
flex-direction: column;
}
.product-card .price {
margin-top: auto;
align-self: flex-start;
}
.product-card .price,
.product-card .card-actions {
order: 1;
}
@media (max-width: 1024px) {
.header-links {
min-width: 0;
overflow-x: auto;
scrollbar-width: none;
}
.header-links::-webkit-scrollbar {
display: none;
}
.header-links > * {
flex: 0 0 auto;
white-space: nowrap;
}
.header-links > [data-cart] {
position: sticky;
right: 0;
z-index: 1;
box-shadow: -10px 0 8px var(--surface-neutral-9);
}
}
@media (max-width: 760px) {
.header-links {
gap: 0.5rem;
}
.temas-topo span {
display: none;
}
}
@media (max-width: 560px) {
.app-header {
position: relative;
}
.brand {
max-width: calc(100% - 5.4rem);
}
.header-links > [data-cart] {
position: absolute;
top: 0.8rem;
right: 1rem;
box-shadow: none;
}
}
@media (max-width: 1024px) {
.header-links > [data-consult] {
display: inline-grid;
place-items: center;
min-width: 40px;
min-height: 40px;
border: 1.5px solid var(--line-pink-8);
border-radius: 13px;
background: var(--surface-neutral-9);
text-decoration: none;
}
}
@media (min-width: 761px) and (max-width: 1024px) {
.app-header {
padding-inline: 1rem;
gap: 1rem;
}
.brand {
flex: 0 0 auto;
}
.brand strong,
.brand small {
white-space: nowrap;
}
.header-links {
gap: 0.6rem;
}
.header-links .desktop-only {
display: none;
}
}
@media (min-width: 761px) and (max-width: 1024px) {
.hero-copy .row {
display: grid;
grid-template-columns: repeat(2, minmax(0, 1fr));
gap: 0.45rem;
}
.hero-copy .row .btn {
width: 100%;
justify-content: center;
text-align: center;
}
}
@media (max-width: 760px) {
.hero-copy {
min-width: 0;
}
.hero-promises {
flex-wrap: nowrap;
overflow-x: auto;
scrollbar-width: none;
}
.hero-promises::-webkit-scrollbar {
display: none;
}
.hero-promises li {
flex: 0 0 auto;
white-space: nowrap;
}
.hero-image {
height: 120px;
min-height: 120px;
}
}
@media (max-width: 1024px) {
.toolbar > .filters {
flex: 1 1 100%;
min-width: 0;
flex-wrap: nowrap;
overflow-x: auto;
scrollbar-width: none;
padding-bottom: 2px;
}
.toolbar > .filters::-webkit-scrollbar {
display: none;
}
.toolbar > .filters > .chip {
flex: 0 0 auto;
white-space: nowrap;
}
}
@media (max-width: 1024px) {
.colecoes-lista:has(> :nth-child(3)) {
grid-template-columns: repeat(auto-fit, minmax(150px, 1fr));
}
.colecoes-lista:not(:has(> :nth-child(3))) {
grid-template-columns: repeat(auto-fit, minmax(min(100%, 300px), 1fr));
}
.colecoes-lista:not(:has(> :nth-child(3))) .colecao-cartao {
grid-template-columns: 112px 1fr;
column-gap: 0.8rem;
align-content: center;
}
.colecoes-lista:not(:has(> :nth-child(3))) .colecao-cartao figure {
grid-row: 1 / span 2;
}
.colecoes-lista:not(:has(> :nth-child(3))) .colecao-cartao b {
align-self: end;
}
.colecoes-lista:not(:has(> :nth-child(3))) .colecao-cartao small {
align-self: start;
}
}
@media (max-width: 560px) {
.products {
grid-template-columns: repeat(2, minmax(0, 1fr));
gap: 0.6rem;
}
.product-card {
border-radius: 16px;
}
.product-card figure {
height: auto;
aspect-ratio: 1 / 1;
}
.product-card .product-icon {
left: 0.45rem;
bottom: 0.45rem;
width: 36px;
height: 36px;
border-radius: 12px;
font-size: 1.15rem;
}
.product-card .product-sticker {
top: 0.45rem;
left: 0.35rem;
max-width: calc(100% - 3.2rem);
padding: 0.15rem 0.35rem;
overflow: hidden;
text-overflow: ellipsis;
white-space: nowrap;
font-size: max(0.72rem, 12px);
}
.product-card .product-sticker.theme {
top: 3.4rem;
left: auto;
right: 0.45rem;
max-width: calc(100% - 0.9rem);
}
.product-card .product-sticker.soon {
top: auto;
left: auto;
right: 0.45rem;
bottom: 0.45rem;
}
.product-card figure:has(.card-contador) .product-sticker.soon {
bottom: 2.3rem;
}
.product-card .fav-coracao {
top: 0.4rem;
right: 0.4rem;
width: 38px;
height: 38px;
font-size: 0.95rem;
}
.product-card .product-info {
padding: 0.65rem 0.6rem 0.7rem;
gap: 0.4rem;
}
.product-card .mini-label {
font-size: max(0.72rem, 12px);
}
.product-card h3 {
font-size: 0.95rem;
line-height: 1.2;
}
.product-card h3 + p.small {
display: -webkit-box;
-webkit-box-orient: vertical;
-webkit-line-clamp: 2;
line-clamp: 2;
overflow: hidden;
font-size: max(0.78rem, 12px);
}
.product-card .price {
padding: 0.15rem 0.6rem;
font-size: 1rem;
}
.product-card .card-actions .btn {
padding-inline: 0.4rem;
font-size: 0.85rem;
}
}
@media (max-width: 560px) and (pointer: coarse) {
.product-card .card-seta {
display: none;
}
.product-card figure[data-card-pid] {
touch-action: pan-y;
}
}