/* =========================================================
   Tema escuro do site público (ExpertemTI)
   Acionado por html.theme-dark (aplicado via site-theme.js).
   Cores da marca: --brand #149fd8, --accent #bfdc16, --ink #0a1430
   Não edita painel.css — apenas sobrescreve no modo escuro.
   ========================================================= */

html.theme-dark {
    --dk-bg:        #0a1430; /* fundo base (ink) */
    --dk-bg-2:      #0e1b3f; /* fundo elevado */
    --dk-surface:   #122249; /* cards/superfícies */
    --dk-surface-2: #16285a;
    --dk-border:    #25356a;
    --dk-text:      #e6ecf7;
    --dk-muted:     #9bb0d6;
    --dk-brand:     #149fd8;
    --dk-accent:    #bfdc16;
}

/* ---- Fundo geral ---- */
html.theme-dark,
html.theme-dark body.site {
    background-color: var(--dk-bg);
    color: var(--dk-text);
}

html.theme-dark body.site {
    color: var(--dk-text);
}

/* ---- Tipografia / utilitários do Bootstrap ---- */
html.theme-dark body.site .text-muted,
html.theme-dark body.site .text-white-50 {
    color: var(--dk-muted) !important;
}

html.theme-dark body.site h1,
html.theme-dark body.site h2,
html.theme-dark body.site h3,
html.theme-dark body.site h4,
html.theme-dark body.site h5,
html.theme-dark body.site h6,
html.theme-dark body.site p,
html.theme-dark body.site li,
html.theme-dark body.site span {
    color: inherit;
}

html.theme-dark body.site a:not(.btn) {
    color: #6ec4ec;
}

html.theme-dark body.site a:not(.btn):hover {
    color: var(--dk-accent);
}

/* ---- Navegação ---- */
html.theme-dark .site-nav {
    background-color: var(--dk-bg-2);
    border-bottom: 1px solid var(--dk-border);
}

html.theme-dark .site-nav .nav-link {
    color: var(--dk-muted);
}

html.theme-dark .site-nav .nav-link:hover,
html.theme-dark .site-nav .nav-link.active {
    color: #fff;
}

/* ---- Rodapé ---- */
html.theme-dark .site-footer {
    background-color: var(--dk-bg-2);
    border-top: 1px solid var(--dk-border);
    color: var(--dk-muted);
}

html.theme-dark .site-footer a {
    color: var(--dk-muted);
}

html.theme-dark .site-footer a:hover {
    color: var(--dk-accent);
}

/* ---- Cards ---- */
html.theme-dark .post-card,
html.theme-dark .featured-card,
html.theme-dark body.site .card {
    background-color: var(--dk-surface);
    border-color: var(--dk-border);
    color: var(--dk-text);
}

html.theme-dark .post-card:hover,
html.theme-dark .featured-card:hover {
    border-color: var(--dk-brand);
    box-shadow: 0 .75rem 2rem rgba(0, 0, 0, .45);
}

html.theme-dark .card-img-ph,
html.theme-dark .feat-ph {
    background-color: var(--dk-surface-2);
    color: var(--dk-muted);
}

html.theme-dark .card-meta,
html.theme-dark .card-meta .dot {
    color: var(--dk-muted);
}

/* ---- Corpo do artigo ---- */
html.theme-dark .article-body {
    color: var(--dk-text);
}

html.theme-dark .article-body h1,
html.theme-dark .article-body h2,
html.theme-dark .article-body h3,
html.theme-dark .article-body h4 {
    color: #fff;
}

html.theme-dark .article-body blockquote {
    background-color: var(--dk-surface);
    border-left-color: var(--dk-brand);
    color: var(--dk-muted);
}

html.theme-dark .article-body code,
html.theme-dark .article-body pre {
    background-color: #0b1733;
    border: 1px solid var(--dk-border);
    color: #e6ecf7;
}

html.theme-dark .article-body pre code {
    border: 0;
}

html.theme-dark .article-body a {
    color: #6ec4ec;
}

