/* ========================================================= */
/* == BOOKSENSE DESIGN SYSTEM & VARIÁVEIS VISUAIS        == */
/* ========================================================= */
:root {
    /* Tipografia Padronizada */
    --font-heading: 'Playfair Display', Georgia, 'Times New Roman', serif;
    --font-body: 'Plus Jakarta Sans', system-ui, -apple-system, sans-serif;

    /* Paleta Lilás / Roxo Literária Nobre */
    --color-purple-darkest: #1a0b2e; /* Fundo do rodapé e contrastes máximos */
    --color-purple-navbar: #24123a;  /* Barra de navegação escuro profundo elegante */
    --color-purple-primary: #581c87; /* Roxo Real Nobre */
    --color-purple-accent: #7c3aed;  /* Lilás / Violeta Vibrante para Destaques e Links */
    --color-lilac-vibrant: #8b5cf6;  /* Lilás Vibrante Médio */
    --color-lilac-light: #c084fc;    /* Lilás Claro (Navbar Active / Hover) */
    --color-lilac-soft: #f5f3ff;     /* Fundo Suave / Lavanda Claro */
    --color-lilac-border: #ede9fe;   /* Borda Lilás Sutil */
    
    /* Textos & Neutros */
    --color-text-main: #1f2937;
    --color-text-heading: #1e1b4b;
    --color-text-muted: #6b7280;
    --color-bg-page: #faf8fc;        /* Fundo da página levemente lavanda/off-white */
}

/* Estilo geral do corpo da página */
body {
    font-family: var(--font-body);
    background-color: var(--color-bg-page); 
    color: var(--color-text-main);
    -webkit-font-smoothing: antialiased;
}

/* Tipografia de Títulos e Destaques */
h1, h2, h3, h4, h5, h6, .section-heading, .portal-brand-title {
    font-family: var(--font-heading);
    color: var(--color-text-heading);
}

/* Ajuste nos links dos títulos dos artigos */
article h3 a {
    color: var(--color-text-heading);
    text-decoration: none;
    transition: color 0.2s ease;
}
article h3 a:hover {
    color: var(--color-purple-accent);
}

/* ================================================= */
/* == ESTILOS DO MENU DE LARGURA TOTAL == */
/* ================================================= */

/* A faixa do cabeçalho que ocupa 100% da largura */
.full-width-header {
    background-color: #ffffff;
    padding-top: 1rem;
}

/* A faixa da barra de navegação */
.main-menu-bar-wrapper {
    background-color: var(--color-purple-navbar);
    padding: 0.15rem 0;
    box-shadow: 0 4px 14px rgba(36, 18, 58, 0.18);
    border-bottom: 2px solid rgba(139, 92, 246, 0.3);
}

.main-menu-bar .nav-link {
    color: #e9d5ff;
    font-weight: 600;
    text-transform: uppercase;
    font-size: 0.82rem;
    letter-spacing: 0.6px;
    padding: 0.45rem 1.15rem;
    transition: all 0.2s ease-in-out;
}

/* O efeito ao passar o mouse sobre um link que NÃO está ativo */
.main-menu-bar .nav-link:not(.active):hover {
    color: var(--color-lilac-light);
}

/* O estilo para o link da página ATIVA (cor travada) */
.main-menu-bar .nav-link.active {
    color: #ffffff;
    font-weight: 700;
    background: rgba(139, 92, 246, 0.25);
    border-radius: 4px;
}


/* ================================================= */
/* == ESTILO FINAL PARA O CARD DE NOTÍCIA HORIZONTAL == */
/* ================================================= */

/* A imagem à esquerda */
.post-card-horizontal .card-img-left {
    width: 100%;
    height: 100%; /* Esta é a regra chave: força a imagem a ter a altura do seu container */
    object-fit: cover; /* Garante que a imagem preencha o espaço sem distorcer */
}

/* O corpo do card, onde fica o texto */
.post-card-horizontal .card-body {
    padding: 0.75rem 1rem; /* Padding geral (vertical | horizontal) */
}

