/*   CSS FILE HEADER #
 *
 *   File:         [vinculo.css]
 *   Author(s):    ['Pedro H.F Matias']
 *   Date:         ['09.10.2026']
 *   Version:      ['0.1.0']
 *   Description:  ['The grimoire tied to the FAC sheet (Etapa 5): the Ficha ribbon, the box of the bonuses applied to the spells, the read-only sections that come from the sheet and the spectral preview of the familiar.']
 */

/* ---------- the Ficha ribbon: the wine of the sheet's Personagem page and a brass stud, it opens another book instead of a page ---------- */
.aba.aba-ir-ficha::after { content: ''; position: absolute; left: 50%; bottom: 22px; width: 7px; height: 7px; margin-left: -3.5px; border-radius: 50%; background: #e2b85c; box-shadow: 0 0 0 1px rgba(0, 0, 0, .35), inset 0 1px 1px rgba(255, 220, 200, .5); }

/* ---------- bonuses applied to the spells (CalculoFicha.bonusMagia) ---------- */
.secao-bonus .dica { margin: -6px 0 10px; }
.lista-bonus { columns: 2 300px; column-gap: 28px; margin: 0; padding: 0; list-style: none; }
.lista-bonus li { break-inside: avoid; position: relative; padding: .2em 0 .2em 1.35em; color: var(--texto); }
.lista-bonus li::before { content: '✦'; position: absolute; left: .1em; top: .25em; font-size: .85em; color: var(--ouro-2); }
.lista-bonus li.bonus-efeito::before { content: '✧'; }
.lista-bonus li.bonus-mana::before { content: '◆'; color: var(--mana); }
.lista-bonus li.alerta { color: var(--perigo, #b0261b); }
.lista-bonus li.alerta::before { color: currentColor; }
.lista-bonus li.vazio { color: var(--texto-3); font-style: italic; }
.lista-bonus li.vazio::before { content: none; }
.lista-bonus b { color: var(--ouro-2); }

/* ---------- sections that come from the sheet: read only ---------- */
.secao.so-leitura h2 .editar-na-ficha { margin-left: auto; order: 3; font-size: .62em; letter-spacing: .04em; }
.secao.so-leitura .marcar, .secao.so-leitura .devocao, .secao.so-leitura .segmentos button { cursor: default; }
.secao.so-leitura .marcar:hover { background: none; }
.secao.so-leitura .devocao:hover { border-color: var(--borda); }
.secao.so-leitura .devocao.ativa:hover { border-color: var(--mana); }
.secao.so-leitura input:disabled { opacity: 1; }
.secao.so-leitura .marcar:has(input:not(:checked)) { opacity: .45; }
.secao.so-leitura .segmentos button:disabled:not(.ativo) { opacity: .4; }
.secao.so-leitura .segmentos button.ativo:disabled { opacity: 1; }
.leitura-linha { margin: 0 0 8px; color: var(--texto-2); font-style: italic; }
.leitura-linha b { color: var(--ouro-2); font-style: normal; }

/* the familiar as it floats on the screen: a spectral light (apps/comum/bichos.js) */
.previa-familiar {
    float: left; display: grid; place-items: center; width: 116px; height: 116px; margin: 0 16px 8px 0; border-radius: 50%; overflow: hidden;
    background: radial-gradient(circle, rgba(168, 216, 255, .28), rgba(20, 34, 60, .78) 62%, rgba(10, 16, 30, .92));
    box-shadow: inset 0 0 22px rgba(168, 216, 255, .35), 0 0 0 2px var(--borda-forte);
}
.previa-familiar.oculto { display: none; }
.previa-familiar canvas { max-width: 104px; max-height: 104px; image-rendering: pixelated; }
#secFamiliar .grade-familiar { clear: both; }
/* the grimoire level comes from the item of the sheet: a written line, not a row of buttons */
.secao.so-leitura #niveisGrimorio { display: block; border: 0; overflow: visible; }
.secao.so-leitura #niveisGrimorio .leitura-linha { margin: 0; }