/* Receitas: nota (média de estrelas) no cartão e bloco "Dê a sua nota" dentro da receita. Estrelas na cor azul da marca. */
.rc-nota-linha { display: flex; align-items: center; flex-wrap: wrap; gap: 4px 8px; margin: 0 0 12px; font-size: calc(14px * var(--a11y-fs, 1)); font-weight: 600; color: var(--muted); }
.rc-nota-linha[hidden] { display: none; }
.rc-nota-linha .rc-estrelas { color: var(--blue); font-size: calc(14px * var(--a11y-fs, 1)); letter-spacing: 1px; white-space: nowrap; }
.rc-nota-linha strong { color: var(--ink); }

.rc-avaliar { margin: 18px 0 4px; padding: 16px 18px; border-radius: 16px; background: var(--blue-50); border: 1px solid var(--blue-100); }
.rc-avaliar[hidden] { display: none; }
.rc-avaliar-titulo { margin: 0 0 8px; font-weight: 700; color: var(--ink); font-size: calc(15px * var(--a11y-fs, 1)); }
.rc-estrelas-input { display: flex; gap: 4px; }
.rc-estrelas-input button {
    width: 46px; height: 46px; display: grid; place-items: center; border: 0; border-radius: 12px; background: transparent; cursor: pointer;
    color: var(--blue); font-size: 26px; transition: transform .15s ease, background-color .15s ease;
}
.rc-estrelas-input button:hover { transform: scale(1.12); background: #fff; }
.rc-estrelas-input button:focus-visible { outline: 3px solid var(--blue); outline-offset: 2px; background: #fff; }
.rc-comentario { margin-top: 12px; }
.rc-comentario[hidden] { display: none; }
.rc-comentario label { display: block; margin-bottom: 6px; font-weight: 600; font-size: calc(14px * var(--a11y-fs, 1)); color: var(--ink); }
.rc-comentario textarea {
    width: 100%; box-sizing: border-box; padding: 10px 12px; border: 1px solid var(--blue-100); border-radius: 12px; resize: vertical;
    font: 500 calc(15px * var(--a11y-fs, 1)) Barlow, Arial, sans-serif; color: var(--ink); background: #fff;
}
.rc-comentario textarea:focus-visible { outline: 3px solid var(--blue); outline-offset: 1px; }
.rc-enviar {
    margin-top: 8px; padding: 10px 18px; border: 0; border-radius: 999px; cursor: pointer; background: var(--blue); color: #fff;
    font: 700 calc(15px * var(--a11y-fs, 1)) Barlow, Arial, sans-serif;
}
.rc-enviar:hover { filter: brightness(1.12); }
.rc-enviar:focus-visible { outline: 3px solid var(--blue); outline-offset: 3px; }
.rc-avaliar-msg { margin: 8px 0 0; min-height: 1.2em; font-size: calc(14px * var(--a11y-fs, 1)); font-weight: 600; color: var(--muted); }

@media (prefers-reduced-motion: reduce) { .rc-estrelas-input button { transition: none; } .rc-estrelas-input button:hover { transform: none; } }