/* O título da notícia */
.post-card-horizontal .card-title {
    font-size: 1.15rem; /* Fonte menor */
    margin-bottom: 0.2rem; /* Espaço menor abaixo */
}

/* Os parágrafos (autor e resumo) */
.post-card-horizontal .card-text {
    font-size: 0.85rem; /* Fonte menor */
    line-height: 1.4; /* Linhas mais próximas */
    margin-bottom: 0.4rem; /* Espaço menor abaixo */
}

/* Container para a imagem com efeito hover */
.post-image-container {
overflow: hidden; /* Garante que o zoom não vaze do container */
}

.post-image-container .card-img-left {
transition: transform 0.3s ease-in-out; /* Adiciona uma transição suave para o efeito */
}

.post-image-container:hover .card-img-left {
transform: scale(1.05); /* Aumenta a imagem em 10% ao passar o mouse */
}

/* Ajuste para o botão do menu mobile em fundo escuro */
.navbar-toggler-icon {
    background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 30 30'%3e%3cpath stroke='rgba%28255, 255, 255, 0.75%29' stroke-linecap='round' stroke-miterlimit='10' stroke-width='2' d='M4 7h22M4 15h22M4 23h22'/%3e%3c/svg%3e");
}

/* ================================================= */
/* == FAZ O MENU DROPDOWN ABRIR COM O MOUSE  == */
/* ================================================= */

/* Este truque só se aplica a telas grandes (desktops), onde o hover faz sentido */
@media (min-width: 992px) {

    /* Esconde o submenu por padrão */
    .dropdown .dropdown-menu {
        display: none;
        margin-top: 0; /* Remove a margem padrão do Bootstrap para um visual mais limpo */
    }

    /* A mágica: Mostra o submenu quando o mouse passa sobre o item pai */
    .dropdown:hover > .dropdown-menu {
        display: block;
    }

    /* Opcional: Garante que o link pai não mude de cor no hover quando o dropdown está aberto */
    .dropdown:hover > .nav-link {
        color: #f8f9fa;
    }
}

.main-menu-bar .dropdown-toggle::after {
    display: none;
}

/* ================================================= */
/* == GRADE DE NOTÍCIAS EM DESTAQUE (ESTILO G1) == */
/* ================================================= */

.featured-grid {
    display: grid;
    grid-template-columns: 1fr 1fr; /* Duas colunas de largura igual */
    grid-template-rows: 1fr 1fr;    /* <<< MUDANÇA 1: Duas linhas de altura igual */
    gap: 10px;
    margin-bottom: 2rem;
    height: 500px;                  /* <<< MUDANÇA 2: Altura total fixa da grade */
}

.featured-item {
    position: relative; /* Essencial para posicionar o texto sobre a imagem */
    overflow: hidden; /* Garante que o zoom do hover não vaze */
    border-radius: 0.25rem; /* Cantos arredondados */
    box-shadow: 0 4px 8px rgba(0,0,0,0.1);
}

/* O post grande ocupa toda a altura da grade */
.featured-item-large {
    grid-column: 1 / 2;
    grid-row: 1 / 3;
}

/* Os dois posts pequenos */
.featured-item-small-top {
    grid-column: 2 / 3;
    grid-row: 1 / 2;
}
.featured-item-small-bottom {
    grid-column: 2 / 3;
    grid-row: 2 / 3;
}

.featured-item img {
    width: 100%;
    height: 100%;
    object-fit: cover; /* A imagem cobre todo o espaço sem distorcer */
    transition: transform 0.4s ease;
}

/* Efeito de zoom na imagem ao passar o mouse */
.featured-item:hover img {
    transform: scale(1.05);
}

/* O degradê escuro que fica sobre a imagem */
.featured-item::after {
    content: '';
    position: absolute;
    bottom: 0;
    left: 0;
    width: 100%;
    height: 70%; /* Altura do degradê */
    background: linear-gradient(to top, rgba(0,0,0,0.85), transparent);
    z-index: 1;
}

/* O texto que fica sobre a imagem e o degradê */
.featured-item-content {
    position: absolute;
    bottom: 0;
    left: 0;
    padding: 1rem;
    z-index: 2; /* Garante que o texto fique acima do degradê */
}

