@import url('https://fonts.googleapis.com/css2?family=Plus+Jakarta+Sans:wght@400;700;800&display=swap');

:root {
    --primary: #4B231B;
    --accent: #D47C96;
    --bg-body: #FFF4F7;
    --border-pink: #F7C9D6;
}

body { font-family: 'Plus Jakarta Sans', sans-serif; background-color: var(--bg-body); margin: 0; color: var(--primary); }

.header-main { background: #fff; text-align: center; padding: 25px 0; border-bottom: 1px solid var(--border-pink); }
.container-vitrine { max-width: 1050px; margin: 0 auto; padding: 15px; }

.grupo-tamanhos{display: flex;gap: 7px;justify-content: flex-end;align-items: center;}
/* TÍTULOS LADO A LADO - REDUZIDOS */
.cat-title { 
    font-size: 17pt; 
    font-weight: 800; 
    border-left: 6px solid var(--primary); 
    padding-left: 15px; 
    margin: 25px 0; 
    text-transform: uppercase;
}

/* CONTAINER FLEX */
.flex-artesanal { 
    display: flex; 
    flex-wrap: wrap; 
    gap: 28px; 
    justify-content: space-between; 
}

/* LARGURA REDUZIDA EM 15% */
.card-inteiro { width: 100%; }
.card-metade { width: 100%; }

@media (min-width: 768px) {
    .card-metade { width: calc(48.5% - 11px); } /* Compactação para 2 colunas */
}

/* COMPACTAÇÃO DO CARD */
.item-card-full { background: #fff; border-radius: 18px; border: 1px solid var(--border-pink); box-shadow: 0 3px 6px rgba(0,0,0,0.04); overflow: hidden; }
.card-header-flex { display: flex; padding: 14px 21px; gap: 11px; }
.prod-img { width: 100px; height: 100px; border-radius: 12px; object-fit: cover; padding-top: 2%;}
.prod-nome { font-size: 13pt; font-weight: 800; border-bottom: 2px solid var(--accent); display: inline-block; margin-bottom: 6px; }
.prod-desc { font-size: 8.5pt; color: #6d4c41; line-height: 1.3; }
.mt-tamanhos { font-size: 8.5pt;}

/* CONTROLES COMPACTOS */
.radio-input-hidden, .switch input { opacity: 0; width: 0; height: 0; position: absolute; }
.radio-label-custom { cursor: pointer; border: 1.5px solid var(--border-pink); padding: 6px 14px; border-radius: 20px; font-size: 7pt; font-weight: 700; }
input:checked + .radio-label-custom { background: var(--primary); color: #fff; border-color: var(--primary); }

.switch { position: relative; display: inline-block; width: 24px; height: 0.79rem;}
.slider { position: absolute; cursor: pointer; top: 0; left: 0; right: 0; bottom: 0; background-color: #F7C9D6; transition: .4s; border-radius: 34px; }
.slider:before { position: absolute; content: ""; height: 9px; width: 9px; left: 1px; bottom: 2px; background-color: white; transition: .4s; border-radius: 50%; }
input:checked + .slider { background-color: var(--primary); }
input:checked + .slider:before { transform: translateX(10px); }

/* GRADES DE RECHEIO */
.grid-adicionais { display: grid; grid-template-columns: repeat(auto-fit, minmax(190px, 1fr)); gap: 5px; padding: 5px; }
.grupo-selecao { background: #fff; border: 1px solid var(--border-pink); border-radius: 12px; padding: 12px; }
.grupo-titulo { font-size: 8.5pt; font-weight: 800; color: var(--accent); border-bottom: 1px solid var(--border-pink); margin-bottom: 8px; }
.item-nome { font-size: 7.5pt; font-weight: 700; color: var(--primary); }
.item-price{ font-size: 5.5pt; font-weight: 400;}
.item-controls { display: flex; gap: 6px; justify-content: flex-end; align-items: center; }
.item-lista{display: flex; flex-direction: column;}
.item-row{display:flex;flex-direction: row;justify-content: space-between;align-items: center; padding:8px;}
/* FOOTER */
.footer-total { display: flex; justify-content: space-between; align-items: center; padding: 15px; border-top: 1.5px dashed var(--border-pink); }
.total-display { font-size: 20pt; font-weight: 900; }

/* GRADE DE BEBIDAS */
.grid-grade { display: grid; grid-template-columns: repeat(2, 1fr); gap: 10px; }
@media (min-width: 768px) { .grid-grade { grid-template-columns: repeat(6, 1fr); } }
.mini-card { background: #fff; padding: 10px; border-radius: 15px; border: 1px solid var(--border-pink); text-align: center; }
.mini-img { width: 50%; height: 85px; object-fit: cover; border-radius: 8px; }
.mini-title{ font-size:7.5pt; font-weight: 700; margin-top: 8px; color: var(--primary); }