/* Página: blog/post */

.post-wrap {
    max-width: 76rem;
    margin: 0 auto;
    padding: 4rem 2rem 2rem;
}
.post-voltar {
    display: inline-flex;
    align-items: center;
    gap: .6rem;
    color: var(--sw-txt-mut);
    text-decoration: none;
    font-size: 1.3rem;
    margin-bottom: 2rem;
}
.post-voltar:hover { color: var(--sw-pri); }
.post-capa {
    width: 100%;
    max-height: 40rem;
    object-fit: cover;
    border-radius: var(--sw-r-g);
    margin-bottom: 2rem;
}
.post-data {
    font-size: 1.3rem;
    color: var(--sw-txt-mut);
}
.post-titulo {
    font-size: 3.2rem;
    font-weight: 800;
    color: var(--sw-txt);
    margin-top: .6rem;
    margin-bottom: 2.4rem;
}
.post-conteudo {
    font-size: 1.5rem;
    line-height: 1.8;
    color: var(--sw-txt-sec);
}
.post-conteudo p { margin-bottom: 1.6rem; }
.post-conteudo img { max-width: 100%; border-radius: var(--sw-r-m); }
.post-conteudo h2, .post-conteudo h3 { color: var(--sw-txt); margin: 2.4rem 0 1.2rem; }

.comentarios-wrap {
    max-width: 76rem;
    margin: 0 auto;
    padding: 2rem 2rem 6rem;
}
.comentarios-titulo {
    font-size: 2rem;
    font-weight: 700;
    color: var(--sw-txt);
    margin-bottom: 2rem;
}
.comentarios-vazio {
    color: var(--sw-txt-mut);
    margin-bottom: 2rem;
}
.comentario-item {
    padding: 1.6rem 2rem;
    background: var(--sw-sur);
    border: 1px solid var(--sw-bor);
    border-radius: var(--sw-r-m);
}
.comentario-autor {
    font-weight: 700;
    color: var(--sw-txt);
    font-size: 1.3rem;
}
.comentario-data {
    font-size: 1.1rem;
    color: var(--sw-txt-mut);
    margin-left: 1rem;
}
.comentario-texto {
    margin-top: .6rem;
    font-size: 1.3rem;
    color: var(--sw-txt-sec);
    line-height: 1.6;
    white-space: pre-wrap;
}
.comentario-flash-ok {
    padding: 1.2rem 1.6rem;
    background: color-mix(in srgb, var(--sw-suc) 15%, transparent);
    color: var(--sw-suc);
    border-radius: var(--sw-r-m);
    margin-bottom: 1.6rem;
    font-size: 1.3rem;
}
.comentario-form {
    padding: 2rem;
    background: var(--sw-sur);
    border: 1px solid var(--sw-bor);
    border-radius: var(--sw-r-g);
}
.comentario-form h3 {
    font-size: 1.6rem;
    font-weight: 700;
    color: var(--sw-txt);
    margin-bottom: 1.6rem;
}
.comentario-form-row {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 1.6rem;
}
@media (max-width: 600px) {
    .comentario-form-row { grid-template-columns: 1fr; }
}

/* Form fields — página pública não carrega dashboard.css, então precisa
   das próprias regras de campo (mesmo visual do admin). */
.fld { margin-bottom: 1.6rem; }
.fld-lbl {
    display: block;
    font-size: 1.2rem;
    font-weight: 600;
    color: var(--sw-txt-mut);
    margin-bottom: .5rem;
}
.inp {
    width: 100%;
    padding: 1.1rem 1.4rem;
    background: var(--sw-bg-sec);
    border: 1px solid var(--sw-bor);
    border-radius: var(--sw-r-m);
    color: var(--sw-txt-bas);
    font-size: 1.4rem;
    font-family: inherit;
    outline: none;
    transition: border-color .15s;
}
.inp:focus { border-color: var(--sw-pri); }
.inp-err { border-color: var(--sw-per); }
.field-err {
    display: block;
    font-size: 1.15rem;
    color: var(--sw-per);
    margin-top: .4rem;
}