/* ==================================================
   MEU MUNDO PSP - TEMA HALLOWEEN
   --------------------------------------------------
   Este arquivo guarda as cores do site inteiro.
   Para trocar o tema, copie o conteudo de uma das
   pastas em materiais/temas/ para materiais/tema/
   (veja o LEIA-ME.txt em materiais/temas).
   ================================================== */

:root {
    /* cores principais */
    --tema-principal: #000000;      /* preto */
    --tema-destaque: #e07a1f;       /* abobora */
    --tema-claro: #f2b66b;          /* abobora clara */
    --tema-acento: #b35a10;         /* abobora escura */
    --tema-fundo: #f3ead8;          /* pergaminho */

    /* tons de apoio */
    --tema-escuro: #000000;
    --tema-medio: #2a2a2a;
    --tema-acento-escuro: #7a3d08;
    --tema-papel: #f8f3e7;
    --tema-papel2: #ece0c6;
    --tema-papel3: #f6efe1;
    --tema-papel4: #efe3c9;

    /* as mesmas cores em numeros, para transparencias */
    --tema-principal-rgb: 0, 0, 0;
    --tema-destaque-rgb: 224, 122, 31;
    --tema-claro-rgb: 242, 182, 107;
    --tema-acento-rgb: 179, 90, 16;
    --tema-sombra-rgb: 0, 0, 0;

    /* frase da pagina inicial (deixe "" para nao mostrar nada) */
    --tema-mensagem: "Feliz Halloween!";

    /* sombra das letras */
    --tema-sombra-texto: 1px 1px 2px rgba(0, 0, 0, 0.18);
    --tema-sombra-titulo: 2px 2px 2px rgba(0, 0, 0, 0.3);
}

/* titulos dentro dos textos mantem a sombra mais marcada */
.tutorial .t5, .tutorial .t6, .tutorial .t7,
.conteudo .t5, .conteudo .t6, .conteudo .t7 {
    text-shadow: var(--tema-sombra-titulo);
}

/* brilho suave ao passar o mouse nos quadros e botoes */
body a.miniatura:hover, body a.miniatura:focus,
body .menu a:hover, body .menu a:focus,
body a.tube:hover, body a.tube:focus,
body a.autora:hover, body a.autora:focus,
body a.novidade:hover, body a.novidade:focus {
    box-shadow: 0 0 0 3px rgba(var(--tema-destaque-rgb), 0.45),
                0 0 18px rgba(var(--tema-destaque-rgb), 0.55),
                0 12px 24px rgba(var(--tema-principal-rgb), 0.35);
}

/* moldura grande do site em abobora solida, com sombra igual a dos botoes */
body .pagina {
    border: 10px solid #e07a1f;
    box-shadow: 4px 6px 8px rgba(0, 0, 0, 0.75),
                0 0 14px rgba(224, 122, 31, 0.35);
}

/* no celular a moldura fica um pouco mais fina */
@media (max-width: 560px) {
    body .pagina {
        border-width: 6px;
    }
}

/* mensagem "Feliz Halloween!" em abobora da paleta */
body .estacao {
    color: #e07a1f;
}