/* ChessFlow · modo escuro (escolhido pelo usuário no botão 🌙/☀️ da barra; fica gravado no aparelho). O Bootstrap 5.3 cuida dos componentes com data-bs-theme="dark"; aqui ficam as cores próprias do ChessFlow. Documentos (prévia do relatório, tabelas de classificação) continuam claros, como papel. A impressão sai sempre no modo claro. */ /* Seletor do torneio em uso (select name="t"): destacado em todas as telas, com o troféu, para ser achado num só olhar */ select.form-select[name="t"] { border: 2px solid #1e6fe0; background-color: #eaf2ff; color: #0b1f4b; font-weight: 700; box-shadow: 0 2px 10px rgba(30, 111, 224, .25); padding-left: 2.4rem; background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 20 20'%3E%3Ctext y='16' font-size='16'%3E%F0%9F%8F%86%3C/text%3E%3C/svg%3E"), var(--bs-form-select-bg-img); background-repeat: no-repeat, no-repeat; background-position: left .7rem center, right .75rem center; background-size: 1.15rem 1.15rem, 16px 12px; } select.form-select[name="t"]:hover { background-color: #dbe9ff; } select.form-select[name="t"]:focus { border-color: #0b1f4b; box-shadow: 0 0 0 .25rem rgba(30, 111, 224, .35); } select.form-select-sm[name="t"] { padding-left: 2.1rem; background-position: left .55rem center, right .5rem center; background-size: 1rem 1rem, 16px 12px; } .cf-tsel-label { font-size: .75rem; font-weight: 700; color: #1e6fe0; text-transform: uppercase; letter-spacing: .04em; margin-bottom: 2px; } [data-bs-theme=dark] select.form-select[name="t"] { background-color: #15305e; color: #fff; border-color: #38a3ff; box-shadow: 0 2px 10px rgba(56, 163, 255, .25); } [data-bs-theme=dark] select.form-select[name="t"]:hover { background-color: #1b3b72; } [data-bs-theme=dark] .cf-tsel-label { color: #8fb8ff; } /* ⇄ Trocar de torneio (cf_tour_pick, assets/tour_pick.js): cartão do torneio em uso + janela de troca (embaixo no celular) */ .cf-tp:not(.cf-tp-sm) { max-width: 560px; } .cf-tp-btn { display: flex; align-items: center; gap: .65rem; width: 100%; text-align: left; background: #eaf2ff; border: 2px solid #1e6fe0; border-radius: 12px; padding: .5rem .55rem .5rem .75rem; color: #0b1f4b; box-shadow: 0 2px 8px rgba(30, 111, 224, .15); } .cf-tp-btn:hover { background: #dbe9ff; } .cf-tp-btn:focus-visible { outline: 0; box-shadow: 0 0 0 .25rem rgba(30, 111, 224, .35); } .cf-tp-ic { font-size: 1.35rem; flex: 0 0 auto; width: 1.7rem; text-align: center; } .cf-tp-tx { flex: 1; min-width: 0; display: flex; flex-direction: column; } .cf-tp-name, .cf-tp-n { font-weight: 600; line-height: 1.25; display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden; overflow-wrap: anywhere; } .cf-tp-tx small { color: #5b6b80; font-size: .8rem; margin-top: 1px; } .cf-tp-sw { flex: 0 0 auto; background: #1e6fe0; color: #fff; border-radius: 8px; padding: .4rem .65rem; font-size: .85rem; font-weight: 600; white-space: nowrap; } dialog.cf-tp-dlg { border: 0; padding: 0; border-radius: 16px; width: min(560px, 94vw); max-width: 94vw; max-height: 80vh; background: var(--bs-body-bg); color: var(--bs-body-color); box-shadow: 0 10px 40px rgba(0, 0, 0, .35); } dialog.cf-tp-dlg::backdrop { background: rgba(0, 0, 0, .45); } .cf-tp-sh { display: flex; flex-direction: column; gap: .5rem; max-height: 80vh; padding: .75rem .9rem .9rem; } .cf-tp-grip { display: none; width: 42px; height: 4px; border-radius: 2px; background: #c4cad3; margin: 0 auto; flex: 0 0 auto; } .cf-tp-top { display: flex; align-items: center; gap: .5rem; font-size: 1.05rem; } .cf-tp-top b { flex: 1; } .cf-tp-q { flex: 0 0 auto; } .cf-tp-list { overflow-y: auto; flex: 1 1 auto; min-height: 0; overscroll-behavior: contain; } .cf-tp-it { display: flex; align-items: center; gap: .6rem; width: 100%; min-height: 54px; text-align: left; background: var(--bs-body-bg); color: inherit; border: 1px solid var(--bs-border-color); border-radius: 10px; padding: .55rem .7rem; margin-bottom: .45rem; } .cf-tp-it:hover { background: #f1f6ff; border-color: #9ec1f5; } .cf-tp-it.on { border: 2px solid #1e6fe0; background: #eaf2ff; } .cf-tp-it.on .cf-tp-ic { color: #1e6fe0; font-weight: 700; } .cf-tp-go { flex: 0 0 auto; color: #adb5bd; font-size: 1.4rem; line-height: 1; } .cf-tp-g { display: block; font-size: .75rem; font-weight: 700; text-transform: uppercase; letter-spacing: .04em; margin: .35rem 0 .35rem; color: #198754; } .cf-tp-g-sched { color: #b26a00; } .cf-tp-g-done { color: #6c757d; display: inline; } details.cf-tp-grp > summary { cursor: pointer; padding: .55rem .25rem; border-top: 1px solid var(--bs-border-color); margin-bottom: .35rem; } @media (max-width: 575.98px), (max-height: 500px) { dialog.cf-tp-dlg { margin: auto 0 0; width: 100%; max-width: 100%; max-height: 88vh; border-radius: 18px 18px 0 0; } .cf-tp-sh { max-height: 88vh; padding-top: .5rem; } .cf-tp-grip { display: block; } } [data-bs-theme=dark] .cf-tp-btn { background: #15305e; color: #fff; border-color: #38a3ff; } [data-bs-theme=dark] .cf-tp-btn:hover { background: #1b3b72; } [data-bs-theme=dark] .cf-tp-tx small { color: #9aa6b5; } [data-bs-theme=dark] .cf-tp-it:hover { background: #1b2638; border-color: #38a3ff; } [data-bs-theme=dark] .cf-tp-it.on { background: #15305e; border-color: #38a3ff; } [data-bs-theme=dark] .cf-tp-it.on .cf-tp-ic { color: #8fb8ff; } [data-bs-theme=dark] .cf-tp-g { color: #75d7a4; } [data-bs-theme=dark] .cf-tp-g-sched { color: #ffc46b; } [data-bs-theme=dark] .cf-tp-g-done { color: #9aa6b5; } [data-bs-theme=dark] { --cf-bg: #0e1522; --cf-surface: #172234; --cf-surface2: #1b2638; --cf-line: #2e3d55; --cf-muted: #9aa6b5; --cf-text: #dee2e6; --cf-zebra: #1f2c42; --cf-hover: #26406b; --cf-blue: #8fb8ff; --bs-body-bg: #0e1522; --bs-body-color: #dee2e6; --bs-border-color: #2e3d55; --bs-secondary-bg: #1b2638; --bs-tertiary-bg: #131c2b; } [data-bs-theme=dark] body { background: var(--cf-bg) !important; color: var(--cf-text); } [data-bs-theme=dark] .bg-white, [data-bs-theme=dark] .bg-light { background-color: var(--cf-surface) !important; } [data-bs-theme=dark] .card, [data-bs-theme=dark] .modal-content, [data-bs-theme=dark] .list-group-item { background-color: var(--cf-surface); border-color: var(--cf-line); } [data-bs-theme=dark] .text-dark { color: #e9ecef !important; } [data-bs-theme=dark] .text-muted { color: var(--cf-muted) !important; } [data-bs-theme=dark] .border, [data-bs-theme=dark] .border-top, [data-bs-theme=dark] .border-bottom { border-color: var(--cf-line) !important; } [data-bs-theme=dark] .card[style*="#f5f9ff"] { background: #16243a !important; border-color: #3d5a8c !important; } [data-bs-theme=dark] footer { border-color: var(--cf-line) !important; } /* Tabelas (cabeçalho azul-marinho continua; zebrado e destaque escuros) */ [data-bs-theme=dark] .table { --bs-table-bg: var(--cf-surface); --bs-table-color: var(--cf-text); --bs-table-border-color: var(--cf-line); } [data-bs-theme=dark] body .table > tbody > tr:nth-child(even):not([class*="table-"]) > * { --bs-table-bg-type: var(--cf-zebra); } [data-bs-theme=dark] body .table > tbody > tr:hover:not([class*="table-"]) > * { --bs-table-bg-state: var(--cf-hover); } [data-bs-theme=dark] .table-light { --bs-table-bg: #0b1f4b; --bs-table-color: #fff; } [data-bs-theme=dark] .cf-hint, [data-bs-theme=dark] .cf-tbar { color: var(--cf-muted); } /* Menus da barra */ [data-bs-theme=dark] .cfn { background: #081329; } [data-bs-theme=dark] .cfn-menu { background: var(--cf-surface); box-shadow: 0 14px 30px rgba(0,0,0,.55); } [data-bs-theme=dark] .cfn-menu a { color: #dbe6ff; } [data-bs-theme=dark] .cfn-menu a small, [data-bs-theme=dark] .cfn-menu .h, [data-bs-theme=dark] .cfn-menu .txt { color: var(--cf-muted); } [data-bs-theme=dark] .cfn-menu a:hover { background: #22324d; } [data-bs-theme=dark] .cfn-menu a.on { background: #26406b; } [data-bs-theme=dark] .cfn-menu hr { border-top-color: var(--cf-line); } /* Janelas próprias: créditos, conectar aparelhos, encerrar/reabrir, link das planilhas */ [data-bs-theme=dark] #cfAbout .cf-box, [data-bs-theme=dark] .about { background: var(--cf-surface); } [data-bs-theme=dark] .cf-person { background: var(--cf-surface2); border-color: var(--cf-line); } [data-bs-theme=dark] .cf-idea span { color: var(--cf-blue); } [data-bs-theme=dark] #cfPair .cfp-box, [data-bs-theme=dark] #cfSt .cfs-box, [data-bs-theme=dark] #cfShare > div { background: var(--cf-surface) !important; color: var(--cf-text); } [data-bs-theme=dark] #cfPair .cfp-tabs { background: #131c2b; border-color: var(--cf-line); } [data-bs-theme=dark] #cfPair .cfp-tabs button { color: var(--cf-muted); } [data-bs-theme=dark] #cfPair .cfp-tabs button.on { background: var(--cf-surface); color: #fff; } [data-bs-theme=dark] #cfPair .cfp-ci { background: #16233a; border-color: #2b4a7a; color: var(--cf-text); } [data-bs-theme=dark] #cfPair .cfp-ci small { color: var(--cf-muted); } [data-bs-theme=dark] #cfPair .cfp-ci.no, [data-bs-theme=dark] #cfPair .cfp-ci.off { background: #131c2b; border-color: var(--cf-line); color: var(--cf-muted); } [data-bs-theme=dark] #cfPair .cfp-row { border-color: var(--cf-line); } [data-bs-theme=dark] #cfPair .cfp-row:nth-child(even) { background: var(--cf-zebra); } [data-bs-theme=dark] #cfSt .cfs-hist { border-color: var(--cf-line); color: var(--cf-muted); } /* ---- Módulo do árbitro ---- */ [data-bs-theme=dark] .board-card.completed, [data-bs-theme=dark] .cr.completed { background-color: #15301f; border-color: #25563a; } [data-bs-theme=dark] .board-card.deleted, [data-bs-theme=dark] .cr.deleted { background-color: #3a1a1f; border-color: #6b2b34; } [data-bs-theme=dark] .board-card.modified, [data-bs-theme=dark] .cr.modified { background-color: #1b2436; border-color: #3d4f73; background-image: repeating-linear-gradient(135deg, rgba(255,255,255,.04) 0 10px, transparent 10px 20px); } [data-bs-theme=dark] .board-card.locked, [data-bs-theme=dark] .cr.locked { background-color: #33181b; border-color: #6b2b34; } [data-bs-theme=dark] .board-card.bye, [data-bs-theme=dark] .cr.bye { background-color: #251d38; border-color: #4a3a73; } [data-bs-theme=dark] .board-card.mine, [data-bs-theme=dark] .cr.mine { background-color: #13263d; border-color: #2d5a8f; } [data-bs-theme=dark] .board-card.final, [data-bs-theme=dark] .cr.final { background-color: #1f2530; border-color: #3a4352; } [data-bs-theme=dark] .cr, [data-bs-theme=dark] .cr.pending { background: var(--cf-surface); border-color: var(--cf-line); } [data-bs-theme=dark] .cr-d { background: rgba(23,34,52,.92); border-color: var(--cf-line); } [data-bs-theme=dark] .cr-info { color: #b8c2cf; } [data-bs-theme=dark] .round-box { background: var(--cf-surface); border-color: #3d5a8c; } [data-bs-theme=dark] .round-num .n { color: var(--cf-blue); } [data-bs-theme=dark] .round-bar, [data-bs-theme=dark] .cbar { background: #2c3646; } [data-bs-theme=dark] .vw-seg { border-color: #3d5a8c; } [data-bs-theme=dark] .vw-seg button { background: var(--cf-surface); color: #cfe0ff; } [data-bs-theme=dark] .vw-seg button.on { background: #1e6fe0; color: #fff; } [data-bs-theme=dark] .vw-flt button { background: var(--cf-surface); color: #cbd3dc; border-color: #34445e; } [data-bs-theme=dark] .vw-flt button.on { background: #1e6fe0; color: #fff; } [data-bs-theme=dark] .cr-res6 button { background: var(--cf-surface2); color: #e7eefc; border-color: #34445e; } [data-bs-theme=dark] .cr-res6 button small { color: var(--cf-muted); } [data-bs-theme=dark] .cr-res6 button:hover { background: #22324d; } /* Azul-marinho some no fundo escuro: versões mais claras */ [data-bs-theme=dark] .c-modified { background: #3b4fa0; color: #fff; } [data-bs-theme=dark] .btn-adv { background: #1e3a7a; } [data-bs-theme=dark] .btn-adv:hover { background: #2b4f9e; } [data-bs-theme=dark] .btn-outline-dark { --bs-btn-color: #dee2e6; --bs-btn-border-color: #6c7a91; --bs-btn-hover-bg: #dee2e6; --bs-btn-hover-color: #0e1522; --bs-btn-hover-border-color: #dee2e6; } /* Faixa do check-in (cores fixas no HTML) */ [data-bs-theme=dark] #ciTitle { color: #75d6a0 !important; } [data-bs-theme=dark] #ciBanner .d-flex[style*="#e9ecef"] { background: #2c3646 !important; } [data-bs-theme=dark] .btn-occ-has { background: #33200f; } [data-bs-theme=dark] .occ-count { border-color: var(--cf-surface); } /* Ocorrências */ [data-bs-theme=dark] table.occ { border-color: #3a4a63; } [data-bs-theme=dark] .occ td, [data-bs-theme=dark] .occ td.lbl { border-color: var(--cf-line); } [data-bs-theme=dark] .occ tbody tr:nth-child(even) td { background: var(--cf-zebra); } [data-bs-theme=dark] .occ tbody tr:hover td { background: var(--cf-hover); } [data-bs-theme=dark] .occ .box { background: var(--cf-bg); border-color: #8a96a8; } [data-bs-theme=dark] .occ .cell.on { background: #3a3114 !important; } [data-bs-theme=dark] .fide-cfg, [data-bs-theme=dark] .fide-kb.ok, [data-bs-theme=dark] .fide-kw.hint { background: #16243a; border-color: #2a3f63; color: #cfe0ff; } [data-bs-theme=dark] tr.fide-dec > td { background: #262214 !important; } [data-bs-theme=dark] .fide-box { background: var(--cf-surface2); border-color: #5c4a14; } [data-bs-theme=dark] .fide-art, [data-bs-theme=dark] .fide-q span { color: #b8c2cf; } [data-bs-theme=dark] .fide-art b { color: var(--cf-blue); } [data-bs-theme=dark] .fide-read { color: #e3e8ef; } [data-bs-theme=dark] .fide-lines li { border-color: #3a4352; } [data-bs-theme=dark] .fl-art { background: #16243a; color: #cfe0ff; } [data-bs-theme=dark] .fide-lines li.tor { background: #332b10; color: #f0d27a; } [data-bs-theme=dark] .occ-zoom button { background: var(--cf-surface2); border-color: #4a5568; color: #cfe0ff; } [data-bs-theme=dark] .fide-man { background: #16243a; } [data-bs-theme=dark] .fide-seal.ok { background: #123524; color: #75d6a0; } [data-bs-theme=dark] .fide-seal.bad { background: #3a1a1f; color: #f1a3ab; } [data-bs-theme=dark] .fide-seal.nd { background: #2a2f36; color: #c3c9d0; } [data-bs-theme=dark] .fide-seal.info { background: #10323a; color: #7fdcf0; } [data-bs-theme=dark] .fide-seal.arb { background: #1d2550; color: #b3c0ff; } [data-bs-theme=dark] .fide-kb.warn, [data-bs-theme=dark] .fide-kw.warn, [data-bs-theme=dark] .sh-warn { background: #332b10; border-color: #6b5a1c; color: #f0d27a; } [data-bs-theme=dark] .occ-foot { background: #131c2b; box-shadow: 0 -4px 12px rgba(0,0,0,.4); } [data-bs-theme=dark] .occ-reg { background: var(--cf-surface); border-color: var(--cf-line); } [data-bs-theme=dark] .occ-reg-i { border-top-color: var(--cf-line); } [data-bs-theme=dark] .occ-reg-i.ill, [data-bs-theme=dark] .pen-alert, [data-bs-theme=dark] #lfSheet .pp-i.ill { background: #2a1719; } [data-bs-theme=dark] .occ-reg-i.irr, [data-bs-theme=dark] #lfSheet .pp-i.irr { background: #2a2014; } [data-bs-theme=dark] .occ-reg-t { background: #2c3646; color: #cbd3dc; } [data-bs-theme=dark] #occModal .occ-reg-m { color: #aeb7c2; } [data-bs-theme=dark] .occ-del { border-color: #6b2b34; color: #f1a3ab; } [data-bs-theme=dark] .occ-del:hover { background: #2a1719; color: #f1a3ab; } [data-bs-theme=dark] .occ-reg-n { color: #cbd3dc; } /* Ocorrências passo a passo (arbiter/index.php) */ [data-bs-theme=dark] .ow-chip, [data-bs-theme=dark] .ow-ch, [data-bs-theme=dark] .ow-opt { border-color: #4a5870; } [data-bs-theme=dark] .ow-ch:active { background: #3a3114; } [data-bs-theme=dark] .ow-back { background: #2a4a8f; } [data-bs-theme=dark] .ow-rule { background: #332b10; border-color: #8a6d12; color: #f0d27a; } [data-bs-theme=dark] .ow-rule.loss { background: #3a1a1f; border-color: #a33a45; color: #f1a3ab; } [data-bs-theme=dark] .ow-opt.on { background: #123524; border-color: #2f9e64; color: #75d6a0; } [data-bs-theme=dark] .ow-cnt { background: #3a1a1f; color: #f1a3ab; } [data-bs-theme=dark] .ow .disc { border-color: #cbd3dc; } [data-bs-theme=dark] .ow .disc.b { background: #000; } [data-bs-theme=dark] .ow-why > summary { color: var(--cf-blue); } /* Ilegalidades/irregularidades */ [data-bs-theme=dark] .pen-alert { border-color: #6b2b34; color: #f1b0b7; } [data-bs-theme=dark] .pen-alert .pen-what { color: #f1a3ab; } [data-bs-theme=dark] .pen-alert .pen-irr { color: #ffc38a; } [data-bs-theme=dark] .pen.ill1 { background: #3a2a10; color: #ffb3b8; } [data-bs-theme=dark] .pen.irr { background: #3a2614; color: #ffc38a; } [data-bs-theme=dark] .pen.prev { background: #2c3646; color: #cbd3dc; } /* Leitura fácil: aviso grande, quem lançou e painel que sobe de baixo (arbiter/index.php) */ [data-bs-theme=dark] .pen-big { background: #2a1719; border-color: #a33a45; color: #f1a3ab; } [data-bs-theme=dark] .pen-big .pb-s { color: #ff9aa5; } [data-bs-theme=dark] .pen-big.ill2 { background: #b02a37; border-color: #b02a37; color: #fff; } [data-bs-theme=dark] .pen-big.ill2 .pb-s { color: #fff; } [data-bs-theme=dark] .pen-big.irr { background: #2a2014; border-color: #b35a12; color: #ffc38a; } [data-bs-theme=dark] .pen-big.irr .pb-s { color: #ffc38a; } [data-bs-theme=dark] .pen-big.prev { background: #2c3646; border-color: #4a5870; color: #cbd3dc; } [data-bs-theme=dark] .who-btn { background: #123524; color: #b9ecd0; } [data-bs-theme=dark] .who-btn .wb-s { color: #8fdcb2; } [data-bs-theme=dark] .who-btn.mod { background: #1d2a45; color: #c9d6f2; } [data-bs-theme=dark] .who-btn.mod .wb-s { color: #a9b9dc; } [data-bs-theme=dark] .who-btn.del { background: #3a1a1f; color: #f1a3ab; } [data-bs-theme=dark] .who-btn.del .wb-s { color: #ff9aa5; } [data-bs-theme=dark] #lfSheet { background: rgba(0,0,0,.65); } [data-bs-theme=dark] #lfSheet .lf-sh { background: var(--cf-surface); color: var(--cf-text); } [data-bs-theme=dark] #lfSheet .lf-grip { background: #4a5870; } [data-bs-theme=dark] #lfSheet .lf-k, [data-bs-theme=dark] #lfSheet .lf-f, [data-bs-theme=dark] #lfSheet .lf-pl small { color: #b8c2cf; } [data-bs-theme=dark] #lfSheet .lf-box.g { background: #123524; color: #b9ecd0; } [data-bs-theme=dark] #lfSheet .lf-box.r { background: #2a1719; border-color: #a33a45; color: #f1a3ab; } [data-bs-theme=dark] #lfSheet .lf-box.rr { background: #b02a37; color: #fff; } [data-bs-theme=dark] #lfSheet .lf-box.a { background: #332b10; border-color: #8a6d12; color: #f0d27a; } [data-bs-theme=dark] #lfSheet .lf-box.o { background: #2a2014; border-color: #b35a12; color: #ffc38a; } [data-bs-theme=dark] #lfSheet details > summary { color: var(--cf-blue); } [data-bs-theme=dark] #lfSheet .pp-d { color: var(--cf-text); } [data-bs-theme=dark] #lfSheet .pp-n, [data-bs-theme=dark] #lfSheet .pp-prev, [data-bs-theme=dark] #lfSheet .pp-at, [data-bs-theme=dark] #lfSheet .pp-by { color: #b8c2cf; } /* Fotos das planilhas */ [data-bs-theme=dark] .btn-sheet-ok { background: #123524; color: #75d6a0; } [data-bs-theme=dark] .btn-sheet-part { background: #33230f; color: #ffc38a; } [data-bs-theme=dark] .sh-chip { background: #242f40; color: #8f9bab; border-color: #34445e; } [data-bs-theme=dark] .sh-chip.ok { background: #198754; color: #fff; border-color: #198754; } [data-bs-theme=dark] .sh-kinds button { background: var(--cf-surface2); color: #e7eefc; border-color: #34445e; } [data-bs-theme=dark] .sh-kinds button.sent { background: #123524; } [data-bs-theme=dark] .sh-kinds button.on { background: #198754; } [data-bs-theme=dark] .sh-warn.info { background: #16243a; border-color: #2a3f63; color: #cfe0ff; } [data-bs-theme=dark] .sh-sent, [data-bs-theme=dark] .sh-item { border-color: var(--cf-line); } /* Check-in */ [data-bs-theme=dark] .ck-title { color: var(--cf-blue) !important; } [data-bs-theme=dark] .st, [data-bs-theme=dark] .ck-card, [data-bs-theme=dark] .pl, [data-bs-theme=dark] .mk, [data-bs-theme=dark] .sticky-tools { background: var(--cf-surface); border-color: var(--cf-line); } [data-bs-theme=dark] .st .n { background: #2c3646; color: #cbd3dc; } [data-bs-theme=dark] .pl.present { background: #15301f; } [data-bs-theme=dark] .pl.absent { background: #3a1a1f; } [data-bs-theme=dark] .dl { border-color: var(--cf-line); } [data-bs-theme=dark] .dl td { border-color: var(--cf-line); } [data-bs-theme=dark] .dl tr:nth-child(even) td { background: var(--cf-zebra); } /* ---- Relatórios ---- */ [data-bs-theme=dark] .sc-wrap { border-color: var(--cf-line); } [data-bs-theme=dark] .sc-t td { border-color: var(--cf-line); } [data-bs-theme=dark] .sc-t tbody tr:nth-child(even) td { background: var(--cf-zebra); } [data-bs-theme=dark] .sc-t tbody tr:hover td { background: var(--cf-hover); } [data-bs-theme=dark] .sc-t input:focus { background: var(--cf-bg); } [data-bs-theme=dark] .fn-t tbody tr.pod1 td, [data-bs-theme=dark] .fn-t tbody tr.pod2 td, [data-bs-theme=dark] .fn-t tbody tr.pod3 td { color: #212529; } /* Documento (prévia do relatório do árbitro-chefe) continua como papel branco */ [data-bs-theme=dark] .cr-paper { background: #fff; color: #1a1a1a; } [data-bs-theme=dark] .cr-paper .text-muted { color: #666 !important; } /* Página das planilhas (equipe remota) */ [data-bs-theme=dark] .bd { background: var(--cf-surface); border-color: var(--cf-line); } [data-bs-theme=dark] .flt .q button { color: var(--bs-secondary-color); } [data-bs-theme=dark] .bd .pn { background: var(--cf-zebra); border-color: var(--cf-line); color: var(--bs-body-color); } [data-bs-theme=dark] .bd .pn span.k i { background: #000; border-color: #8a94a6; } /* Botão do tema na barra */ .cfn-theme { font-size: 1.15rem; line-height: 1; display: inline-flex; align-items: center; justify-content: center; background: rgba(255,255,255,.1) !important; color: #fff; } .cfn-theme:hover { background: rgba(255,255,255,.2) !important; } /* Logotipo: versão com "CHESS" branco no modo escuro (a normal, com "CHESS" azul-marinho, sumiria no fundo escuro) */ .cf-logo-dark { display: none !important; } [data-bs-theme=dark] .cf-logo-light { display: none !important; } [data-bs-theme=dark] .cf-logo-dark { display: block !important; } /* Slogan ("ChessFlow: …"): o "Chess" azul-marinho fica branco no modo escuro */ [data-bs-theme=dark] .cf-sl-c { color: #fff !important; } [data-bs-theme=dark] .cf-sl-f { color: #6cb6ff !important; } /* Quadros de ajuda (ex.: "Como informar as mesas" na distribuição do PGN) */ [data-bs-theme=dark] .cf-help-box{background:#16213a!important;border-color:#3a5487!important} [data-bs-theme=dark] .cf-help-box .bg-white{background:#0f172a!important} [data-bs-theme=dark] .cf-help-box .fw-semibold{color:#9cc4ff!important} /* ---- Telas responsivas (celular, tablet, TV e notebook com poucos pixels) ---- Tabelas largas ganham rolagem própria em assets/tables.js (cfFitTables); aqui o que vale para todas as páginas. */ .form-select.w-auto, .form-control.w-auto, .input-group.w-auto { max-width: 100%; } .container img, .container video { max-width: 100%; } .container pre { white-space: pre-wrap; overflow-wrap: anywhere; } .d-flex > .flex-grow-1, .d-flex > .flex-fill { min-width: 0; } .d-flex.flex-wrap > * { max-width: 100%; } .cf-fit-wrap { max-width: 100%; } @media (max-width: 575.98px) { .container { --bs-gutter-x: 1rem; } .card-body { padding: .75rem; } h1, .h1 { font-size: 1.6rem; } h2, .h2 { font-size: 1.4rem; } h3, .h3 { font-size: 1.25rem; } .btn-group { flex-wrap: wrap; } .nav-tabs, .nav-pills { flex-wrap: nowrap; overflow-x: auto; overflow-y: hidden; scrollbar-width: thin; } .nav-tabs .nav-link, .nav-pills .nav-link { white-space: nowrap; } } /* ---- Título padrão das páginas (cf_title): ícone + título à esquerda, botões à direita ---- */ .cf-title h4 { overflow-wrap: anywhere; } .cf-title-desc { max-width: 980px; } @media (max-width: 575.98px) { .cf-title h4 { font-size: 1.2rem; } .cf-title-act { width: 100%; } } /* Coordenador(a) da equipe de PGN (⭐, organizer/pgn_split.php) */ .badge.cf-coord { background: #ffc107; color: #3d2e00; font-weight: 600; } /* ⭐ Coordena o PGN: botão de ligar/desligar na lista da equipe (Distribuição das mesas e Editar torneio → Árbitros) */ .cf-coord-tg { display: inline-flex; align-items: center; gap: .25rem; font-size: .78rem; line-height: 1.2; padding: .15rem .55rem; border-radius: 999px; border: 1px dashed #c9a227; background: transparent; color: #7a5b00; white-space: nowrap; margin-top: 2px; } .cf-coord-tg:hover { background: #fff3c4; } .cf-coord-tg.on { background: #ffc107; border: 1px solid #e0a800; color: #3d2e00; font-weight: 600; } [data-bs-theme=dark] .cf-coord-tg { color: #ffd66b; border-color: #8a6d1f; } [data-bs-theme=dark] .cf-coord-tg:hover { background: #3a3014; } [data-bs-theme=dark] .cf-coord-tg.on { background: #b38600; color: #fff; border-color: #ffc107; } [data-bs-theme="dark"] .cf-coord-box { background: #3a3014 !important; border-color: #8a6d1f !important; } /* Abas: a aba selecionada fica destacada (fundo azul da marca, texto branco) em todas as telas */ .nav-tabs .nav-link.active, .nav-tabs .nav-item.show .nav-link { background: #1e6fe0; color: #fff !important; border-color: #1e6fe0; font-weight: 600; box-shadow: inset 0 -3px 0 #0b1f4b; } .nav-tabs .nav-link.active .badge { background: #fff !important; color: #1e6fe0 !important; } .nav-tabs .nav-link:not(.active):hover { background: rgba(30, 111, 224, .08); } [data-bs-theme="dark"] .nav-tabs .nav-link.active, [data-bs-theme="dark"] .nav-tabs .nav-item.show .nav-link { background: #38a3ff; color: #0b1f4b !important; border-color: #38a3ff; box-shadow: inset 0 -3px 0 #1e6fe0; } [data-bs-theme="dark"] .nav-tabs .nav-link.active .badge { background: #0b1f4b !important; color: #fff !important; } [data-bs-theme="dark"] .nav-tabs .nav-link:not(.active):hover { background: rgba(56, 163, 255, .12); } @media print { .nav-tabs .nav-link.active { background: none; color: #000 !important; box-shadow: none; } } /* Cadastro do torneio: faixa "Mostrar no portal público" */ [data-bs-theme=dark] div[style*="#e6f6ee"] { background: #173326 !important; border-color: #2f6b4b !important; } [data-bs-theme=dark] div[style*="#eef4ff"] { background: #172a45 !important; border-color: #2f4f7f !important; } /* Distintivo 🤝 ao lado do nome de quem colabora com o projeto (collab_badge(); leva ao mural dos colaboradores) */ .cf-collab-b{display:inline-block;font-size:.8em;line-height:1;padding:2px 5px;border-radius:10px;background:#fff3cd;border:1px solid #ffc107;text-decoration:none;vertical-align:middle} .cf-collab-b:hover{background:#ffe08a} [data-bs-theme=dark] .cf-collab-b{background:#3d3214;border-color:#b58100} @media print{.cf-collab-b{display:none}} /* ✍️ "Feito por" nas Novidades (collab_author_html()) e selos da titulação FIDE/CBX (collab_title_pills()) */ .cf-au{display:inline-flex;flex-wrap:wrap;align-items:center;gap:4px 6px;font-size:.8rem;color:var(--bs-secondary-color);margin-left:2px;vertical-align:middle} .cf-au-who{display:inline-flex;align-items:center;gap:4px;text-decoration:none;font-weight:600} .cf-au-ph{border-radius:50%;object-fit:cover;flex:none;display:inline-block;box-shadow:0 0 0 1.5px #1e6fe0} .cf-au-ini{display:inline-flex;align-items:center;justify-content:center;background:#0b1f4b;color:#fff;font-weight:700;line-height:1} .cf-ttl-pill{display:inline-block;font-size:.7rem;font-weight:700;line-height:1.2;border-radius:10px;padding:2px 7px;white-space:nowrap;border:1px solid transparent} .cf-ttl-fide{background:#fff3cd;color:#664d03;border-color:#ffc107} .cf-ttl-cbx{background:#e7f1ff;color:#0a3d8f;border-color:#9ec5fe} [data-bs-theme=dark] .cf-ttl-fide{background:#3d3214;color:#ffda6a;border-color:#b58100} [data-bs-theme=dark] .cf-ttl-cbx{background:#0d2a52;color:#9ec5fe;border-color:#2f5d9a} [data-bs-theme=dark] .cf-au-ph{box-shadow:0 0 0 1.5px #38a3ff} /* Caixas de marcar e botões de opção com borda visível em todas as telas (o cinza-claro padrão do Bootstrap some no fundo branco) */ .form-check-input { border-color: #7b879c; } .form-check-input:focus { border-color: #1e6fe0; } [data-bs-theme=dark] .form-check-input { border-color: #8597bd; } /* Mensagem depois de gravar (flash, cf_flash_html() no config.php): aviso flutuante com ícone e cor por tipo */ .cf-toast-wrap { position: fixed; top: 84px; left: 50%; transform: translateX(-50%); z-index: 2050; width: min(560px, calc(100vw - 32px)); pointer-events: none; } .cf-toast { pointer-events: auto; position: relative; display: flex; gap: 12px; align-items: flex-start; padding: 14px 44px 16px 16px; border-radius: 12px; color: #fff; box-shadow: 0 14px 34px rgba(11, 31, 75, .35), 0 0 0 1px rgba(255, 255, 255, .15) inset; overflow: hidden; animation: cfToastIn .35s cubic-bezier(.2, .9, .3, 1.25); } .cf-toast-success { background: #198754; } .cf-toast-warning { background: #ffc107; color: #2b2100; } .cf-toast-danger { background: #c62828; } .cf-toast-info { background: #1e6fe0; } .cf-toast-ic { font-size: 1.9rem; line-height: 1; flex: 0 0 auto; } .cf-toast-body { min-width: 0; } .cf-toast-body b { display: block; font-size: 1.08rem; margin-bottom: 2px; } .cf-toast-body div { overflow-wrap: anywhere; line-height: 1.4; } .cf-toast-x { position: absolute; top: 6px; right: 8px; background: none; border: 0; color: inherit; font-size: 1.7rem; line-height: 1; opacity: .85; cursor: pointer; padding: 2px 6px; border-radius: 6px; } .cf-toast-x:hover, .cf-toast-x:focus-visible { opacity: 1; background: rgba(255, 255, 255, .2); outline: none; } .cf-toast-warning .cf-toast-x:hover, .cf-toast-warning .cf-toast-x:focus-visible { background: rgba(0, 0, 0, .1); } .cf-toast-bar { position: absolute; right: 0; bottom: 0; /* presa à direita: a barra some da esquerda para a direita */ height: 4px; width: 100%; background: rgba(255, 255, 255, .65); } .cf-toast.out { animation: cfToastOut .25s forwards; } @keyframes cfToastIn { from { opacity: 0; transform: translateY(-18px) scale(.96); } } @keyframes cfToastOut { to { opacity: 0; transform: translateY(-12px); } } [data-bs-theme=dark] .cf-toast { box-shadow: 0 14px 34px rgba(0, 0, 0, .6), 0 0 0 1px rgba(255, 255, 255, .18) inset; } [data-bs-theme=dark] .cf-toast-success { background: #1f8a55; } [data-bs-theme=dark] .cf-toast-danger { background: #d13838; } [data-bs-theme=dark] .cf-toast-info { background: #2a7be8; } @media (max-width: 575px) { /* celular: embaixo, perto do polegar */ .cf-toast-wrap { top: auto; bottom: calc(62px + env(safe-area-inset-bottom, 0px)); } /* acima do botão 💡 dos colaboradores (canto, 42 px) */ .cf-toast { animation-name: cfToastUp; } @keyframes cfToastUp { from { opacity: 0; transform: translateY(18px) scale(.96); } } } @media (prefers-reduced-motion: reduce) { .cf-toast, .cf-toast.out { animation: none; } .cf-toast-bar { transition: none !important; } } @media print { .cf-toast-wrap { display: none !important; } } /* Ícone do WhatsApp (wa_ico() em config.php) nos botões e links que abrem o WhatsApp */ .cf-wa { width: 1.1em; height: 1.1em; vertical-align: -.17em; flex: none; } /* Item desativado (pessoas, catálogos, anúncios): linha listrada em âmbar ("fita de interditado"), nome riscado e selo 🚫 (off_badge() em config.php). Uso: , o nome em , e o botão de reativar em verde (btn-outline-success). */ .table > tbody > tr.cf-off > *, tr.cf-off > td { --bs-table-bg-type: transparent; --bs-table-bg-state: transparent; --bs-table-accent-bg: transparent; box-shadow: none !important; background: repeating-linear-gradient(135deg, #fff8e1 0 10px, #fdeeb8 10px 20px) !important; color: #6b4e00 !important; } tr.cf-off .text-muted, tr.cf-off small { color: #8a6a10 !important; } tr.cf-off .cf-off-name, .cf-off-name.on { text-decoration: line-through; text-decoration-thickness: 1.5px; } .cf-off-badge { display: inline-block; background: #e0a100; color: #3d2f00; border-radius: .375rem; padding: .25em .55em; font-size: .75em; font-weight: 700; line-height: 1; white-space: nowrap; } [data-bs-theme="dark"] .table > tbody > tr.cf-off > *, [data-bs-theme="dark"] tr.cf-off > td { background: repeating-linear-gradient(135deg, #3a2e06 0 10px, #4a3a09 10px 20px) !important; color: #ffd877 !important; } [data-bs-theme="dark"] tr.cf-off .text-muted, [data-bs-theme="dark"] tr.cf-off small { color: #e8c766 !important; } [data-bs-theme="dark"] .cf-off-badge { background: #e0a100; color: #2b2100; } @media print { .table > tbody > tr.cf-off > *, tr.cf-off > td { -webkit-print-color-adjust: exact; print-color-adjust: exact; } } /* Espaços de patrocínio do portal (config.php ads_strip_html / ads_tour_html / ads_corner_html; assets/ad_slots.js) */ .cf-ads-tag { font-size: .66rem; font-weight: 800; letter-spacing: .08em; text-transform: uppercase; color: #9a7b1c; } .cf-ads-strip { position: relative; height: 96px; margin: 12px 0 14px; border-radius: 14px; overflow: hidden; background: var(--bs-body-bg); border: 1px solid rgba(214,160,23,.45); } .cf-ads-strip > .cf-ads-tag { position: absolute; top: 6px; left: 12px; z-index: 2; } .cf-ads-sl { position: absolute; inset: 0; display: flex; align-items: center; gap: 16px; padding: 14px 18px 10px; opacity: 0; visibility: hidden; transition: opacity .6s, visibility .6s; background: linear-gradient(90deg, rgba(30,111,224,.08), transparent 70%); color: inherit; text-decoration: none; } .cf-ads-sl.on { opacity: 1; visibility: visible; } .cf-ads-sl .im, .cf-ads-cs .im { flex: none; display: flex; align-items: center; justify-content: center; } .cf-ads-sl .im img { max-height: 62px; max-width: 170px; object-fit: contain; border-radius: 6px; } .cf-ads-sl .im.w { flex: 1; height: 100%; } .cf-ads-sl .im.w img { max-height: 76px; max-width: 100%; } .cf-ads-sl .tx, .cf-ads-cs .tx { min-width: 0; line-height: 1.3; } .cf-ads-sl .tx b { display: block; font-size: 1rem; } .cf-ads-sl .tx small, .cf-ads-cs .tx small { display: block; color: var(--bs-secondary-color); font-size: .82rem; } .cf-ads-sl .go, .cf-ads-cs .go { margin-left: auto; flex: none; background: #1e6fe0; color: #fff; border-radius: 8px; padding: 6px 14px; font-weight: 600; font-size: .85rem; } .cf-ads-sl:hover .go, .cf-ads-cs:hover .go { background: #1659bd; } .cf-ads-dots { position: absolute; bottom: 6px; left: 50%; transform: translateX(-50%); display: flex; gap: 6px; z-index: 2; } .cf-ads-dots button { width: 8px; height: 8px; border-radius: 50%; border: 0; padding: 0; background: #c3cbd8; } .cf-ads-dots button.on { background: #1e6fe0; } .cf-ads-tour { display: flex; align-items: center; gap: 18px; flex-wrap: wrap; padding: 7px 14px; margin: 0 0 10px; border-top: 1px solid #f0e2b8; border-bottom: 1px solid #f0e2b8; background: #fffaf0; } .cf-ads-tour img { max-height: 40px; max-width: 130px; object-fit: contain; display: block; } .cf-ads-tour a:hover img { transform: translateY(-1px); } .cf-ads-corner { position: fixed; right: 18px; bottom: 18px; z-index: 1040; width: 290px; background: var(--bs-body-bg); color: var(--bs-body-color); border: 1px solid rgba(214,160,23,.55); border-radius: 12px; box-shadow: 0 10px 30px rgba(0,0,0,.22); padding: 10px 12px; opacity: 0; transform: translateY(14px); transition: opacity .25s, transform .25s; } .cf-ads-corner.in { opacity: 1; transform: none; } .cf-ads-corner .hd { display: flex; align-items: center; justify-content: space-between; margin-bottom: 4px; } .cf-ads-corner .x { width: 26px; height: 26px; border-radius: 50%; border: 1px solid var(--bs-border-color); background: var(--bs-body-bg); color: var(--bs-secondary-color); line-height: 1; padding: 0; } .cf-ads-cs { display: none; align-items: center; gap: 10px; color: inherit; text-decoration: none; } .cf-ads-cs.on { display: flex; } .cf-ads-cs .im img { max-height: 54px; max-width: 110px; object-fit: contain; border-radius: 6px; } .cf-ads-cs .tx b { font-size: .92rem; } .cf-ads-cs .go { padding: 4px 10px; font-size: .78rem; } .cf-ads-corner .nx { display: block; margin: 6px 0 0 auto; border: 0; background: none; color: var(--bs-secondary-color); font-size: .78rem; padding: 0; } @media (max-width: 576px) { .cf-ads-strip { height: 84px; } .cf-ads-sl { gap: 10px; padding: 14px 12px 12px; } .cf-ads-sl .im img { max-width: 90px; max-height: 48px; } .cf-ads-sl .tx b { font-size: .88rem; } .cf-ads-sl .tx small { display: none; } .cf-ads-sl .go { padding: 5px 9px; font-size: .78rem; } .cf-ads-corner { left: 0; right: 0; bottom: 0; width: auto; border-radius: 12px 12px 0 0; padding: 6px 10px; display: flex; align-items: center; gap: 8px; } .cf-ads-corner .hd { order: 3; margin: 0; } .cf-ads-corner .hd .cf-ads-tag { display: none; } .cf-ads-cs { flex: 1; min-width: 0; } .cf-ads-cs .im img { max-height: 34px; max-width: 80px; } .cf-ads-cs .tx small { display: none; } .cf-ads-cs .tx b { font-size: .82rem; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; display: block; } .cf-ads-corner .nx { display: none; } .cf-ads-corner.no-m { display: none !important; } } [data-bs-theme="dark"] .cf-ads-tag { color: #f5c542; } [data-bs-theme="dark"] .cf-ads-strip, [data-bs-theme="dark"] .cf-ads-corner { border-color: rgba(245,197,66,.35); } [data-bs-theme="dark"] .cf-ads-tour { background: rgba(245,197,66,.08); border-color: rgba(245,197,66,.25); } [data-bs-theme="dark"] .cf-ads-dots button { background: #4a5568; } [data-bs-theme="dark"] .cf-ads-dots button.on { background: #38a3ff; } @media print { .cf-ads-strip, .cf-ads-corner, .cf-ads-tour { display: none !important; } } /* ♟ Partidas (PGN): faixa do link público das planilhas da rodada */ [data-bs-theme="dark"] .pg-pub { background: #12294f; border-color: #2c5aa0; color: #dbe7ff; } /* ▦ Modo blocos (blocos.php): cor fixa por grupo (BLK_GROUPS em blocks_lib.php), texto branco; grade de 2 colunas no celular até 6 na TV */ .blk-g-mesas { --blk: #1f9d55; } .blk-g-rodada { --blk: #1e6fe0; } .blk-g-ocorr { --blk: #e8590c; } .blk-g-planilhas { --blk: #0c8599; } .blk-g-equipe { --blk: #0f766e; } .blk-g-docs { --blk: #7048e8; } .blk-g-prev { --blk: #d6336c; } .blk-g-config { --blk: #5c677d; } .blk-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); grid-auto-rows: 104px; grid-auto-flow: dense; gap: 12px; } @media (min-width: 576px) { .blk-grid { grid-template-columns: repeat(3, minmax(0, 1fr)); grid-auto-rows: 128px; } } @media (min-width: 900px) { .blk-grid { grid-template-columns: repeat(4, minmax(0, 1fr)); } } @media (min-width: 1200px) { .blk-grid { grid-template-columns: repeat(6, minmax(0, 1fr)); grid-auto-rows: 132px; } } .blk { position: relative; display: flex; flex-direction: column; justify-content: space-between; background: var(--blk); color: #fff; border-radius: 14px; padding: 12px 14px; text-decoration: none; overflow: hidden; box-shadow: 0 2px 6px rgba(11,31,75,.18); transition: transform .12s, box-shadow .12s; cursor: pointer; min-width: 0; border: 0; text-align: left; } .blk::after { content: ""; position: absolute; inset: 0; background: linear-gradient(135deg, rgba(255,255,255,.16), rgba(255,255,255,0) 60%); pointer-events: none; } .blk:hover, .blk:focus-visible { color: #fff; transform: translateY(-2px); box-shadow: 0 8px 18px rgba(11,31,75,.28); outline: none; } .blk:focus-visible { box-shadow: 0 0 0 3px #fff, 0 0 0 6px var(--blk); } .blk.s-w { grid-column: span 2; } .blk.s-b { grid-column: span 2; grid-row: span 2; } .blk .ic { font-size: 1.9rem; line-height: 1; } .blk.s-b .ic { font-size: 3rem; } .blk .nm { font-weight: 700; font-size: 1rem; line-height: 1.2; overflow-wrap: anywhere; } .blk.s-b .nm { font-size: 1.35rem; } .blk .sb { display: none; font-size: .78rem; opacity: .9; line-height: 1.25; margin-top: 2px; } .blk.s-w .sb, .blk.s-b .sb { display: block; } .blk .num { position: absolute; top: 10px; right: 12px; text-align: right; max-width: 60%; } .blk .num b { display: inline-block; background: rgba(255,255,255,.95); color: #0b1f4b; border-radius: 999px; padding: 2px 10px; font-size: .95rem; } .blk .num b.a { background: #ffd54f; color: #5c3b00; } .blk .num small { display: none; font-size: .74rem; margin-top: 3px; opacity: .95; } .blk.s-w .num small, .blk.s-b .num small { display: block; } .blk.s-b .num b { font-size: 1.5rem; padding: 4px 16px; } .blk .top { display: flex; flex-direction: column; gap: 5px; margin-top: 6px; position: relative; z-index: 1; } .blk .top a { color: #fff; background: rgba(255,255,255,.16); border-radius: 8px; padding: 4px 9px; text-decoration: none; font-size: .86rem; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; } .blk .top a:hover { background: rgba(255,255,255,.3); } /* ⭐ Mais usados: ícone na linha do título e os links em 2 colunas (2×1 e 2×2), para caber na altura do bloco */ .blk.blk-top { justify-content: flex-start; padding: 10px 12px; } .blk-top .hd { display: flex; align-items: baseline; gap: 6px; min-width: 0; white-space: nowrap; overflow: hidden; } .blk-top .hd .ic { font-size: 1.15rem; } .blk-top .hd .nm { font-size: .98rem; } .blk-top .hd .sb { margin: 0; overflow: hidden; text-overflow: ellipsis; } .blk-top .top { display: grid; grid-template-columns: minmax(0, 1fr); gap: 4px; margin-top: 6px; } .blk-top.s-w .top, .blk-top.s-b .top { grid-template-columns: repeat(2, minmax(0, 1fr)); } .blk-top .top a { padding: 3px 8px; font-size: .82rem; line-height: 1.35; } .blk-top .emp { font-size: .78rem; opacity: .9; white-space: normal; } .blk-leg { display: flex; flex-wrap: wrap; gap: 6px 14px; font-size: .8rem; color: #5c677d; margin-top: 16px; } .blk-leg span::before { content: ""; display: inline-block; width: 11px; height: 11px; border-radius: 3px; background: var(--blk); margin-right: 5px; vertical-align: -1px; } /* Personalizar: controles sobre cada bloco */ .blk-edit .blk { cursor: grab; animation: blk-wob .9s ease-in-out infinite alternate; } .blk-edit .blk.drag { opacity: .45; } @keyframes blk-wob { from { transform: rotate(-.4deg); } to { transform: rotate(.4deg); } } @media (prefers-reduced-motion: reduce) { .blk-edit .blk { animation: none; } } .blk .ed { display: none; position: absolute; left: 6px; right: 6px; top: 6px; gap: 4px; justify-content: space-between; z-index: 2; flex-wrap: wrap; } .blk-edit .blk .ed { display: flex; } .blk-edit .blk .sb, .blk-edit .blk .top, .blk-edit .blk .ic, .blk-edit .blk .num { display: none; } .blk-edit .blk { justify-content: flex-end; } .blk .ed button { border: 0; border-radius: 8px; background: rgba(255,255,255,.92); color: #0b1f4b; font-size: .8rem; font-weight: 600; padding: 3px 7px; min-width: 30px; min-height: 30px; } .blk .ed button.off { opacity: .55; text-decoration: line-through; } .blk .ed .rm { background: #ffe3e3; color: #a61e1e; } .blk-add { display: flex; flex-wrap: wrap; gap: 8px; } .blk-add button { border: 2px solid var(--blk); background: #fff; color: #212529; border-radius: 10px; padding: 6px 10px; font-size: .88rem; text-align: left; } .blk-add button:hover { background: var(--blk); color: #fff; } [data-bs-theme="dark"] .blk-g-mesas { --blk: #18794a; } [data-bs-theme="dark"] .blk-g-rodada { --blk: #1a5bb8; } [data-bs-theme="dark"] .blk-g-ocorr { --blk: #c24c0c; } [data-bs-theme="dark"] .blk-g-planilhas { --blk: #0b6c7c; } [data-bs-theme="dark"] .blk-g-equipe { --blk: #0d6159; } [data-bs-theme="dark"] .blk-g-docs { --blk: #5b3cc4; } [data-bs-theme="dark"] .blk-g-prev { --blk: #b02a5b; } [data-bs-theme="dark"] .blk-g-config { --blk: #4a5468; } [data-bs-theme="dark"] .blk { box-shadow: 0 2px 8px rgba(0,0,0,.45); } [data-bs-theme="dark"] .blk-leg { color: #a9b4c8; } [data-bs-theme="dark"] .blk-add button { background: #1b2436; color: #e6ecf5; } [data-bs-theme="dark"] .blk .ed .rm { background: #4a1f24; color: #ffc9c9; } /* 🎯 Modo salão (arbiter/salao.php): mesa com botões grandes; celular = uma mesa por tela (mapa por cima, botão ▦), a partir de 900 px = mapa à esquerda */ .sl-top { display: flex; flex-wrap: wrap; align-items: center; gap: 8px 14px; margin-bottom: 10px; font-size: .95rem; } .sl-faltam { background: #fff3bf; color: #5c3b00; border-radius: 999px; padding: 3px 12px; } .sl-ok { color: #2b8a3e; font-weight: 600; } .sl-clock span { border-radius: 999px; padding: 3px 12px; background: #e7f0ff; color: #0b1f4b; } .sl-clock .warn { background: #ffe8cc; color: #7a3a00; } .sl-clock .end { background: #ffe3e3; color: #a61e1e; } .sl-clock .wait { background: #f1f3f5; color: #5c677d; } .sl-sec { display: inline-flex; gap: 6px; align-items: center; margin: 0; cursor: pointer; } .sl { display: grid; grid-template-columns: minmax(0, 1fr); gap: 14px; align-items: start; } .sl-map { display: none; background: #fff; border: 1px solid #dee2e6; border-radius: 14px; padding: 12px; } body.sl-mapon .sl-map { display: block; position: fixed; inset: 0; z-index: 1050; border-radius: 0; overflow: auto; } .sl-maph { display: flex; justify-content: space-between; align-items: center; margin-bottom: 6px; } .sl-leg { display: flex; flex-wrap: wrap; gap: 4px 10px; font-size: .75rem; color: #5c677d; margin-bottom: 8px; } .sl-leg span::before { content: ""; display: inline-block; width: 11px; height: 11px; border-radius: 3px; margin-right: 4px; vertical-align: -1px; border: 1px solid #adb5bd; } .sl-leg .t-pend::before { background: #fff; } .sl-leg .t-done::before { background: #2f9e44; border-color: #2f9e44; } .sl-leg .t-abs::before { background: #e03131; border-color: #e03131; } .sl-leg .t-lock::before { background: #868e96; border-color: #868e96; } .sl-leg .t-bye::before { background: #e5dbff; border-color: #b197fc; } .sl-tiles { display: grid; grid-template-columns: repeat(auto-fill, minmax(56px, 1fr)); gap: 6px; } .sl-t { border: 1.5px solid #adb5bd; background: #fff; color: #212529; border-radius: 10px; min-height: 50px; font-weight: 700; font-size: 1rem; line-height: 1.1; padding: 4px 2px; } .sl-t small { display: block; font-size: .68rem; font-weight: 600; opacity: .9; } .sl-t.t-done { background: #2f9e44; border-color: #2f9e44; color: #fff; } .sl-t.t-abs { background: #e03131; border-color: #e03131; color: #fff; } .sl-t.t-lock { background: #868e96; border-color: #868e96; color: #fff; } .sl-t.t-bye { background: #f3f0ff; border-color: #b197fc; color: #5f3dc4; } .sl-t.cur { outline: 3px solid #1e6fe0; outline-offset: 2px; } .sl-board { background: #fff; border: 1px solid #dee2e6; border-radius: 16px; padding: 14px; box-shadow: 0 2px 8px rgba(11,31,75,.06); min-width: 0; } .sl-nav { display: flex; align-items: stretch; gap: 8px; margin-bottom: 10px; } .sl-arrow { width: 56px; flex: 0 0 56px; border: 1.5px solid #ced4da; background: #f8f9fa; border-radius: 12px; font-size: 2rem; line-height: 1; color: #0b1f4b; } .sl-arrow:disabled { opacity: .35; } .sl-no { flex: 1; min-width: 0; border: 1.5px solid #1e6fe0; background: #e7f0ff; color: #0b1f4b; border-radius: 12px; padding: 6px 8px; } .sl-no b { display: block; font-size: 1.6rem; line-height: 1.1; } .sl-no small { display: block; font-size: .75rem; color: #495057; } .sl-tm { text-align: center; font-weight: 600; color: #495057; margin: -4px 0 8px; font-size: .9rem; } .sl-pl { display: flex; align-items: center; gap: 10px; padding: 10px 4px; border-bottom: 1px solid #edf0f3; flex-wrap: wrap; } .sl-c { width: 26px; height: 26px; border-radius: 50%; flex: 0 0 26px; border: 2px solid #495057; } .sl-c.white { background: #fff; } .sl-c.black { background: #212529; } .sl-pn { flex: 1; min-width: 150px; } .sl-pn b { font-size: 1.15rem; overflow-wrap: anywhere; } .sl-pn small { display: block; color: #6c757d; font-size: .8rem; } .sl-team { display: block; font-size: .78rem; color: #1e6fe0; } .sl-ab { display: flex; gap: 6px; align-items: center; flex-wrap: wrap; margin-left: auto; font-size: .85rem; } .sl-abs { border: 1.5px solid #f08c00; background: #fff; color: #7a3a00; border-radius: 10px; padding: 6px 10px; font-weight: 600; min-height: 40px; } .sl-abs.on { border-color: #2f9e44; color: #2b8a3e; } .sl-absl { color: #c92a2a; font-weight: 600; } .sl-arr { color: #2b8a3e; } .sl-body { padding-top: 12px; } .sl-rs, .sl-wo { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 10px; } .sl-wo { margin-top: 10px; } .sl-r { border: 2px solid #ced4da; border-radius: 14px; min-height: 96px; background: #fff; color: #212529; padding: 6px 4px; } .sl-r b { display: block; font-size: 1.9rem; line-height: 1.1; white-space: nowrap; } .sl-r small { display: block; font-size: .78rem; color: #495057; } .sl-r.w { background: #fff; } .sl-r.d { background: #eef1f6; } .sl-r.k { background: #212529; color: #fff; border-color: #212529; } .sl-r.k small { color: #ced4da; } .sl-r.f { min-height: 62px; background: #fff8f0; border-color: #ffc078; } .sl-r.f b { font-size: 1.25rem; } .sl-r.sel { outline: 4px solid #1e6fe0; outline-offset: 2px; border-color: #1e6fe0; } .sl-r.sug { border-color: #e03131; box-shadow: 0 0 0 3px rgba(224,49,49,.25); } .sl-sug { background: #ffe3e3; color: #a61e1e; border-radius: 10px; padding: 6px 10px; margin-bottom: 10px; font-size: .88rem; } .sl-cf { position: sticky; bottom: 8px; z-index: 5; display: flex; flex-wrap: wrap; align-items: center; gap: 8px; margin-top: 12px; padding: 10px; border-radius: 14px; background: #ebfbee; border: 2px solid #2f9e44; box-shadow: 0 6px 18px rgba(0,0,0,.15); } .sl-cf span { flex: 1 1 100%; font-size: 1.05rem; } .sl-cf .btn { flex: 1; min-height: 54px; font-weight: 700; } @media (min-width: 576px) { .sl-cf span { flex: 1 1 auto; } .sl-cf .btn { flex: 0 0 auto; min-width: 140px; } } .sl-res { text-align: center; padding: 10px 0 12px; } .sl-res span { display: block; font-size: 2.6rem; font-weight: 800; color: #2b8a3e; } .sl-res small { color: #495057; } .sl-alt { width: 100%; min-height: 50px; font-weight: 600; } .sl-msg { padding: 16px; text-align: center; background: #f8f9fa; border-radius: 12px; color: #495057; } .sl-sh { display: flex; gap: 8px; margin-top: 14px; flex-wrap: wrap; } .sl-sh .btn { flex: 1; min-height: 48px; font-weight: 600; } .sl-pad { position: fixed; inset: 0; z-index: 1060; background: rgba(5,13,32,.55); display: flex; align-items: center; justify-content: center; padding: 16px; } .sl-pad[hidden] { display: none; } .sl-padc { background: #fff; border-radius: 16px; padding: 14px; width: 100%; max-width: 320px; } .sl-padv { font-size: 2rem; font-weight: 700; text-align: center; border: 1.5px solid #ced4da; border-radius: 10px; margin-bottom: 10px; min-height: 56px; } .sl-padk { display: grid; grid-template-columns: repeat(3, 1fr); gap: 8px; } .sl-padk button { min-height: 58px; font-size: 1.5rem; font-weight: 700; border: 1.5px solid #ced4da; border-radius: 12px; background: #f8f9fa; color: #212529; } .sl-padk .ok { background: #1e6fe0; border-color: #1e6fe0; color: #fff; } .sl-toast { position: fixed; left: 50%; bottom: 76px; transform: translate(-50%, 20px); opacity: 0; pointer-events: none; z-index: 1070; background: #0b1f4b; color: #fff; padding: 10px 18px; border-radius: 999px; font-weight: 600; transition: all .2s; max-width: calc(100% - 32px); text-align: center; } .sl-toast.on { opacity: 1; transform: translate(-50%, 0); } @media (max-width: 400px) { .sl-r { min-height: 84px; } .sl-r b { font-size: 1.55rem; } .sl-r small { font-size: .7rem; } .sl-arrow { width: 48px; flex-basis: 48px; } .sl-no b { font-size: 1.35rem; } } @media (min-width: 900px) { .sl { grid-template-columns: minmax(0, 2fr) minmax(0, 3fr); } .sl-map { display: block; position: sticky; top: 10px; max-height: calc(100vh - 30px); overflow: auto; } .sl-mapbtn, .sl-mapx { display: none; } body.sl-mapon .sl-map { position: sticky; inset: auto; border-radius: 14px; } } @media (min-width: 1200px) { .sl { grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); } .sl-tiles { grid-template-columns: repeat(auto-fill, minmax(62px, 1fr)); } } [data-bs-theme="dark"] .sl-faltam { background: #4a3a10; color: #ffe8a3; } [data-bs-theme="dark"] .sl-ok { color: #69db7c; } [data-bs-theme="dark"] .sl-clock span { background: #16294a; color: #cfe0ff; } [data-bs-theme="dark"] .sl-clock .warn { background: #4a2d10; color: #ffd8a8; } [data-bs-theme="dark"] .sl-clock .end { background: #4a1f24; color: #ffc9c9; } [data-bs-theme="dark"] .sl-clock .wait { background: #262c36; color: #adb5bd; } [data-bs-theme="dark"] .sl-map, [data-bs-theme="dark"] .sl-board, [data-bs-theme="dark"] .sl-padc { background: #1b2230; border-color: #343d4f; } [data-bs-theme="dark"] .sl-t { background: #232b3a; color: #e6ecf5; border-color: #4a5468; } [data-bs-theme="dark"] .sl-t.t-done { background: #2b8a3e; border-color: #2b8a3e; } [data-bs-theme="dark"] .sl-t.t-abs { background: #c92a2a; border-color: #c92a2a; } [data-bs-theme="dark"] .sl-t.t-bye { background: #2b2445; color: #d0bfff; } [data-bs-theme="dark"] .sl-t.cur { outline-color: #38a3ff; } [data-bs-theme="dark"] .sl-leg { color: #a9b4c8; } [data-bs-theme="dark"] .sl-arrow { background: #232b3a; border-color: #4a5468; color: #e6ecf5; } [data-bs-theme="dark"] .sl-no { background: #16294a; border-color: #38a3ff; color: #e6ecf5; } [data-bs-theme="dark"] .sl-no small, [data-bs-theme="dark"] .sl-tm, [data-bs-theme="dark"] .sl-pn small, [data-bs-theme="dark"] .sl-res small { color: #a9b4c8; } [data-bs-theme="dark"] .sl-pl { border-color: #2b3242; } [data-bs-theme="dark"] .sl-c { border-color: #adb5bd; } [data-bs-theme="dark"] .sl-c.black { background: #000; } [data-bs-theme="dark"] .sl-team { color: #74c0fc; } [data-bs-theme="dark"] .sl-abs { background: #2a2416; color: #ffd8a8; } [data-bs-theme="dark"] .sl-abs.on { color: #8ce99a; border-color: #2f9e44; } [data-bs-theme="dark"] .sl-absl { color: #ff8787; } [data-bs-theme="dark"] .sl-arr { color: #69db7c; } [data-bs-theme="dark"] .sl-r { background: #232b3a; color: #e6ecf5; border-color: #4a5468; } [data-bs-theme="dark"] .sl-r small { color: #a9b4c8; } [data-bs-theme="dark"] .sl-r.w { background: #f1f3f5; color: #212529; } [data-bs-theme="dark"] .sl-r.w small { color: #495057; } [data-bs-theme="dark"] .sl-r.d { background: #2c3445; } [data-bs-theme="dark"] .sl-r.k { background: #000; border-color: #6c757d; } [data-bs-theme="dark"] .sl-r.f { background: #2a2416; border-color: #8a5a1a; } [data-bs-theme="dark"] .sl-r.sel { outline-color: #38a3ff; border-color: #38a3ff; } [data-bs-theme="dark"] .sl-sug { background: #4a1f24; color: #ffc9c9; } [data-bs-theme="dark"] .sl-cf { background: #15301d; border-color: #2f9e44; } [data-bs-theme="dark"] .sl-res span { color: #69db7c; } [data-bs-theme="dark"] .sl-msg { background: #232b3a; color: #c5cfdd; } [data-bs-theme="dark"] .sl-padv, [data-bs-theme="dark"] .sl-padk button { background: #232b3a; border-color: #4a5468; color: #e6ecf5; } [data-bs-theme="dark"] .sl-padk .ok { background: #1e6fe0; color: #fff; } /* Mesas (tela de sempre): botão para o modo salão e volta da foto/ocorrência aberta a partir dele */ .sl-go { border: 1.5px solid #1e6fe0; color: #1e6fe0; background: #fff; border-radius: 999px; font-weight: 600; } .sl-go:hover { background: #1e6fe0; color: #fff; } .sl-back { position: fixed; left: 50%; bottom: 14px; transform: translateX(-50%); z-index: 1045; background: #1e6fe0; color: #fff; border-radius: 999px; padding: 10px 18px; font-weight: 700; text-decoration: none; box-shadow: 0 4px 14px rgba(0,0,0,.3); } .sl-back:hover { color: #fff; background: #0b1f4b; } .sl-shot { position: fixed; inset: 0; z-index: 1065; background: rgba(5,13,32,.55); display: flex; align-items: center; justify-content: center; padding: 16px; } .sl-shot > div { background: #fff; border-radius: 16px; padding: 18px; max-width: 360px; width: 100%; text-align: center; } [data-bs-theme="dark"] .sl-go { background: #16294a; color: #74c0fc; border-color: #38a3ff; } [data-bs-theme="dark"] .sl-go:hover { background: #38a3ff; color: #0b1f4b; } [data-bs-theme="dark"] .sl-shot > div { background: #1b2230; } @media print { .sl-back, .sl-go { display: none !important; } } /* ▦ Favoritar a tela (blk_fav_btn, ao lado do título): quatro bloquinhos, um de cada cor; vazios = fora dos blocos, preenchidos = nos blocos */ .cf-fav { display: inline-grid; grid-template-columns: 9px 9px; gap: 2px; padding: 5px; margin-left: 8px; border: 1px solid #ced4da; border-radius: 8px; background: #fff; vertical-align: middle; cursor: pointer; transition: transform .12s; line-height: 0; } .cf-fav:hover, .cf-fav:focus-visible { transform: scale(1.1); } .cf-fav span { width: 9px; height: 9px; border-radius: 2px; border: 1.5px solid; background: transparent; transition: background .15s; } .cf-fav span:nth-child(1) { border-color: #1f9d55; } .cf-fav span:nth-child(2) { border-color: #1e6fe0; } .cf-fav span:nth-child(3) { border-color: #e8590c; } .cf-fav span:nth-child(4) { border-color: #7048e8; } .cf-fav.on span:nth-child(1) { background: #1f9d55; } .cf-fav.on span:nth-child(2) { background: #1e6fe0; } .cf-fav.on span:nth-child(3) { background: #e8590c; } .cf-fav.on span:nth-child(4) { background: #7048e8; } .cf-fav-t { position: fixed; left: 50%; bottom: 72px; transform: translate(-50%, 16px); opacity: 0; pointer-events: none; z-index: 1075; background: #0b1f4b; color: #fff; border-radius: 999px; padding: 9px 18px; font-size: .92rem; box-shadow: 0 6px 18px rgba(0,0,0,.25); transition: all .2s; max-width: calc(100% - 24px); text-align: center; } .cf-fav-t.on { opacity: 1; transform: translate(-50%, 0); pointer-events: auto; } .cf-fav-t a { color: #9cc4ff; margin-left: 8px; white-space: nowrap; } .cf-fav-dlg { position: fixed; inset: 0; z-index: 1080; background: rgba(5,13,32,.55); display: flex; align-items: center; justify-content: center; padding: 16px; } .cf-fav-dlg > div { background: #fff; border-radius: 14px; padding: 16px; width: 100%; max-width: 380px; } [data-bs-theme="dark"] .cf-fav { background: #1b2230; border-color: #4a5468; } [data-bs-theme="dark"] .cf-fav span:nth-child(1) { border-color: #2fb36a; } [data-bs-theme="dark"] .cf-fav span:nth-child(2) { border-color: #4d8ff0; } [data-bs-theme="dark"] .cf-fav span:nth-child(3) { border-color: #f27a35; } [data-bs-theme="dark"] .cf-fav span:nth-child(4) { border-color: #9775fa; } [data-bs-theme="dark"] .cf-fav.on span:nth-child(1) { background: #2fb36a; } [data-bs-theme="dark"] .cf-fav.on span:nth-child(2) { background: #4d8ff0; } [data-bs-theme="dark"] .cf-fav.on span:nth-child(3) { background: #f27a35; } [data-bs-theme="dark"] .cf-fav.on span:nth-child(4) { background: #9775fa; } [data-bs-theme="dark"] .cf-fav-dlg > div { background: #1b2230; } @media print { .cf-fav, .cf-fav-t { display: none !important; } } /* 🦉 Modo aprendizado: coruja de óculos (blk_owl(), SVG); no modo escuro o corpo clareia e ganha contorno */ .blk-owl { width: 1.25em; height: 1.25em; vertical-align: -.25em; --owl-b: #0b1f4b; --owl-s: none; } .btn-primary .blk-owl { --owl-s: #ffffff; } .blk-owl.lg { width: 2em; height: 2em; vertical-align: -.6em; margin: -.35em .1em -.3em -.15em; } /* coruja grande no botão "Ligar o aprendizado" */ [data-bs-theme="dark"] .blk-owl { --owl-b: #24427f; --owl-s: #38a3ff; } /* Animação "Modo aprendizado ativado", no estilo do aviso de leitura do Chess-Results (busy.js): lendo… → ✓ ativado */ .blk-act { position: fixed; inset: 0; z-index: 2000; background: rgba(11,31,75,.45); display: flex; align-items: center; justify-content: center; padding: 16px; animation: blkActIn .2s ease-out; } .blk-act.out { opacity: 0; transition: opacity .25s; } @keyframes blkActIn { from { opacity: 0; } } .blk-act-c { background: #fff; color: #0b1f4b; border: 3px solid #1e6fe0; border-radius: 16px; box-shadow: 0 12px 40px rgba(0,0,0,.35); padding: 24px 28px; text-align: center; max-width: 460px; width: 100%; animation: blkActPop .3s cubic-bezier(.2,.9,.3,1.3); } @keyframes blkActPop { from { transform: scale(.85); opacity: 0; } } .blk-act-r { position: relative; width: 96px; height: 96px; margin: 0 auto 10px; } .blk-act-sp { position: absolute; inset: 0; border: .35rem solid #1e6fe0; border-right-color: transparent; border-radius: 50%; animation: cfBusySpin .75s linear infinite; } @keyframes cfBusySpin { to { transform: rotate(360deg); } } .blk-act-o { position: absolute; left: 18px; top: 16px; width: 60px; height: 60px; animation: blkOwlBob 1.2s ease-in-out infinite; } .blk-act-o .owl-eye { transform-box: fill-box; transform-origin: center; animation: blkOwlBlink 2.4s infinite; } @keyframes blkOwlBob { 50% { transform: translateY(-4px) rotate(-3deg); } } @keyframes blkOwlBlink { 0%, 44%, 52%, 100% { transform: scaleY(1); } 48% { transform: scaleY(.1); } } .blk-act-h { font-size: 1.35rem; font-weight: 700; } .blk-act-s { font-size: .95rem; color: #495057; margin-top: 6px; } .blk-act-bar { height: 6px; border-radius: 999px; background: #e7f0ff; overflow: hidden; margin: 10px auto 0; max-width: 260px; } .blk-act-bar span { display: block; height: 100%; width: 0; background: #1e6fe0; border-radius: 999px; animation: blkActBar 1.6s ease-in-out forwards; } @keyframes blkActBar { to { width: 100%; } } .blk-act.done .blk-act-c { border-color: #2f9e44; } .blk-act.done .blk-act-sp { border-color: #2f9e44; animation: none; } .blk-act.done .blk-act-h { color: #2b8a3e; } .blk-act.done .blk-act-bar span { background: #2f9e44; width: 100%; } .blk-act.done .blk-act-o { animation: blkOwlHop .5s ease-out 1; } @keyframes blkOwlHop { 40% { transform: translateY(-10px) scale(1.08); } } [data-bs-theme="dark"] .blk-act-c { background: #16213a; color: #cfe0ff; border-color: #38a3ff; } [data-bs-theme="dark"] .blk-act-sp { border-color: #38a3ff; border-right-color: transparent; } [data-bs-theme="dark"] .blk-act-s { color: #adb5bd; } [data-bs-theme="dark"] .blk-act-bar { background: #24324f; } [data-bs-theme="dark"] .blk-act-bar span { background: #38a3ff; } [data-bs-theme="dark"] .blk-act.done .blk-act-c { border-color: #40c057; } [data-bs-theme="dark"] .blk-act.done .blk-act-h { color: #69db7c; } [data-bs-theme="dark"] .blk-act.done .blk-act-sp { border-color: #40c057; } @media (prefers-reduced-motion: reduce) { .blk-act-sp, .blk-act-o, .blk-act-o .owl-eye, .blk-act-c { animation: none !important; } } @media print { .blk-act { display: none !important; } } /* "✓ Gravado!" no botão do resultado (assets/gravado.js: Mesas — janela e visão condensada — e Modo salão) */ .btn.gv, button.gv { position: relative; overflow: hidden; transition: background .2s, border-color .2s, color .2s; } .gv-saving { background: #e7f0ff !important; border-color: #1e6fe0 !important; color: #0b1f4b !important; } .gv-saving small { color: #0b1f4b !important; } .gv-sp { display: inline-block; width: 18px; height: 18px; border: 3px solid #1e6fe0; border-right-color: transparent; border-radius: 50%; vertical-align: -3px; animation: gvSpin .7s linear infinite; } @keyframes gvSpin { to { transform: rotate(360deg); } } .gv-ok { background: #2f9e44 !important; border-color: #2f9e44 !important; color: #fff !important; animation: gvPulse .6s ease-out; } .gv-ok small { color: #e6f4ea !important; } @keyframes gvPulse { 0% { box-shadow: 0 0 0 0 rgba(47,158,68,.6); } 100% { box-shadow: 0 0 0 16px rgba(47,158,68,0); } } .gv-bar { position: absolute; left: 0; bottom: 0; height: 4px; width: 100%; background: #fff; opacity: .85; transform-origin: left; animation: gvBar 1s linear forwards; } @keyframes gvBar { from { transform: scaleX(0); } to { transform: scaleX(1); } } .gv-warn { background: #f08c00 !important; border-color: #f08c00 !important; color: #fff !important; } .gv-err { background: #e03131 !important; border-color: #e03131 !important; color: #fff !important; } .gv-warn small, .gv-err small { color: #fff !important; opacity: .95; } button.gv-warn b, button.gv-err b { font-size: .92rem !important; line-height: 1.2; display: block; } button.gv-ok b { line-height: 1.15; } .gv-dim { opacity: .4; } .gv-msg { display: flex; flex-wrap: wrap; align-items: center; gap: 8px 12px; margin-top: 10px; padding: 10px 12px; border-radius: 10px; font-size: .9rem; text-align: left; } .gv-msg > div { flex: 1 1 220px; min-width: 0; overflow-wrap: anywhere; } .gv-msg.gv-warn { background: #fff4e0 !important; border: 1.5px solid #f08c00 !important; color: #7a3a00 !important; } .gv-msg.gv-err { background: #ffe3e3 !important; border: 1.5px solid #e03131 !important; color: #a61e1e !important; } .gv-msg .gv-okbtn { background: #0b1f4b; color: #fff; border: 0; min-height: 40px; padding: 6px 18px; font-weight: 600; } .gv-msg .gv-okbtn:hover { background: #1e6fe0; color: #fff; } [data-bs-theme="dark"] .gv-saving { background: #16294a !important; border-color: #38a3ff !important; color: #cfe0ff !important; } [data-bs-theme="dark"] .gv-saving small { color: #cfe0ff !important; } [data-bs-theme="dark"] .gv-sp { border-color: #38a3ff; border-right-color: transparent; } [data-bs-theme="dark"] .gv-ok { background: #2b8a3e !important; border-color: #2b8a3e !important; } [data-bs-theme="dark"] .gv-warn { background: #c26a00 !important; border-color: #c26a00 !important; } [data-bs-theme="dark"] .gv-err { background: #c92a2a !important; border-color: #c92a2a !important; } [data-bs-theme="dark"] .gv-msg.gv-warn { background: #3a2a10 !important; color: #ffd8a8 !important; border-color: #c26a00 !important; } [data-bs-theme="dark"] .gv-msg.gv-err { background: #4a1f24 !important; color: #ffc9c9 !important; border-color: #c92a2a !important; } [data-bs-theme="dark"] .gv-msg .gv-okbtn { background: #38a3ff; color: #0b1f4b; } @media (prefers-reduced-motion: reduce) { .gv-sp, .gv-ok, .gv-bar { animation: none !important; } .gv-bar { transform: scaleX(1); } } /* 🔊 Áudio DV da rodada (assets/pgn_tts_lote.js): carimbo "Gravado!" por cima da lista ao terminar o envio e faixa forte que fica na janela (verde: tudo gravado; âmbar: parte ficou de fora) */ .dv-stamp { position: absolute; inset: 0; z-index: 5; display: flex; align-items: center; justify-content: center; background: rgba(var(--bs-body-bg-rgb), .78); cursor: pointer; animation: dvFade .2s ease-out; } .dv-stamp > div { background: #2f9e44; color: #fff; border-radius: 16px; padding: 14px 30px; text-align: center; box-shadow: 0 8px 24px rgba(11,31,75,.25); animation: dvPop .35s ease-out; max-width: calc(100% - 24px); } .dv-stamp b { display: block; font-size: 1.6rem; line-height: 1.2; } .dv-stamp i { display: block; font-style: normal; font-size: 2.2rem; line-height: 1; } .dv-stamp small { display: block; color: #e6f4ea; font-size: .9rem; } .dv-stamp.warn > div { background: #e8590c; } .dv-stamp.warn small { color: #fff4e6; } @keyframes dvPop { 0% { transform: scale(.6); opacity: 0; } 70% { transform: scale(1.06); opacity: 1; } 100% { transform: scale(1); } } @keyframes dvFade { from { opacity: 0; } to { opacity: 1; } } .dv-band { display: flex; align-items: center; flex-wrap: wrap; gap: 4px 10px; background: #2f9e44; color: #fff; border-radius: 10px; padding: 8px 12px; font-size: .9rem; } .dv-band b.big { font-size: 1.15rem; } .dv-band .ic { font-size: 1.4rem; line-height: 1; } .dv-band a { color: #fff; font-weight: 600; margin-left: auto; } .dv-band a:hover { color: #e6f4ea; } .dv-band.warn { background: #e8590c; } [data-bs-theme="dark"] .dv-stamp > div, [data-bs-theme="dark"] .dv-band { background: #2b8a3e; } [data-bs-theme="dark"] .dv-stamp.warn > div, [data-bs-theme="dark"] .dv-band.warn { background: #c26a00; } @media (prefers-reduced-motion: reduce) { .dv-stamp, .dv-stamp > div { animation: none !important; } } /* Distribuição das mesas do PGN (organizer/pgn_split.php): 🖌 pincel por árbitro e mapa das mesas */ .ps-tools { position: sticky; top: 0; z-index: 20; background: var(--bs-body-bg); border: 1px solid var(--bs-border-color); border-radius: 12px; padding: 8px; margin-bottom: 8px; box-shadow: 0 4px 12px rgba(11, 31, 75, .08); } .ps-tool { border: 2px solid var(--c, var(--bs-border-color)); background: var(--bs-body-bg); color: var(--bs-body-color); border-radius: 20px; padding: 3px 10px; font-size: .88rem; white-space: nowrap; max-width: 100%; overflow: hidden; text-overflow: ellipsis; user-select: none; -webkit-user-select: none; } .ps-tool .dot { display: inline-block; width: 10px; height: 10px; border-radius: 50%; background: var(--c, #adb5bd); margin-right: 4px; } .ps-tool.on { background: var(--c, #495057); color: #fff; } .ps-tool.on .dot { background: #fff; } .ps-tool .cnt { font-size: .75rem; opacity: .85; } .ps-map { display: flex; flex-wrap: wrap; gap: 3px; user-select: none; -webkit-user-select: none; } .ps-map.paint .ps-b { touch-action: none; cursor: crosshair; } .ps-b { position: relative; width: 38px; height: 32px; border-radius: 5px; font-size: .75rem; font-weight: 700; display: flex; align-items: center; justify-content: center; color: #fff; } .ps-b.none { background: repeating-linear-gradient(45deg, #f8d7da, #f8d7da 4px, #fff 4px, #fff 8px); color: #842029; } .ps-b.dup { background: repeating-linear-gradient(45deg, #dc3545, #dc3545 4px, #fff 4px, #fff 8px); color: #842029; } .ps-b.fin::after { content: "✓"; position: absolute; top: -1px; right: 2px; font-size: .6rem; } .ps-b.rng { outline: 3px solid #ffc107; outline-offset: 1px; } @media (max-width: 575px) { .ps-tools { padding: 6px; } .ps-tool { font-size: .8rem; padding: 2px 8px; } } [data-bs-theme="dark"] .ps-b.none { background: repeating-linear-gradient(45deg, #4a1f24, #4a1f24 4px, #1b1f24 4px, #1b1f24 8px); color: #ffc9c9; } [data-bs-theme="dark"] .ps-b.dup { background: repeating-linear-gradient(45deg, #dc3545, #dc3545 4px, #1b1f24 4px, #1b1f24 8px); color: #fff; } /* Fase da versão (cf_stage_tag): etiqueta pequena e com contorno ao lado do número — alfa cinza, beta laranja, RC azul; a estável não tem */ .cf-stage { display: inline-block; font-size: .62em; font-weight: 700; letter-spacing: .06em; line-height: 1; padding: .2em .5em; border: 1px solid currentColor; border-radius: 999px; vertical-align: .2em; white-space: nowrap; cursor: help; } .cf-stage-alfa { color: #6c757d; } .cf-stage-beta, .cf-stage-beta_open { color: #d9480f; } .cf-stage-rc { color: #1971c2; } [data-bs-theme="dark"] .cf-stage-alfa { color: #adb5bd; } [data-bs-theme="dark"] .cf-stage-beta, [data-bs-theme="dark"] .cf-stage-beta_open { color: #ffa94d; } [data-bs-theme="dark"] .cf-stage-rc { color: #74c0fc; } .cf-about-ver .cf-stage { color: #ffa94d; } /* cabeçalho azul-escuro da janela "Sobre" */ /* % do andamento (Partidas PGN e 📊 Andamento): anel (padrão) ou pílula com a cor do avanço; seletor ◯ Anel | ▭ Pílula (localStorage cf_pct_vis) */ .cf-pct { display: inline-flex; align-items: center; gap: 3px; border-radius: 999px; padding: 1px 12px; font-weight: 700; font-size: 1rem; line-height: 1.5; margin-left: 6px; vertical-align: 1px; border: 1px solid; white-space: nowrap; } button.cf-pct { cursor: pointer; } .cf-pct.lo { background: var(--bs-danger-bg-subtle); color: var(--bs-danger-text-emphasis); border-color: var(--bs-danger-border-subtle); } .cf-pct.mid { background: var(--bs-warning-bg-subtle); color: var(--bs-warning-text-emphasis); border-color: var(--bs-warning-border-subtle); } .cf-pct.hi { background: var(--bs-success-bg-subtle); color: var(--bs-success-text-emphasis); border-color: var(--bs-success-border-subtle); } .cf-pct.done { background: var(--bs-success); color: #fff; border-color: var(--bs-success); } .cf-pct.sm { font-size: .8rem; padding: 0 8px; margin-left: 4px; } .cf-ring { background: none; border: 0; padding: 0; cursor: pointer; flex: 0 0 auto; line-height: 0; } .cf-ring .tr { stroke: var(--bs-tertiary-bg); } .cf-ring.lo .ar { stroke: var(--bs-danger); } .cf-ring.mid .ar { stroke: var(--bs-warning); } .cf-ring.hi .ar, .cf-ring.done .ar { stroke: var(--bs-success); } .cf-ring text { font-size: 13px; font-weight: 700; fill: var(--bs-body-color); } .cf-ring-w { display: flex; align-items: center; gap: 12px; } .cf-ring-w > div { flex: 1; min-width: 0; } .cf-pct-sw { display: inline-flex; border: 1px solid var(--bs-border-color); border-radius: 999px; overflow: hidden; margin-left: auto; font-weight: 400; vertical-align: middle; } .cf-pct-sw button { border: 0; background: var(--bs-body-bg); color: var(--bs-secondary-color); font-size: .75rem; line-height: 1.2; padding: 3px 10px; white-space: nowrap; } .cf-pct-sw button + button { border-left: 1px solid var(--bs-border-color); } .cf-pct-sw button.on { background: var(--bs-primary); color: #fff; } /* Cartões dos árbitros (📊 Andamento e 🏅 Desempenho do PGN): estilo da ficha da partida; a cor do fundo é a situação (lv-*), a do avatar é a do árbitro (--c). Usa as cores "subtle" do Bootstrap, que já trocam sozinhas no modo escuro. */ .cf-acards { display: grid; grid-template-columns: repeat(auto-fill, minmax(min(100%, 250px), 1fr)); gap: 10px; } .cf-acard { --lv-bg: var(--bs-tertiary-bg); --lv-bd: var(--bs-border-color); --lv-tx: var(--bs-body-color); --lv-e: var(--bs-secondary-color); background: var(--lv-bg); border: 1px solid var(--lv-bd); color: var(--lv-tx); border-radius: 12px; padding: 10px 14px; min-width: 0; transition: outline-color .2s; } .cf-acard.lv-done, .cf-acard.lv-hi { --lv-bg: var(--bs-success-bg-subtle); --lv-bd: var(--bs-success-border-subtle); --lv-tx: var(--bs-success-text-emphasis); --lv-e: var(--bs-success-text-emphasis); } .cf-acard.lv-mid { --lv-bg: var(--bs-warning-bg-subtle); --lv-bd: var(--bs-warning-border-subtle); --lv-tx: var(--bs-warning-text-emphasis); --lv-e: var(--bs-warning-text-emphasis); } .cf-acard.lv-lo { --lv-bg: var(--bs-danger-bg-subtle); --lv-bd: var(--bs-danger-border-subtle); --lv-tx: var(--bs-danger-text-emphasis); --lv-e: var(--bs-danger-text-emphasis); } .cf-acard.lv-help { --lv-bg: var(--bs-primary-bg-subtle); --lv-bd: var(--bs-primary-border-subtle); --lv-tx: var(--bs-primary-text-emphasis); --lv-e: var(--bs-primary-text-emphasis); } .cf-acard.lv-gold { --lv-bg: #fdf6dc; --lv-bd: #e9cf73; --lv-tx: #5c4708; --lv-e: #8a6a0c; } [data-bs-theme=dark] .cf-acard.lv-gold { --lv-bg: #33290b; --lv-bd: #7a6418; --lv-tx: #f3dc8e; --lv-e: #e9c75a; } .cf-acard.lv-pro { --lv-bg: #f3effc; --lv-bd: #cdbdf0; --lv-tx: #3b2a73; --lv-e: #4a3590; } [data-bs-theme=dark] .cf-acard.lv-pro { --lv-bg: #241c3d; --lv-bd: #5a479c; --lv-tx: #ddd2ff; --lv-e: #c4b3ff; } .cf-acard.drop { outline: 3px dashed var(--bs-primary); outline-offset: 2px; } .cf-acard-h { display: flex; gap: 10px; align-items: center; margin-bottom: 6px; min-width: 0; } .cf-aav { --c: var(--bs-secondary); width: 44px; height: 44px; border-radius: 50%; border: 2.5px solid var(--c); color: var(--c); background: var(--bs-body-bg); display: flex; align-items: center; justify-content: center; font-weight: 800; font-size: .95rem; flex: none; letter-spacing: .02em; } .cf-acard-n { font-weight: 700; font-size: 1.02rem; line-height: 1.2; overflow-wrap: anywhere; } .cf-acard-tg { display: inline-flex; align-items: center; gap: 4px; font-size: .72rem; font-weight: 700; border-radius: 999px; padding: 1px 9px; margin-top: 3px; background: var(--lv-e); color: var(--bs-body-bg); white-space: nowrap; max-width: 100%; overflow: hidden; text-overflow: ellipsis; } .cf-acard-tg.ol { background: var(--bs-body-bg); color: var(--lv-e); border: 1px solid var(--lv-bd); } .cf-acard-s { font-size: .78rem; opacity: .8; margin-top: 1px; overflow-wrap: anywhere; } .cf-acard-r { display: flex; justify-content: space-between; align-items: baseline; gap: 8px; font-size: .88rem; padding: 2px 0; } .cf-acard-r > span:first-child { opacity: .85; } .cf-acard-r > b { text-align: right; font-weight: 700; white-space: nowrap; } .cf-acard-r .cmp { font-size: .72rem; font-weight: 600; margin-left: 4px; } .cf-acard-r .cmp.up { color: var(--bs-success-text-emphasis); } .cf-acard-r .cmp.dn { color: var(--bs-danger-text-emphasis); } .cf-acard-bar { height: 7px; border-radius: 4px; background: color-mix(in srgb, var(--bs-body-bg) 70%, transparent); overflow: hidden; display: flex; margin: 4px 0 6px; } .cf-acard-bar i { display: block; height: 100%; transition: width .4s; } .cf-acard-f { display: flex; flex-wrap: wrap; gap: 4px; align-items: center; margin-top: 7px; } .cf-acard-chip { font-size: .74rem; font-weight: 600; border-radius: 999px; padding: 1px 8px; background: var(--bs-body-bg); color: var(--lv-e); border: 1px solid var(--lv-bd); white-space: nowrap; } .cf-acard-f .btn { --bs-btn-padding-y: .1rem; --bs-btn-padding-x: .5rem; --bs-btn-font-size: .78rem; } /* Abas de pasta no estilo das dos relatórios (.rep-tabs em _rlib.php): cinza-azulado, ativa azul-marinho, faixa marinho embaixo. Uso: