/* * Bordas finas de cards, filtros e buscas * * PADRÃO ATUAL: bordas desligadas. * * Para REATIVAR todas de uma vez, escolha uma opção: * * 1) Em templates/includes/theme_head.html, no script que seta data-theme, * adicione: document.documentElement.setAttribute('data-ui-borders', 'on'); * * 2) No do base.html: * * 3) No console do navegador: * document.documentElement.setAttribute('data-ui-borders', 'on') * * 4) Em frontend/theme.css, troque em :root: * --ui-surface-border-width: 1px; * --ui-surface-border-style: solid; * --ui-surface-border-color: var(--theme-border); */ /* ── Questões: filtro + card ── */ .q-toolbar { border-width: var(--ui-surface-border-width) !important; border-style: var(--ui-surface-border-style) !important; border-color: var(--ui-surface-border-color) !important; } .q-toolbar .form-select, .q-toolbar .form-control { border-width: var(--ui-surface-border-width) !important; border-style: var(--ui-surface-border-style) !important; border-color: var(--ui-surface-border-color) !important; } html[data-ui-borders="on"] .q-toolbar { border-color: rgba(255, 255, 255, 0.08) !important; } html[data-theme="light"][data-ui-borders="on"] .q-toolbar { border-color: rgba(89, 0, 255, 0.08) !important; } html[data-ui-borders="on"] .q-toolbar .form-select, html[data-ui-borders="on"] .q-toolbar .form-control { border-color: rgba(255, 255, 255, 0.12) !important; } html[data-theme="light"][data-ui-borders="on"] .q-toolbar .form-select, html[data-theme="light"][data-ui-borders="on"] .q-toolbar .form-control { border-color: #dee2e6 !important; } .q-card { border-width: var(--ui-surface-border-width) !important; border-style: var(--ui-surface-border-style) !important; border-color: var(--ui-surface-border-color) !important; } html[data-ui-borders="on"] .q-card { border-color: var(--q-card-border) !important; } /* ── Aulas: busca + cards de categoria ── */ .aulas-search-bar { border: var(--ui-surface-border-width) var(--ui-surface-border-style) var(--ui-surface-border-color) !important; } html:not([data-ui-borders="on"]) .aulas-search-bar { box-shadow: var(--ui-search-shadow) !important; } html[data-ui-borders="on"] .aulas-search-bar { box-shadow: 0 8px 32px rgba(89, 0, 255, 0.12) !important; } #aulasCategories .card { border: var(--ui-surface-border-width) var(--ui-surface-border-style) var(--ui-surface-border-color) !important; } .aulas-search-input, .aulas-search-input:focus, .aulas-search-input:focus-visible { border: none !important; outline: none !important; box-shadow: none !important; } /* ── Simulados ── */ .quiz-card { border-width: var(--ui-surface-border-width) !important; border-style: var(--ui-surface-border-style) !important; border-color: var(--ui-surface-border-color) !important; } html[data-ui-borders="on"] .quiz-card { border-color: var(--ql-border) !important; } html:not([data-ui-borders="on"]) .quiz-card:hover { border-color: transparent !important; } html[data-ui-borders="on"] .quiz-card:hover { border-color: rgba(89, 0, 255, 0.35) !important; } /* ── Plano de estudos ── */ .planner-card, html[data-theme="dark"] body.promocao .planner-card, html:not([data-theme="light"]) body.promocao .planner-card, html[data-theme="light"] .planner-card { border-width: var(--ui-surface-border-width) !important; border-style: var(--ui-surface-border-style) !important; border-color: var(--ui-surface-border-color) !important; } html[data-ui-borders="on"] .planner-card, html[data-ui-borders="on"][data-theme="dark"] body.promocao .planner-card, html[data-ui-borders="on"]:not([data-theme="light"]) body.promocao .planner-card { border-color: var(--theme-border) !important; } html[data-ui-borders="on"][data-theme="light"] .planner-card { border-color: #dee2e6 !important; } /* ── Simulado: realização (.quiz-take) ── */ .quiz-take__bar, .quiz-q, .quiz-take__foot { border-color: var(--ui-surface-border-color) !important; } .quiz-take__bar { border-bottom-width: var(--ui-surface-border-width) !important; border-bottom-style: var(--ui-surface-border-style) !important; } .quiz-q { border-bottom-width: var(--ui-surface-border-width) !important; border-bottom-style: var(--ui-surface-border-style) !important; } .quiz-take__foot { border-top-width: var(--ui-surface-border-width) !important; border-top-style: var(--ui-surface-border-style) !important; } .quiz-alt { border-width: var(--ui-surface-border-width) !important; border-style: var(--ui-surface-border-style) !important; border-color: var(--ui-surface-border-color) !important; } html[data-ui-borders="on"] .quiz-alt { border-color: var(--qt-border) !important; } html[data-ui-borders="on"] .quiz-alt:has(input:checked) { border-color: var(--qt-accent) !important; } .quiz-alt__letter { border-width: var(--ui-surface-border-width) !important; border-style: var(--ui-surface-border-style) !important; border-color: var(--ui-surface-border-color) !important; } html[data-ui-borders="on"] .quiz-alt__letter { border-color: var(--qt-border) !important; } /* ── Simulado: resultado (.quiz-result) ── */ .quiz-result__summary, .qr-q, .quiz-modal .modal-content { border-width: var(--ui-surface-border-width) !important; border-style: var(--ui-surface-border-style) !important; border-color: var(--ui-surface-border-color) !important; } html[data-ui-borders="on"] .quiz-result__summary, html[data-ui-borders="on"] .qr-q, html[data-ui-borders="on"] .quiz-modal .modal-content { border-color: var(--qr-border) !important; } html:not([data-ui-borders="on"]) .qr-q { border-left: none !important; } html[data-ui-borders="on"] .qr-q.is-correct { border-left: 4px solid var(--qr-ok) !important; } html[data-ui-borders="on"] .qr-q.is-wrong { border-left: 4px solid var(--qr-bad) !important; } .quiz-result__message { border-left-width: var(--ui-surface-border-width) !important; } .qr-q__resolution { border-top-width: var(--ui-surface-border-width) !important; border-top-style: var(--ui-surface-border-style) !important; border-top-color: var(--ui-surface-border-color) !important; } .quiz-modal .modal-header, .quiz-modal .modal-footer, .quiz-modal__list li { border-color: var(--ui-surface-border-color) !important; } /* ── Simulados: listagem (.quiz-list) ── */ .quiz-card__tag, .quiz-card__btn--ghost, .quiz-list__empty, .quiz-modal .modal-content { border-width: var(--ui-surface-border-width) !important; border-style: var(--ui-surface-border-style) !important; border-color: var(--ui-surface-border-color) !important; } html[data-ui-borders="on"] .quiz-card__tag, html[data-ui-borders="on"] .quiz-card__btn--ghost { border-color: var(--ql-border) !important; } html[data-ui-borders="on"] .quiz-list__empty { border-style: dashed !important; border-color: var(--ql-border) !important; } /* ── Dashboard ── */ .dash-hero, .dash-kpi, .dash-panel, .dash-insight { border-width: var(--ui-surface-border-width) !important; border-style: var(--ui-surface-border-style) !important; border-color: var(--ui-surface-border-color) !important; } html[data-ui-borders="on"] .dash-hero, html[data-ui-borders="on"] .dash-kpi, html[data-ui-borders="on"] .dash-panel, html[data-ui-borders="on"] .dash-insight { border-color: var(--dash-border) !important; } .dash-hero__avatar { border-width: var(--ui-surface-border-width) !important; border-style: var(--ui-surface-border-style) !important; border-color: var(--ui-surface-border-color) !important; } .dash-panel__head, .dash-list__item, .dash-panel__foot { border-color: var(--ui-surface-border-color) !important; } .dash-panel__head { border-bottom-width: var(--ui-surface-border-width) !important; border-bottom-style: var(--ui-surface-border-style) !important; } .dash-list__item { border-bottom-width: var(--ui-surface-border-width) !important; border-bottom-style: var(--ui-surface-border-style) !important; } .dash-panel__foot { border-top-width: var(--ui-surface-border-width) !important; border-top-style: var(--ui-surface-border-style) !important; } .dash-badge, .dash-spark__bar { border-width: var(--ui-surface-border-width) !important; border-style: var(--ui-surface-border-style) !important; border-color: var(--ui-surface-border-color) !important; } /* ── Gamificação (.lb-*) ── */ .lb-panel { border-left-width: var(--ui-surface-border-width) !important; border-left-style: var(--ui-surface-border-style) !important; border-left-color: var(--ui-surface-border-color) !important; } .lb-panel__header, .lb-panel__tips, .lb-profile-modal .modal-content { border-color: var(--ui-surface-border-color) !important; } .lb-panel__header { border-bottom-width: var(--ui-surface-border-width) !important; border-bottom-style: var(--ui-surface-border-style) !important; } .lb-panel__tips { border-top-width: var(--ui-surface-border-width) !important; border-top-style: var(--ui-surface-border-style) !important; } .lb-panel__you, .lb-rank-item.is-you { border-width: var(--ui-surface-border-width) !important; border-style: var(--ui-surface-border-style) !important; border-color: var(--ui-surface-border-color) !important; } html[data-ui-borders="on"] .lb-panel__you, html[data-ui-borders="on"] .lb-rank-item.is-you { border-color: rgba(89, 0, 255, 0.25) !important; } .lb-rank-avatar { border-width: var(--ui-surface-border-width) !important; border-style: var(--ui-surface-border-style) !important; border-color: var(--ui-surface-border-color) !important; } /* ── Rodapé ── */ .site-footer, .site-footer__links { border-color: var(--ui-surface-border-color) !important; } .site-footer { border-top-width: var(--ui-surface-border-width) !important; border-top-style: var(--ui-surface-border-style) !important; } .site-footer__links { border-top-width: var(--ui-surface-border-width) !important; border-top-style: var(--ui-surface-border-style) !important; } html[data-ui-borders="on"] .site-footer__social-btn { border-width: 1px !important; border-style: solid !important; } /* ── Questões: alternativas + rodapé do card ── */ .q-alt-card { border-width: var(--ui-surface-border-width) !important; border-style: var(--ui-surface-border-style) !important; border-color: var(--ui-surface-border-color) !important; } html[data-ui-borders="on"] .q-alt-card:not(.q-alt-correct):not(.q-alt-wrong) { border-color: var(--q-alt-border) !important; } html[data-ui-borders="on"] .q-alt-correct { border-color: var(--q-alt-correct-border) !important; } html[data-ui-borders="on"] .q-alt-wrong { border-color: var(--q-alt-wrong-border) !important; } .q-actions { border-top-width: var(--ui-surface-border-width) !important; border-top-style: var(--ui-surface-border-style) !important; border-top-color: var(--ui-surface-border-color) !important; } html[data-ui-borders="on"] .q-actions { border-top-color: var(--q-actions-border) !important; } /* ── Desafio (/desafio/) ── */ html body.desafio-body .card { border-width: var(--ui-surface-border-width) !important; border-style: var(--ui-surface-border-style) !important; border-color: var(--ui-surface-border-color) !important; } html[data-ui-borders="on"] body.desafio-body .card { border-color: var(--theme-border) !important; } /* ── Modais genéricos (tema escuro) ── */ html[data-theme="dark"] body.promocao .modal-content, html:not([data-theme="light"]) body.promocao .modal-content { border-width: var(--ui-surface-border-width) !important; border-style: var(--ui-surface-border-style) !important; border-color: var(--ui-surface-border-color) !important; } html[data-ui-borders="on"][data-theme="dark"] body.promocao .modal-content, html[data-ui-borders="on"]:not([data-theme="light"]) body.promocao .modal-content { border-color: var(--theme-border) !important; } /* ── Accordion pagamento ── */ html[data-theme="dark"] body.promocao .accordion-body, html:not([data-theme="light"]) body.promocao .accordion-body { border-top-width: var(--ui-surface-border-width) !important; border-top-style: var(--ui-surface-border-style) !important; border-top-color: var(--ui-surface-border-color) !important; } html[data-ui-borders="on"][data-theme="dark"] body.promocao .accordion-body, html[data-ui-borders="on"]:not([data-theme="light"]) body.promocao .accordion-body { border-top-color: var(--theme-border) !important; } /* ── Milton (chat) ── */ .msg-milton { border-width: var(--ui-surface-border-width) !important; border-style: var(--ui-surface-border-style) !important; border-color: var(--ui-surface-border-color) !important; } html[data-ui-borders="on"] .msg-milton { border-color: var(--theme-border, #e9ecef) !important; } /* ── Gamificação: outline no item do usuário ── */ html:not([data-ui-borders="on"]) .lb-rank-item.is-you { outline: none !important; } html[data-ui-borders="on"] .lb-rank-item.is-you { outline: 1px solid rgba(89, 0, 255, 0.2) !important; }