Implementação de temas nao funcionou

Fui tentar implementar todas as opçÕes de tema conforme sugeriu o exercicio do curso mas ele está dando esse erro aqui: HTTP Status 500 - Cannot find component for expression "tema" referenced from "j_idt9:j_idt10".

package br.com.caelum.livraria.bean;

import javax.faces.bean.ManagedBean;
import javax.faces.bean.SessionScoped;

@ManagedBean
@SessionScoped
public class TemaBean {

    String tema = "vader";

    public String getTema() {
        return tema;
    }

    public void setTema(String tema) {
        this.tema = tema;
    }

    public String[] getTemas() {
        return new String[] { "afterdark", "afternoon", "afterwork", "aristo",
                "black-tie", "blitzer", "bluesky", "bootstrap", "casablanca",
                "cupertino", "cruze", "dark-hive", "delta", "dot-luv",
                "eggplant", "excite-bike", "flick", "glass-x", "home",
                "hot-sneaks", "humanity", "le-frog", "midnight", "mint-choc",
                "overcast", "pepper-grinder", "redmond", "rocket", "sam",
                "smoothness", "south-street", "start", "sunny", "swanky-purse",
                "trontastic", "ui-darkness", "ui-lightness", "vader" };
        }
}

<h:panelGrid columns="2">
            <h:graphicImage library="img" name="logo.png" />

            <h:form rendered="#{usuarioLogado != null}"
                style="position:absolute; right: 10px">
                <p:outputLabel value="Selecione Tema:" for="tema" />

                    <p:themeSwitcher id="basic" style="width:165px"
                        value="#{temaBean.tema}">
                        <f:selectItems value="#{temaBean.temas}" var="tema" itemLabel="#{tema}" itemValue="#{tema}" />
                        <f:ajax />
                    </p:themeSwitcher>
            </h:form>
        </h:panelGrid>