html.theme-dark .article-body hr {
    border-color: var(--dk-border);
}

html.theme-dark .article-body table th,
html.theme-dark .article-body table td {
    border-color: var(--dk-border);
}

/* ---- Formulários / busca ---- */
html.theme-dark body.site .form-control {
    background-color: var(--dk-surface);
    border-color: var(--dk-border);
    color: var(--dk-text);
}

html.theme-dark body.site .form-control::placeholder {
    color: var(--dk-muted);
}

html.theme-dark body.site .form-control:focus {
    background-color: var(--dk-surface-2);
    border-color: var(--dk-brand);
    color: var(--dk-text);
    box-shadow: 0 0 0 .2rem rgba(20, 159, 216, .25);
}

html.theme-dark body.site .btn-outline-secondary {
    color: var(--dk-muted);
    border-color: var(--dk-border);
}

html.theme-dark body.site .btn-outline-secondary:hover {
    color: var(--dk-ink, #0a1430);
    background-color: var(--dk-muted);
}

/* ---- Paginação ---- */
html.theme-dark body.site .page-link {
    background-color: var(--dk-surface);
    border-color: var(--dk-border);
    color: var(--dk-text);
}

html.theme-dark body.site .page-link:hover {
    background-color: var(--dk-surface-2);
    color: #fff;
}

html.theme-dark body.site .page-item.active .page-link {
    background-color: var(--dk-brand);
    border-color: var(--dk-brand);
    color: #fff;
}

html.theme-dark body.site .page-item.disabled .page-link {
    background-color: var(--dk-bg-2);
    color: var(--dk-muted);
}

/* =========================================================
   Botão de alternância de tema (criado por site-theme.js)
   ========================================================= */
.theme-toggle {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 38px;
    height: 38px;
    padding: 0;
    border: 1px solid rgba(255, 255, 255, .25);
    border-radius: 50%;
    background: transparent;
    color: inherit;
    cursor: pointer;
    font-size: 1.05rem;
    line-height: 1;
    transition: background-color .15s ease, border-color .15s ease, color .15s ease;
}

.theme-toggle:hover {
    border-color: var(--brand, #149fd8);
    color: var(--brand, #149fd8);
}

html.theme-dark .theme-toggle:hover {
    border-color: var(--dk-accent);
    color: var(--dk-accent);
}

/* Posicionamento de fallback quando injetado direto no body */
.theme-toggle--floating {
    position: fixed;
    right: 1rem;
    bottom: 1rem;
    z-index: 1050;
    width: 46px;
    height: 46px;
    font-size: 1.2rem;
    background: var(--dk-surface, #122249);
    color: #fff;
    box-shadow: 0 .5rem 1.5rem rgba(0, 0, 0, .35);
}

/* ---- Tags / chips (compartilhado com lista.php) ---- */
.tag-bar {
    display: flex;
    flex-wrap: wrap;
    gap: .5rem;
    justify-content: center;
}

.tag-chip {
    display: inline-flex;
    align-items: center;
    gap: .3rem;
    padding: .35rem .8rem;
    border-radius: 999px;
    border: 1px solid #d7dce6;
    background: #fff;
    color: #44506b;
    font-size: .85rem;
    font-weight: 600;
    text-decoration: none;
    line-height: 1;
    transition: all .15s ease;
}

.tag-chip:hover {
    border-color: var(--brand, #149fd8);
    color: var(--brand, #149fd8);
}

.tag-chip.active {
    background: var(--brand, #149fd8);
    border-color: var(--brand, #149fd8);
    color: #fff;
}

html.theme-dark .tag-chip {
    background: var(--dk-surface);
    border-color: var(--dk-border);
    color: var(--dk-muted);
}

html.theme-dark .tag-chip:hover {
    border-color: var(--dk-accent);
    color: var(--dk-accent);
}

html.theme-dark .tag-chip.active {
    background: var(--dk-brand);
    border-color: var(--dk-brand);
    color: #fff;
}