.featured-item-content .featured-title {
    color: #fff;
    font-size: 1.5rem;
    font-weight: 700;
    text-decoration: none;
    text-shadow: 1px 1px 3px rgba(0,0,0,0.5);
}
.featured-item-small-top .featured-title,
.featured-item-small-bottom .featured-title {
    font-size: 1.1rem; /* Fonte um pouco menor para os destaques pequenos */
}

.featured-item-content .featured-category,
.badge-purple {
    color: #ffffff !important;
    background: linear-gradient(135deg, #8b5cf6 0%, #581c87 100%) !important;
    padding: 0.22rem 0.6rem;
    font-size: 0.72rem;
    font-weight: 700;
    border-radius: 4px;
    text-decoration: none;
    text-transform: uppercase;
    letter-spacing: 0.5px;
    box-shadow: 0 2px 6px rgba(88, 28, 135, 0.3);
    display: inline-block;
}

.badge-purple:hover {
    background: linear-gradient(135deg, #7c3aed 0%, #3b0764 100%) !important;
    color: #ffffff !important;
}

.text-purple {
    color: var(--color-purple-accent) !important;
}

.border-purple {
    border-color: var(--color-purple-accent) !important;
}

.btn-outline-purple {
    color: var(--color-purple-accent);
    border: 1px solid var(--color-purple-accent);
    background-color: transparent;
    border-radius: 4px;
    font-weight: 600;
    transition: all 0.2s ease;
}
.btn-outline-purple:hover {
    color: #ffffff;
    background-color: var(--color-purple-accent);
    border-color: var(--color-purple-accent);
}

.link-purple {
    color: var(--color-purple-accent);
    transition: color 0.2s ease;
}
.link-purple:hover {
    color: var(--color-purple-primary);
}

/* ============================================== */
/* == BARRA SUPERIOR (COM A DATA)            == */
/* ============================================== */

.top-bar {
    background-color: #f5edfc;
    padding: 0.3rem 0;
    font-size: 0.82rem;
    color: #581c87;
    border-bottom: 1px solid var(--color-lilac-border);
    font-weight: 500;
}

.text-lilac-subtle {
    color: #7e22ce;
}

/* ============================================== */
/* == CAIXA DE BUSCA E BRANDING DO CABEÇALHO  == */
/* ============================================== */

.portal-brand-title {
    font-family: var(--font-heading);
    font-weight: 700;
    font-size: 3.4rem;
    color: var(--color-purple-navbar);
    letter-spacing: -0.5px;
    margin-bottom: 0.2rem;
    transition: color 0.2s ease;
}

.portal-brand-title:hover {
    color: var(--color-purple-accent);
}

.portal-tagline {
    font-family: var(--font-body);
}

.search-box-wrapper {
    background-color: #ffffff;
    border: 1.5px solid var(--color-lilac-border);
    border-radius: 50px;
    overflow: hidden;
    transition: border-color 0.2s ease, box-shadow 0.2s ease;
}

.search-box-wrapper:focus-within {
    border-color: var(--color-purple-accent);
    box-shadow: 0 0 0 3px rgba(124, 58, 237, 0.15);
}

.search-input {
    font-size: 0.85rem;
    font-family: var(--font-body);
}

.search-input:focus {
    box-shadow: none;
    outline: none;
}

.btn-search-purple {
    background-color: var(--color-purple-accent);
    color: #ffffff;
    border: none;
    font-weight: 600;
    transition: background-color 0.2s ease;
}

.btn-search-purple:hover {
    background-color: var(--color-purple-primary);
    color: #ffffff;
}

/* ============================================== */
/* == ESTILO DO WIDGET FINANCEIRO            == */
/* ============================================== */
.finance-grid {
    display: grid;
    grid-template-columns: 1fr 1fr; /* Duas colunas */
    gap: 0.75rem; /* Espaço entre os blocos */
}
.finance-widget {
    background-color: #fff;
    padding: 0.75rem;
    border-radius: 0.375rem;
    border: 1px solid #dee2e6;
}
.finance-widget .name {
    font-size: 0.8rem;
    font-weight: 600;
    color: #6c757d;
    text-transform: uppercase;
}
.finance-widget .value {
    font-size: 1.2rem;
    font-weight: 700;
    color: #212529;
}
.finance-widget .variation {
    font-size: 0.85rem;
    font-weight: 600;
}
.variation-positive { color: #198754; /* Verde */ }
.variation-negative { color: #dc3545; /* Vermelho */ }

/* ================================================= */
/* == LAYOUT DA TABELA DO DASHBOARD              == */
/* ================================================= */

.table-fixed-layout {
    table-layout: fixed; /* Força a tabela a obedecer as larguras definidas */
    width: 100%;
}

/* Define a largura de cada coluna */
.table-fixed-layout th:nth-child(1) { width: 40%; } /* Coluna Título */
.table-fixed-layout th:nth-child(2) { width: 15%; } /* Coluna Site */
.table-fixed-layout th:nth-child(3) { width: 15%; } /* Coluna Autor */
.table-fixed-layout th:nth-child(4) { width: 12%; } /* Coluna Status */
.table-fixed-layout th:nth-child(5) { width: 18%; } /* Coluna Ações */

/* Controla o texto longo na coluna do título */
.table-fixed-layout td:nth-child(1) {
    white-space: nowrap; /* Impede que o texto quebre a linha */
    overflow: hidden; /* Esconde o que não couber */
    text-overflow: ellipsis; /* Adiciona os "..." no final */
}

/* Garante que os botões de ação não se quebrem em telas menores */
.table-fixed-layout .btn {
    white-space: nowrap;
}

/* ================================================= */
/* == BARRA DE NOTÍCIAS (NEWS TICKER) FINAL     == */
/* ================================================= */
.news-ticker-bar {
    background-color: #faf5ff;
    border-bottom: 1px solid var(--color-lilac-border);
    padding: 0.5rem 0;
    overflow: hidden;
}

.news-ticker-swiper .swiper-slide {
    width: auto;
    font-size: 0.88rem;
    font-weight: 500;
    white-space: nowrap; 
}

.news-ticker-swiper .swiper-slide a {
    text-decoration: none;
    color: #2e1065;
    transition: color 0.2s ease;
}

.news-ticker-swiper .swiper-slide a:hover {
    color: var(--color-purple-accent);
}

/* Estilo para a paginação */
.pagination .page-link {
    color: var(--color-purple-accent);
    border-color: var(--color-lilac-border);
    font-weight: 600;
}
.pagination .page-item.active .page-link {
    background-color: var(--color-purple-accent);
    border-color: var(--color-purple-accent);
    color: #ffffff;
}
.pagination .page-item.disabled .page-link {
    color: #9ca3af;
}
.pagination .page-link:hover {
    background-color: var(--color-lilac-soft);
    color: var(--color-purple-primary);
}

.list-group-item a:hover {
    color: var(--color-purple-accent) !important;
}

/* ======================================= */
/* == WIDGET DE POSTS NA SIDEBAR      == */
/* ======================================= */

.sidebar-post-image {
    width: 60px;  /* Largura da miniatura */
    height: 45px; /* Altura da miniatura */
    object-fit: cover; /* Corta a imagem para caber, sem distorcer */
    margin-right: 0 !important;
    flex-shrink: 0;
}

.sidebar-post-title {
    line-height: 1.2; /* Melhora a leitura de títulos com mais de uma linha */
    transition: color 0.2s ease;
}

/* Efeito de hover no link da lista */
.list-group-item a:hover .sidebar-post-title {
    color: var(--color-purple-accent) !important;
}

/* ============================================== */
/* == WIDGET DE PREVISÃO DO TEMPO (DESIGN NOVO) == */
/* ============================================== */
.weather-widget-new {
    color: #ffffff !important;
    text-shadow: 0 1px 2px rgba(0,0,0,0.35);
}

/* Estilo para o widget durante o DIA */
.weather-widget-new.day {
    background: linear-gradient(160deg, #2563eb 0%, #60a5fa 100%);
}

/* Estilo para o widget durante a NOITE */
.weather-widget-new.night {
    background: linear-gradient(160deg, #0b1a3e 0%, #1e3a8a 100%);
}

/* Título e localização com contraste máximo e tipografia legível */
.weather-widget-new h4,
.weather-widget-new h5,
.weather-widget-new .weather-widget-title {
    color: #ffffff !important;
    font-family: var(--font-body, 'Plus Jakarta Sans', system-ui, -apple-system, sans-serif) !important;
    font-size: 0.95rem;
    font-weight: 400;
    line-height: 1.3;
    margin-bottom: 0.85rem !important;
    letter-spacing: 0.2px;
}

.weather-widget-new h4 strong,
.weather-widget-new h5 strong,
.weather-widget-new .weather-city-name {
    color: #ffffff !important;
    font-weight: 700;
}

.weather-widget-new .bi-geo-alt-fill,
.weather-widget-new .weather-icon-pin {
    color: #67e8f9 !important;
    filter: drop-shadow(0 1px 2px rgba(0,0,0,0.3));
    font-size: 1.05rem;
    vertical-align: -1px;
}

.weather-widget-new .weather-geo-refresh-btn {
    color: rgba(255, 255, 255, 0.75) !important;
    background: transparent !important;
    border: none !important;
    padding: 2px 6px !important;
    border-radius: 4px;
    font-size: 0.9rem !important;
    transition: all 0.25s ease-in-out;
}

.weather-widget-new .weather-geo-refresh-btn:hover {
    color: #ffffff !important;
    background: rgba(255, 255, 255, 0.18) !important;
    transform: rotate(180deg);
}

.weather-widget-new .current-temp-value {
    font-size: 3rem;
    font-weight: 700;
    line-height: 1;
}

.weather-widget-new .current-temp-desc {
    font-size: 1rem;
    font-weight: 500;
    margin-top: -5px; /* Sobe um pouco a descrição */
}

.weather-widget-new .min-max-temp {
    font-size: 0.9rem;
    opacity: 0.9;
}

.weather-widget-new .weather-icon img {
    width: 80px; /* Aumenta o ícone principal */
    height: 80px;
    filter: drop-shadow(0 3px 3px rgba(0,0,0,0.2)); /* Sombra no ícone */
}

.mini-forecast-wrapper {
    border-top: 1px solid rgba(255,255,255,0.2);
}

.mini-forecast-item {
    text-align: center;
    font-size: 0.8rem;
    opacity: 0.9;
}

.mini-forecast-item .temp {
    font-weight: 600;
    font-size: 1rem;
    color: #fff;
}

.weather-widget-new .weather-icon .wi {
    font-size: 4rem; /* Tamanho do ícone principal */
    line-height: 1;
}
.mini-forecast-item .wi {
    font-size: 2rem; /* Tamanho dos ícones pequenos da previsão */
    display: block;
    margin: 5px 0;
}

.mini-forecast-wrapper {
    border-top: 1px solid rgba(255,255,255,0.2);
    display: flex; /* Mantém os itens em linha */
    /* overflow-x: auto; A MÁGICA: Adiciona a barra de rolagem horizontal se necessário */
    padding-top: 0.75rem;
    /* Adiciona um efeito de "fade out" no final para indicar que há mais itens */
    -webkit-mask-image: linear-gradient(to right, black 90%, transparent 100%);
    mask-image: linear-gradient(to right, black 90%, transparent 100%);
}

/* Garante que os itens não quebrem a linha */
.mini-forecast-item {
    flex-shrink: 0; /* Impede que os itens encolham */
    padding: 0 10px; /* Adiciona um espaçamento horizontal */
    text-align: center;
    font-size: 0.8rem;
    opacity: 0.9;
}

/* ================================================= */
/* == ESTILO DA MANCHETE (TÍTULO PRINCIPAL) == */
/* ================================================= */
.container > header h1 {
    font-family: var(--font-heading);
    font-weight: 700;
    font-size: 3.6rem;
    color: var(--color-purple-navbar);
    margin-bottom: 0; 
    letter-spacing: -0.5px;
}

.header-title-link,
.header-title-link:hover {
    text-decoration: none;
    color: inherit;
}

/* ================================================= */
/* == ESTILOS DO RODAPÉ PERSONALIZADO          == */
/* ================================================= */

.site-footer {
    background-color: var(--color-purple-darkest);
    color: #c4b5fd;
    padding: 3.5rem 0 2rem 0;
    margin-top: 3.5rem;
    border-top: 4px solid var(--color-purple-accent);
}

.footer-title {
    font-family: var(--font-heading);
    font-size: 2.2rem;
    font-weight: 700;
    color: #ffffff;
    text-decoration: none;
    transition: color 0.2s ease;
}
.footer-title:hover {
    color: var(--color-lilac-light);
}

/* Regra final para os links de texto */
.footer-links {
    color: #e9d5ff;
    text-decoration: none;
    transition: color 0.2s ease, opacity 0.2s;
}

.footer-links:hover {
    color: #ffffff;
    opacity: 0.9;
}

/* ======================================= */
/* == GRADE DE POSTS RELACIONADOS       == */
/* ======================================= */

/* Define o tamanho da fonte do título e remove margens extras */
.related-post-title {
    font-size: 0.9rem;
    font-weight: 600;
    line-height: 1.3;
    margin-bottom: 0.25rem;
}

/* Define a aparência do resumo/subtítulo */
.related-post-summary {
    font-size: 0.8rem;
    color: #6c757d;
}

/* Regra para a cor do link do título */
.related-post-title a {
    color: var(--color-text-heading);
    transition: color 0.2s ease-in-out;
}

/* A MÁGICA DO HOVER: Quando o mouse passa no card, o título fica lilás */
.related-post-card:hover .related-post-title a {
    color: var(--color-purple-accent) !important;
}

/* Adicione esta regra para controlar o espaçamento das colunas */
.related-post-col {
    padding-left: 8px; /* Espaçamento à esquerda */
    padding-right: 8px; /* Espaçamento à direita */
    margin-bottom: 16px; /* Espaçamento inferior (equivalente a mb-3) */
}

/* Ajuste para remover o padding das bordas da grade */
.related-posts-grid {
    margin-left: -8px;
    margin-right: -8px;
}

/* ======================================= */
/* == SEÇÃO DE COLUNISTAS             == */
/* ======================================= */
.columnists-section a {
    text-decoration: none;
    color: #212529;
    transition: opacity 0.2s ease-in-out;
}
.columnists-section a:hover {
    opacity: 0.8;
}
.columnist-photo {
    width: 100px;
    height: 100px;
    object-fit: cover;
    border: 3px solid #fff;
    box-shadow: 0 4px 10px rgba(0,0,0,0.1);
}
.columnist-name {
    font-weight: 600;
}

/* ========================================================= */
/* == VITRINE DE MINIATURAS DE LIVROS (LOGO ABAIXO DO MENU) == */
/* ========================================================= */

.books-showcase-container {
    background-color: #ffffff;
    border: 1px solid var(--color-lilac-border);
    border-radius: 8px;
    box-shadow: 0 4px 16px rgba(88, 28, 135, 0.05);
    transition: box-shadow 0.3s ease;
}

.books-shelf-swiper {
    overflow: hidden;
    padding: 6px 2px 4px 2px;
}

.books-shelf-swiper .swiper-slide {
    height: auto;
}

.books-shelf-nav .btn {
    transition: all 0.2s ease;
    background-color: #f3f4f6;
}

.books-shelf-nav .btn:hover {
    background-color: var(--color-purple-primary, #581c87) !important;
    color: #ffffff !important;
}

.book-mini-item {
    text-align: center;
    transition: transform 0.2s cubic-bezier(0.165, 0.84, 0.44, 1);
}

.book-mini-item:hover {
    transform: translateY(-4px);
}

.book-mini-cover-wrapper {
    position: relative;
    width: 85px;
    height: 128px;
    aspect-ratio: 2 / 3;
    margin: 0 auto;
    border-radius: 4px;
    overflow: hidden;
    background-color: #f1f3f5;
    box-shadow: 2px 3px 8px rgba(0, 0, 0, 0.16);
    transition: box-shadow 0.25s ease, transform 0.25s ease;
}

.book-mini-item:hover .book-mini-cover-wrapper {
    box-shadow: 0 6px 14px rgba(88, 28, 135, 0.28);
}

.book-mini-cover {
    width: 100%;
    height: 100%;
    aspect-ratio: 2 / 3;
    object-fit: cover;
    display: block;
}

/* Efeito de lombada realista do livro */
.book-spine-effect {
    position: absolute;
    top: 0;
    left: 0;
    width: 4px;
    height: 100%;
    background: linear-gradient(to right, rgba(0, 0, 0, 0.25), rgba(255, 255, 255, 0.2) 50%, rgba(0, 0, 0, 0.1) 100%);
    pointer-events: none;
}

.book-mini-title {
    font-size: 0.72rem;
    font-weight: 600;
    line-height: 1.25;
    color: #1a1a1a;
    max-width: 85px;
    margin: 0 auto;
    transition: color 0.2s ease;
}

.book-mini-item:hover .book-mini-title {
    color: var(--color-purple-accent);
}

.book-mini-author {
    font-size: 0.65rem;
    color: #6c757d;
    max-width: 85px;
    margin: 0 auto;
}

.hover-accent:hover {
    color: var(--color-purple-accent) !important;
}

/* Cartões horizontais e widgets */
.post-card-horizontal {
    background-color: #ffffff;
    border: 1px solid rgba(0,0,0,0.08);
    border-radius: 0.5rem;
    overflow: hidden;
    transition: transform 0.2s ease, box-shadow 0.2s ease;
}

.post-card-horizontal:hover {
    transform: translateY(-2px);
    box-shadow: 0 6px 16px rgba(0,0,0,0.08);
}

.text-truncate-2 {
    display: -webkit-box;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
    overflow: hidden;
}

/* ========================================================= */
/* == PÁGINA DO LIVRO REQUINTADA (EDITORIAL BOOK DETAIL)  == */
/* ========================================================= */

.book-detail-card {
    background-color: #ffffff;
    border: 1px solid rgba(88, 28, 135, 0.12);
    border-radius: 0.75rem;
    box-shadow: 0 4px 20px rgba(0, 0, 0, 0.04);
}

.book-cover-stage {
    display: flex;
    justify-content: center;
    align-items: flex-start;
}

.book-cover-elegant-frame {
    position: relative;
    width: 200px;
    height: 300px;
    max-width: 100%;
    aspect-ratio: 2 / 3;
    border-radius: 6px;
    overflow: hidden;
    background-color: #f3f4f6;
    box-shadow: 0 14px 28px rgba(36, 18, 58, 0.22), 0 6px 10px rgba(36, 18, 58, 0.12);
    transition: transform 0.3s ease, box-shadow 0.3s ease;
}

.book-cover-elegant-frame:hover {
    transform: translateY(-3px) scale(1.01);
    box-shadow: 0 18px 36px rgba(88, 28, 135, 0.28), 0 8px 14px rgba(36, 18, 58, 0.15);
}

.book-cover-elegant-img {
    width: 100%;
    height: 100%;
    aspect-ratio: 2 / 3;
    object-fit: cover;
    display: block;
}

.book-title-heading {
    font-family: var(--font-heading);
    font-size: 1.65rem;
    font-weight: 700;
    line-height: 1.25;
    color: var(--color-text-heading);
    letter-spacing: -0.2px;
}

.book-subtitle-text {
    font-size: 0.95rem;
    color: #64748b;
    font-style: italic;
    font-weight: 400;
}

.book-author-by {
    font-size: 0.9rem;
    color: #4b5563;
}

.book-author-by a {
    color: var(--color-purple-primary);
    font-weight: 600;
    text-decoration: none;
    transition: color 0.2s ease;
}

.book-author-by a:hover {
    color: var(--color-purple-accent);
}

/* Ficha Técnica em Pílulas / Tabela Editorial */
.book-spec-grid {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(130px, 1fr));
    gap: 0.6rem;
}

.book-spec-item {
    background-color: #faf8fc;
    border: 1px solid #ede9fe;
    border-radius: 0.5rem;
    padding: 0.45rem 0.65rem;
}

.book-spec-label {
    font-size: 0.68rem;
    text-transform: uppercase;
    letter-spacing: 0.5px;
    color: #8b5cf6;
    font-weight: 700;
    display: block;
    margin-bottom: 0.15rem;
}

.book-spec-value {
    font-size: 0.82rem;
    font-weight: 600;
    color: #1f2937;
    margin-bottom: 0;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

/* Sinopse da Obra */
.book-summary-body {
    font-size: 0.92rem;
    line-height: 1.75;
    color: #374151;
}

.book-summary-body p {
    margin-bottom: 1rem;
}

.book-section-divider {
    height: 1px;
    background: linear-gradient(to right, #ede9fe, transparent);
    border: none;
    margin: 1.5rem 0;
}

/* Card do Autor */
.book-author-card {
    background: linear-gradient(135deg, #faf8fc, #f5f3ff);
    border: 1px solid #ede9fe;
    border-radius: 0.65rem;
    padding: 1rem;
}

/* ========================================================= */
/* == BIBLIOTECA & ACERVO LITERÁRIO (PÁGINA LIVROS)       == */
/* ========================================================= */

.library-hero-banner {
    background: linear-gradient(135deg, #faf5ff 0%, #f3e8ff 50%, #ffffff 100%);
    position: relative;
    border: 1px solid #e9d5ff !important;
}

.library-hero-title {
    font-family: var(--font-heading);
    color: var(--color-text-heading);
    letter-spacing: -0.02em;
}

.hero-decor-circle {
    position: absolute;
    border-radius: 50%;
    filter: blur(50px);
    pointer-events: none;
    z-index: 1;
}

.hero-decor-1 {
    width: 280px;
    height: 280px;
    background: radial-gradient(circle, rgba(168, 85, 247, 0.18) 0%, rgba(139, 92, 246, 0) 70%);
    top: -60px;
    right: -40px;
}

.hero-decor-2 {
    width: 200px;
    height: 200px;
    background: radial-gradient(circle, rgba(192, 132, 252, 0.15) 0%, rgba(216, 180, 254, 0) 70%);
    bottom: -40px;
    left: 20%;
}

.stat-pill {
    transition: transform 0.2s ease, box-shadow 0.2s ease;
}

.stat-pill:hover {
    transform: translateY(-2px);
    box-shadow: 0 4px 12px rgba(124, 58, 237, 0.08);
}

.category-pills-bar {
    scrollbar-width: none;
    -ms-overflow-style: none;
}

.category-pills-bar::-webkit-scrollbar {
    display: none;
}

/* Cards de Livros na Biblioteca */
.library-book-card {
    transition: transform 0.22s ease-in-out;
}

.library-book-card:hover {
    transform: translateY(-4px);
}

.library-cover-box {
    position: relative;
    box-shadow: 0 4px 10px rgba(0, 0, 0, 0.08);
    transition: box-shadow 0.22s ease-in-out;
    background-color: #f3f4f6;
}

.library-book-card:hover .library-cover-box {
    box-shadow: 0 8px 20px rgba(36, 18, 58, 0.18);
}

.library-cover-img {
    aspect-ratio: 2/3;
    object-fit: cover;
    transition: transform 0.25s ease-in-out;
}

.library-book-card:hover .library-cover-img {
    transform: scale(1.02);
}

.library-spine-effect {
    position: absolute;
    top: 0;
    left: 0;
    width: 14px;
    height: 100%;
    background: linear-gradient(to right, rgba(0,0,0,0.22) 0%, rgba(255,255,255,0.18) 40%, rgba(0,0,0,0.05) 100%);
    pointer-events: none;
    z-index: 2;
}

.library-book-title {
    color: var(--color-text-heading);
    transition: color 0.2s ease;
}

.library-book-card:hover .library-book-title {
    color: var(--color-purple-accent);
}

.bg-purple-subtle {
    background-color: #f3e8ff !important;
}