/* Layout Baseado no Exemplo.html */
.configurador {
    display: flex;
    flex-wrap: wrap;
    gap: 20px;
    align-items: flex-start;
    padding: 40px 0;
}

/* Sidebar (Esquerda) */
.sidebar {
    flex: 1;
    min-width: 250px;
    background: #fff;
    padding: 25px;
    border-radius: 8px;
    box-shadow: 0 1px 3px rgba(0,0,0,0.1);
}
.sidebar h3 { margin-top: 0; font-size: 18px; color: #333; margin-bottom: 20px; border-bottom: 1px solid #eee; padding-bottom: 10px; }
.field { margin-bottom: 20px; }
.field label { display: block; font-weight: bold; margin-bottom: 8px; color: #555; font-size: 14px; }
.field select { width: 100%; padding: 12px; border: 1px solid #ddd; border-radius: 4px; background-color: #f9f9f9; font-size: 14px; color: #333; }
.btn-instrucoes { display: block; width: 100%; padding: 12px; text-align: center; background: #fff; border: 1px dashed #ccc; color: #666; border-radius: 4px; cursor: pointer; font-size: 13px; margin-top: 10px; text-decoration: none; transition: 0.2s; }
.btn-instrucoes:hover { border-color: var(--souza-orange); color: var(--souza-orange); background: #fff5f1; }

/* Conteúdo Principal (Centro) */
.main-content {
    flex: 2;
    min-width: 300px;
}
.main-content h3 { margin-top: 0; font-size: 18px; color: #333; margin-bottom: 15px; }

.quantidade-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(140px, 1fr)); gap: 15px; margin-bottom: 30px; }
.qty-item { position: relative; cursor: pointer; }
.qty-item input { position: absolute; opacity: 0; }
.qty-card { border: 1px solid #ddd; border-radius: 8px; padding: 20px; text-align: center; background: #fff; transition: all 0.2s; display: flex; flex-direction: column; gap: 5px; }
.qty-item input:checked + .qty-card { border-color: var(--souza-orange); background: #fff5f1; box-shadow: 0 0 0 1px var(--souza-orange); }
.qty-card span { font-weight: bold; font-size: 16px; color: #333; }
.qty-card .price { color: var(--souza-orange); font-size: 14px; }

.opcionais { background: #fff; padding: 20px; border-radius: 8px; box-shadow: 0 1px 3px rgba(0,0,0,0.1); }
.opcionais label { display: flex; align-items: center; padding: 12px; border-bottom: 1px solid #eee; cursor: pointer; transition: background 0.2s; }
.opcionais label:last-child { border-bottom: none; }
.opcionais label:hover { background: #f9f9f9; }
.opcionais input { margin-right: 15px; transform: scale(1.2); accent-color: var(--souza-orange); }

/* Resumo (Direita) */
.resumo {
    flex: 1;
    min-width: 280px;
    background: #fff;
    padding: 25px;
    border-radius: 8px;
    box-shadow: 0 4px 15px rgba(0,0,0,0.1);
    position: sticky;
    top: 20px;
    text-align: center;
}
.img-preview { margin-bottom: 20px; border-radius: 4px; overflow: hidden; border: 1px solid #eee; }
.img-preview img { width: 100%; height: auto; display: block; }

.total-area h2 { font-size: 36px; color: var(--souza-orange); margin: 10px 0 5px 0; }
.total-area p { color: #999; font-size: 14px; margin: 0 0 20px 0; }

.info-saldo { background: #f8f9fa; padding: 15px; border-radius: 6px; margin-bottom: 20px; text-align: left; font-size: 13px; color: #555; }
.info-saldo p { margin: 5px 0; display: flex; justify-content: space-between; }

.btn-comprar { width: 100%; padding: 15px; background: var(--souza-orange); color: white; border: none; border-radius: 6px; font-size: 18px; font-weight: bold; cursor: pointer; transition: background 0.2s; }
.btn-comprar:hover { background: #d63b1f; }

.prazo { margin-top: 15px; font-size: 13px; color: #777; display: flex; align-items: center; justify-content: center; gap: 5px; }