/* =====================================
   RESET E ESTILOS BASE
   ===================================== */

* {
    margin: 0;
    padding: 0;
    box-sizing: border-box;
}

body {
    font-family: 'Inter', Arial, sans-serif;
    display: flex;
    flex-direction: column;
    margin: 0;
    height: 100vh;
    background-size: cover;
    background-repeat: no-repeat;
    background-attachment: fixed;
    background-position: center;
    background-color: var(--bg-primary);
    color: var(--text-primary);
    transition: background-color 0.5s ease, color 0.5s ease;
}

:root {
  --bg-primary: #ffffff;
  --bg-secondary: #f8f9fa;
  --bg-tertiary: #e9ecef;
  --text-primary: #222222;
  --text-secondary: #666666;
  --accent-primary: #1a4cff;
  --accent-secondary: #16a085;
  --card-bg: #ffffff;
  --header-bg: #ffffffcc;
  --sidebar-bg: rgba(255,255,255,0.95);
  --border-color: rgba(0,0,0,0.06);
  --shadow-light: rgba(0,0,0,0.08);
}

[data-theme="dark"] {
  --bg-primary: #0b132b;
  --bg-secondary: #0f1720;
  --bg-tertiary: #12171d;
  --text-primary: #e8eef8;
  --text-secondary: #9aa6bf;
  --accent-primary: #4dabf7;
  --accent-secondary: #2ecc71;
  --card-bg: rgba(18,22,27,0.95);
  --header-bg: rgba(10,14,20,0.85);
  --sidebar-bg: rgba(12,16,22,0.95);
  --border-color: rgba(255,255,255,0.04);
  --shadow-light: rgba(0,0,0,0.5);
}

.container, .container-cultura, .container-noticia-completo,
.categoria-container, .container-newadm, .container-sobre,
.privacidade-section, .eco-container, .cards-noticias, .card-noticia,
.project-card, .butterflies-card, .info-card, .tab, .tab_adm, .noticia-conteudo-principal {
  background-color: var(--card-bg) !important;
  color: var(--text-primary);
  border: 1px solid var(--border-color) !important;
  box-shadow: 0 8px 32px var(--shadow-light);
}

/* Links e destaques */
a { color: var(--accent-primary); }
a:hover { color: color-mix(in srgb, var(--accent-primary) 70%, black); }

.badge.historical, .badge.cultural, .badge.location,
.eco-badge, .noticia-categoria, .noticia-subcategoria,
.btn-login, .btn-register, .tablinks {
  color: white !important;
}

/* Quando em dark, garanta contraste nos ícones e textos pequenos */
[data-theme="dark"] .navbar-brand img { filter: none; }

/* Força o overlay do sidebar em mobile a escurecer mais em dark */
@media (max-width: 768px) {
  [data-theme="dark"] .sidebar-overlay {
    background: rgba(0,0,0,0.8);
  }
}

/* =====================================
   SIDEBAR (MENU LATERAL)
   ===================================== */

.topo {
    position: fixed;
    top: 0;
    left: 0;
    height: 100vh;
    width: 80px;
    background: #ffffff;
    backdrop-filter: blur(8px);
    border-right: 2px solid rgba(0,0,0,0.05);
    box-shadow: 0 2px 16px rgba(25, 125, 255, 0.1);
    transition: all 0.3s ease;
    display: flex;
    flex-direction: column;
    justify-content: space-between;
    z-index: 1000;
    overflow: hidden;
    transform: translateX(0);
    background: var(--sidebar-bg) !important;
    border-right: 1px solid var(--border-color) !important;
    box-shadow: 0 2px 16px var(--shadow-light) !important;
    color: var(--text-primary) !important;
}

.topo.expanded {
    width: 250px;
}

/* Logo */
.navbar-brand {
    display: flex;
    align-items: center;
    gap: 10px;
    padding: 18px 10px;
    flex-shrink: 0;
    border-bottom: 1px solid rgba(0,0,0,0.05);
    background: rgba(255,255,255,0.9);
    background: var(--header-bg) !important;
    border-bottom: 1px solid var(--border-color) !important;
    color: var(--text-primary) !important;
}

.navbar-brand img {
    width: 60px;
    height: 60px;
    object-fit: contain;
    transition: all 0.3s ease;
    filter: none;
}

.logo-text {
    font-size: 1.4rem;
    font-weight: 700;
    background: -webkit-linear-gradient(#3da2d8, #3771db);
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
    opacity: 0;
    white-space: nowrap;
    transition: opacity 0.3s ease;
    color: var(--text-primary) !important;
}

[data-theme="dark"] .logo-text {
    font-size: 1.4rem;
    font-weight: 700;
    background: -webkit-linear-gradient(#a3d8f4, #c2e59c);
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
    opacity: 0;
    white-space: nowrap;
    transition: opacity 0.3s ease;
    color: var(--text-primary) !important;
}

.topo.expanded .logo-text {
    opacity: 1;
}

/* Botão de Expansão */
.sidebar-toggle {
    position: fixed;
    top: 22px;
    left: 82px;
    z-index: 1001;
    background: #ffffff;
    border: 1px solid rgba(0,0,0,0.1);
    border-radius: 12px;
    padding: 10px 12px;
    cursor: pointer;
    font-size: 1.3rem;
    color: #1a1a1a;
    box-shadow: 0 4px 12px rgba(0,0,0,0.15);
    transition: all 0.3s ease;
    touch-action: manipulation;
    background: var(--sidebar-bg) !important;
    color: var(--text-primary) !important;
    border: 1px solid var(--border-color) !important;
    box-shadow: 0 4px 12px var(--shadow-light) !important;
}

.sidebar-toggle:hover {
    background: #f2f6ff;
    color: #0066ff;
    transform: scale(1.05);
    background: var(--bg-secondary) !important;
    color: var(--accent-primary) !important;
}

body.sidebar-expanded .sidebar-toggle {
    left: 252px;
}

/* Container principal com scroll */
.topo-content {
    display: flex;
    flex-direction: column;
    flex: 1;
    overflow: hidden;
}

/* Itens do Menu com scroll */
.navItems {
    list-style: none;
    padding: 0;
    margin: 0;
    display: flex;
    flex-direction: column;
    gap: 4px;
    overflow-y: auto;
    overflow-x: hidden;
    flex: 1;
    padding: 15px 0;
    scrollbar-width: thin;
    scrollbar-color: rgba(0,0,0,0.2) transparent;
    -webkit-overflow-scrolling: touch;
}

/* Custom scrollbar para navegadores WebKit - Modo Claro */
.navItems::-webkit-scrollbar {
    width: 4px;
}

.navItems::-webkit-scrollbar-track {
    background: transparent;
}

.navItems::-webkit-scrollbar-thumb {
    background: rgba(0,0,0,0.2);
    border-radius: 10px;
}

.navItems::-webkit-scrollbar-thumb:hover {
    background: rgba(0,0,0,0.3);
}

/* Custom scrollbar - Modo Escuro */
[data-theme="dark"] .navItems {
    scrollbar-color: rgba(255,255,255,0.2) transparent;
}

[data-theme="dark"] .navItems::-webkit-scrollbar-thumb {
    background: rgba(255,255,255,0.2);
}

[data-theme="dark"] .navItems::-webkit-scrollbar-thumb:hover {
    background: rgba(255,255,255,0.3);
}

/* Links do menu - Modo Claro */
.navItems li a {
    display: flex;
    align-items: center;
    gap: 14px;
    text-decoration: none;
    color: #222;
    font-weight: 600;
    font-size: 1rem;
    padding: 14px 18px;
    width: 100%;
    box-sizing: border-box;
    border-radius: 12px;
    transition: all 0.25s ease;
    white-space: nowrap;
    margin: 0 8px;
    border: 1px solid transparent;
    background: transparent;
}

.navItems li a:hover {
    background: #e8f0ff;
    color: #0055cc;
    transform: translateX(2px);
    border-color: #cce0ff;
}

.navItems li a:active {
    transform: scale(0.98);
}

/* Links do menu - Modo Escuro */
[data-theme="dark"] .navItems li a {
    color: #e2e8f0;
}

[data-theme="dark"] .navItems li a:hover {
    background: rgba(66, 153, 225, 0.15);
    color: #90cdf4;
    border-color: rgba(66, 153, 225, 0.3);
}

[data-theme="dark"] .navItems li a:active {
    background: rgba(66, 153, 225, 0.25);
}

/* Item ativo/selecionado */
.navItems li a.active {
    background: linear-gradient(135deg, #667eea 0%, #764ba2 100%);
    color: white;
    box-shadow: 0 4px 12px rgba(102, 126, 234, 0.3);
}

[data-theme="dark"] .navItems li a.active {
    background: linear-gradient(135deg, #5a67d8 0%, #6b46c1 100%);
    box-shadow: 0 4px 12px rgba(90, 103, 216, 0.4);
}

/* Ícones nos links */
.navItems li a i {
    transition: transform 0.25s ease;
    width: 20px;
    text-align: center;
}

.navItems li a:hover i {
    transform: scale(1.1);
}

[data-theme="dark"] .navItems li a i {
    color: #a0aec0;
}

[data-theme="dark"] .navItems li a:hover i {
    color: #90cdf4;
}

.navItems li a.active i {
    color: white;
}

/* Texto dos links */
.navItems li span {
    opacity: 0;
    transition: opacity 0.3s ease;
    white-space: nowrap;
}

.topo.expanded .navItems li span {
    opacity: 1;
}

/* Botões de Autenticação */
.auth-buttons {
    padding: 16px;
    display: flex;
    flex-direction: column;
    gap: 10px;
    flex-shrink: 0;
    background: var(--header-bg) !important;
    border-top: 1px solid var(--border-color) !important;
    backdrop-filter: blur(10px);
}

/* Botão de Tema */
#themeToggle.theme-toggle {
    order: -1;
    margin-bottom: 18px;
    margin-top: 0;
    display: flex;
    align-items: center;
    justify-content: flex-start;
    gap: 14px;
    text-decoration: none;
    font-weight: 700;
    padding: 14px 16px;
    width: 100%;
    border-radius: 12px;
    transition: all 0.25s ease;
    white-space: nowrap;
    color: var(--text-primary) !important;
    background: var(--bg-secondary) !important;
    border: 1px solid var(--border-color) !important;
    cursor: pointer;
}

#themeToggle.theme-toggle:hover {
    background: var(--accent-primary) !important;
    color: white !important;
    transform: translateY(-1px);
    box-shadow: 0 4px 12px var(--shadow-light);
}

/* Container do usuário logado */
.user-logged-container {
    display: flex;
    flex-direction: column;
    gap: 10px;
}

.user-profile-link {
    display: flex;
    align-items: center;
    gap: 14px;
    text-decoration: none;
    font-weight: 600;
    padding: 14px 8px;
    border-radius: 12px;
    transition: all 0.25s ease;
    white-space: nowrap;
    color: var(--text-primary) !important;
    background: var(--bg-secondary) !important;
    border: 1px solid var(--border-color) !important;
}

.user-profile-link:hover {
    background: var(--accent-primary) !important;
    color: white !important;
    transform: translateY(-1px);
}

.user-avatar {
    width: 32px;
    height: 32px;
    border-radius: 30%;
    object-fit: cover;
}

.user-name {
    opacity: 0;
    transition: opacity 0.3s ease;
    white-space: nowrap;
}

.topo.expanded .user-name {
    opacity: 1;
}

/* Botão Sair */
.btn-logout {
    display: flex;
    align-items: center;
    justify-content: flex-start;
    gap: 14px;
    text-decoration: none;
    font-weight: 700;
    padding: 14px 16px;
    width: 100%;
    border-radius: 12px;
    transition: all 0.25s ease;
    white-space: nowrap;
    color: #fff !important;
    background: #dc3545 !important;
    border: none !important;
}

.btn-logout:hover {
    background: #c82333 !important;
    transform: translateY(-1px);
    box-shadow: 0 4px 12px rgba(220, 53, 69, 0.3);
}

.btn-logout span {
    opacity: 0;
    transition: opacity 0.3s ease;
    white-space: nowrap;
}

.topo.expanded .btn-logout span {
    opacity: 1;
}

/* Botões Login/Cadastro */
.auth-buttons a:not(.user-profile-link) {
    display: flex;
    align-items: center;
    justify-content: flex-start;
    gap: 14px;
    text-decoration: none;
    font-weight: 700;
    padding: 14px 16px;
    width: 100%;
    border-radius: 12px;
    transition: all 0.25s ease;
    white-space: nowrap;
    color: #fff !important;
    background: var(--accent-primary) !important;
    border: none !important;
}

.btn-login {
    background: #1a4cff !important;
}

.btn-login:hover {
    background: #0f2f9a !important;
    transform: translateY(-1px);
    box-shadow: 0 4px 12px rgba(26, 76, 255, 0.3);
}

.btn-register {
    background: #00944a !important;
}

.btn-register:hover {
    background: #007a3b !important;
    transform: translateY(-1px);
    box-shadow: 0 4px 12px rgba(0, 148, 74, 0.3);
}

.auth-buttons a span {
    opacity: 0;
    transition: opacity 0.3s ease;
    white-space: nowrap;
}

.topo.expanded .auth-buttons a span {
    opacity: 1;
}

/* Barra de Pesquisa */
.search-container {
    padding: 0 16px 12px;
    border-bottom: 1px solid var(--border-color);
    margin-bottom: 8px;
}

.search-form {
    display: flex;
    align-items: center;
    background: var(--bg-secondary);
    border-radius: 12px;
    border: 1px solid var(--border-color);
    transition: all 0.25s ease;
    overflow: hidden;
}

.search-form:focus-within {
    border-color: var(--accent-primary);
    box-shadow: 0 0 0 2px rgba(26, 76, 255, 0.1);
}

.search-input {
    flex: 1;
    border: none;
    background: transparent;
    padding: 12px 16px;
    font-size: 0.95rem;
    color: var(--text-primary);
    outline: none;
}

.search-input::placeholder {
    color: var(--text-secondary);
}

.search-btn {
    display: flex;
    align-items: center;
    gap: 8px;
    background: var(--accent-primary);
    color: white;
    border: none;
    padding: 12px 16px;
    cursor: pointer;
    transition: all 0.25s ease;
    font-weight: 600;
    font-size: 0.9rem;
}

.search-btn:hover {
    background: #0f2f9a;
}

.search-btn span {
    opacity: 0;
    white-space: nowrap;
}

.topo.expanded .search-btn span {
    opacity: 1;
}

/* Indicador visual de scroll para telas menores */
.scroll-indicator {
    display: none;
    text-align: center;
    padding: 12px;
    color: #666;
    font-size: 0.8rem;
    background: linear-gradient(transparent, rgba(255,255,255,0.95));
    position: absolute;
    bottom: 120px;
    left: 0;
    right: 0;
    z-index: 1;
    backdrop-filter: blur(5px);
    background: linear-gradient(transparent, var(--sidebar-bg)) !important;
    color: var(--text-secondary) !important;
}

.topo.expanded .scroll-indicator {
    display: block;
}

/* =====================================
   RESPONSIVIDADE PARA MOBILE
   ===================================== */

/* Para telas menores que 768px (tablets e celulares) */
@media (max-width: 768px) {
    .topo {
        transform: translateX(-100%);
        width: 85vw;
        max-width: 320px;
        box-shadow: 0 0 40px rgba(0,0,0,0.4);
        background: #ffffff;
    }
    
    .topo.expanded {
        transform: translateX(0);
    }
    
    .sidebar-toggle {
        left: 20px;
        top: 20px;
        background: #1a4cff;
        color: white;
        border: none;
        box-shadow: 0 6px 20px rgba(26, 76, 255, 0.4);
        padding: 12px 14px;
        font-size: 1.4rem;
    }
    
    .sidebar-toggle:hover {
        background: #0f2f9a;
        color: white;
        transform: scale(1.1);
    }
    
    body.sidebar-expanded .sidebar-toggle {
        left: calc(85vw - 50px);
        background: #ffffff;
        color: #1a1a1a;
        box-shadow: 0 4px 12px rgba(0,0,0,0.15);
    }
    
    body.sidebar-expanded .sidebar-toggle:hover {
        background: #f2f6ff;
        color: #0066ff;
    }
    
    /* Overlay quando sidebar está aberta */
    .sidebar-overlay {
        display: none;
        position: fixed;
        top: 0;
        left: 0;
        width: 100%;
        height: 100%;
        background: rgba(0,0,0,0.6);
        z-index: 999;
        backdrop-filter: blur(4px);
        animation: fadeIn 0.3s ease;
    }
    
    .topo.expanded ~ .sidebar-overlay {
        display: block;
    }
    
    /* Melhorias para touch */
    .navItems li a {
        padding: 16px 20px;
        font-size: 1.1rem;
        margin: 0 12px;
        border-radius: 14px;
        min-height: 54px;
    }
    
    .navItems li i {
        font-size: 1.4rem;
        min-width: 28px;
    }
    
    .auth-buttons {
        padding: 20px;
        gap: 12px;
    }
    
    .auth-buttons a,
    #themeToggle.theme-toggle {
        padding: 16px 20px;
        font-size: 1.1rem;
        min-height: 54px;
        border-radius: 14px;
    }
    
    .navbar-brand {
        padding: 20px 15px;
        min-height: 80px;
    }
    
    .navbar-brand img {
        width: 50px;
        height: 50px;
    }
    
    .search-container {
        padding: 0 20px 16px;
    }
    
    .search-input {
        padding: 14px 18px;
        font-size: 1rem;
    }
    
    .search-btn {
        padding: 14px 18px;
    }
}

/* Para telas muito pequenas (celulares menores) */
@media (max-width: 480px) {
    .topo {
        width: 90vw;
        max-width: 300px;
    }
    
    body.sidebar-expanded .sidebar-toggle {
        left: calc(90vw - 50px);
    }
    
    .navItems li a {
        padding: 18px 20px;
        font-size: 1.05rem;
        margin: 0 10px;
    }
    
    .sidebar-toggle {
        padding: 14px 16px;
        font-size: 1.5rem;
    }
}

/* Para telas em landscape mobile */
@media (max-width: 768px) and (max-height: 500px) and (orientation: landscape) {
    .topo {
        width: 70vw;
        max-width: 280px;
    }
    
    .navbar-brand {
        padding: 12px 15px;
        min-height: 60px;
    }
    
    .navItems {
        padding: 8px 0;
        gap: 2px;
    }
    
    .navItems li a {
        padding: 12px 18px;
        min-height: 44px;
        font-size: 0.95rem;
    }
    
    .auth-buttons {
        padding: 12px;
        gap: 8px;
    }
    
    .auth-buttons a,
    #themeToggle.theme-toggle {
        padding: 12px 16px;
        min-height: 44px;
        font-size: 0.95rem;
    }
    
    .scroll-indicator {
        bottom: 100px;
        padding: 8px;
    }
}

/* Responsividade para altura reduzida */
@media (max-height: 600px) {
    .navbar-brand {
        padding: 15px 10px;
        min-height: 70px;
    }
    
    .navbar-brand img {
        width: 50px;
        height: 50px;
    }
    
    .navItems {
        padding: 10px 0;
        gap: 3px;
    }
    
    .navItems li a {
        padding: 12px 18px;
        font-size: 0.95rem;
        min-height: 48px;
    }
    
    .navItems li i {
        font-size: 1.2rem;
    }
    
    .auth-buttons {
        padding: 12px;
        gap: 8px;
    }
    
    .auth-buttons a,
    #themeToggle.theme-toggle {
        padding: 12px 16px;
        font-size: 0.95rem;
        min-height: 48px;
    }
}

/* Animações */
@keyframes fadeIn {
    from { opacity: 0; }
    to { opacity: 1; }
}

/* Prevenir zoom em inputs no iOS */
@media (max-width: 768px) {
    .navItems li a,
    .auth-buttons a,
    .search-input {
        font-size: 16px; /* Previne zoom no iOS */
    }
}

/* Melhorias de acessibilidade */
@media (prefers-reduced-motion: reduce) {
    .topo,
    .sidebar-toggle,
    .navItems li a,
    .auth-buttons a,
    #themeToggle.theme-toggle {
        transition: none;
    }
}

/* Suporte para dispositivos com notch */
@supports (padding: max(0px)) {
    @media (max-width: 768px) {
        .sidebar-toggle {
            top: max(20px, env(safe-area-inset-top));
            left: max(20px, env(safe-area-inset-left));
        }
    }
}

/* Estados de foco para acessibilidade */
.navItems li a:focus,
.auth-buttons a:focus,
#themeToggle.theme-toggle:focus,
.search-input:focus {
    outline: 2px solid #667eea;
    outline-offset: 2px;
}

[data-theme="dark"] .navItems li a:focus,
[data-theme="dark"] .auth-buttons a:focus,
[data-theme="dark"] #themeToggle.theme-toggle:focus,
[data-theme="dark"] .search-input:focus {
    outline-color: #81e6d9;
}

/* Loading state */
.navItems li a.loading {
    opacity: 0.7;
    pointer-events: none;
}

.navItems li a.loading::after {
    content: '';
    width: 16px;
    height: 16px;
    border: 2px solid transparent;
    border-top: 2px solid currentColor;
    border-radius: 50%;
    animation: spin 1s linear infinite;
    margin-left: auto;
}

@keyframes spin {
    0% { transform: rotate(0deg); }
    100% { transform: rotate(360deg); }
}


/* =====================================
   CONTEÚDO PRINCIPAL
   ===================================== */

main {
    margin-left: 80px;
    margin-right: 320px; /* Largura da .cards-noticias */
    padding: 40px;      /* Espaçamento interno para o container não colar nas bordas */
    transition: margin-left 0.3s ease, margin-right 0.3s ease;
}

@media (max-width: 768px){
    main {
        margin-right: 0px; 
        margin-left: 0px;
    }
}

.topo.expanded ~ main {
    margin-left: 250px;
}

.container {
    width: 95%;
    max-width: 1200px;
    padding: 40px 30px;
    background: rgba(255, 255, 255, 0.85);
    backdrop-filter: blur(10px);
    border-radius: 20px;
    box-shadow: 0 8px 32px rgba(25, 125, 255, 0.12);
    margin: 0 auto;
    text-align: center;
    border: 1px solid rgba(255, 255, 255, 0.2);
}

/* Espaço para o conteúdo do painel */
.admin, main.container, .container {
    padding-top: 100px;
}

/* Botão Voltar (Ajuste de posição) */
.btn-voltar {
    position: absolute;
    top: 30px;
    left: 30px;
    background: linear-gradient(135deg, #6c757d, #868e96);
    border: none;
    padding: 12px 20px;
    border-radius: 12px;
    box-shadow: 0 4px 12px rgba(0,0,0,0.15);
    transition: all 0.3s ease;
}

.btn-voltar a {
    color: white;
    text-decoration: none;
    font-weight: 600;
    display: flex;
    align-items: center;
    gap: 8px;
}

.btn-voltar:hover {
    transform: translateY(-2px);
    box-shadow: 0 6px 18px rgba(0,0,0,0.2);
    background: linear-gradient(135deg, #5a6268, #727b84);
}

@keyframes fadeInUp {
    from {
        opacity: 0;
        transform: translateY(30px);
    }
    to {
        opacity: 1;
        transform: translateY(0);
    }
}

/* =====================================
   TABS E MENU ADMIN
   ===================================== */

.tabs, .event-calendar-bar {
    display: flex;
    gap: 8px;
    margin-bottom: 16px;
    background: none;
    border: none;
}

/* ======== Estilo para abas de lendas (Melhorado) ======== */
.tabs-pag {
    display: flex;
    justify-content: center;
    gap: 15px;
    margin: 2rem 0;
    padding: 15px;
    background: linear-gradient(135deg, #f8f9ff, #e8f0ff);
    border-radius: 16px;
    box-shadow: inset 0 2px 8px rgba(0,0,0,0.06);
    flex-wrap: wrap;
}

.tablinks {
    background: linear-gradient(135deg, #1a4cff, #00b4d8);
    color: #fff;
    border: none;
    padding: 12px 24px;
    border-radius: 12px;
    cursor: pointer;
    font-weight: 600;
    transition: all 0.3s ease;
    flex: 1;
    max-width: 250px;
    text-align: center;
    box-shadow: 0 4px 12px rgba(26, 76, 255, 0.3);
}

.tablinks:hover,
.tablinks.active {
    background: linear-gradient(135deg, #00a8e8, #48cae4);
    transform: translateY(-3px);
    box-shadow: 0 6px 20px rgba(0, 150, 255, 0.4);
}

.tab {
    display: none;
    margin-top: 2rem;
    padding: 2.5rem;
    background: #ffffff;
    border-radius: 16px;
    box-shadow: 0 6px 24px rgba(0,0,0,0.1);
    animation: fadeInUp 0.5s ease;
    border: 1px solid rgba(0, 0, 0, 0.05);
}

.tab.active {
    display: block;
}

/* ======== Imagens das lendas ======== */
.lenda-img {
    width: 100%;
    max-width: 800px;
    border-radius: 20px;
    margin: 1.5rem auto;
    display: block;
    box-shadow: 0 8px 32px rgba(0,0,0,0.15);
    transition: transform 0.3s ease;
}

.lenda-img:hover {
    transform: scale(1.02);
}

/* ============================================
   ESTILOS PARA FORMULARIO DE LOGIN E CADASTRO
   ============================================ */

.xx-cadastro,
.xx-login {
    max-width: 400px;
    margin: 80px auto;
    padding: 36px 28px;
    background: var(--card-bg);
    border-radius: 18px;
    box-shadow: 0 0 32px var(--shadow-light);
    font-family: 'Segoe UI', Arial, sans-serif;
    width: 100%;
    animation: fadeIn 0.5s ease-out;
    display: flex;
    flex-direction: column;
    align-items: center;
}

.xx-cadastro,
.xx-login {
    margin-left: auto;
    margin-right: auto;
    display: flex;
    flex-direction: column;
    align-items: center;
}

.xx-cadastro h2,
.xx-login h2 {
    text-align: center;
    margin-bottom: 32px;
    color: var(--accent-primary);
    font-size: 1.7rem;
    font-weight: 800;
}

.xx-cadastro label,
.xx-login label {
    display: block;
    margin-bottom: 10px;
    color: var(--text-primary);
    font-weight: 600;
    font-size: 1rem;
    width: 100%;
    text-align: left;
}

.xx-cadastro input[type="text"],
.xx-cadastro input[type="email"],
.xx-cadastro input[type="password"],
.xx-login input[type="email"],
.xx-login input[type="password"] {
    width: 100%;
    padding: 14px 16px;
    margin-bottom: 20px;
    border: 2px solid var(--border-color);
    border-radius: 8px;
    font-size: 1rem;
    transition: all 0.3s ease;
    box-sizing: border-box;
    background-color: var(--bg-secondary);
    color: var(--text-primary);
}

.xx-cadastro input:focus,
.xx-login input:focus {
    border-color: var(--accent-primary);
    background-color: var(--bg-primary);
    outline: none;
    box-shadow: 0 0 0 3px color-mix(in srgb, var(--accent-primary) 18%, transparent);
    color: var(--text-primary);
}

.xx-cadastro input[type="submit"],
.xx-login input[type="submit"] {
    width: 100%;
    padding: 14px;
    background: linear-gradient(135deg, var(--accent-primary) 0%, var(--accent-secondary) 100%);
    color: #fff;
    border: none;
    border-radius: 8px;
    font-size: 1.08rem;
    font-weight: 700;
    cursor: pointer;
    transition: all 0.3s ease;
    margin-top: 10px;
    box-shadow: 0 6px 18px var(--shadow-light);
}

.xx-cadastro input[type="submit"]:hover,
.xx-login input[type="submit"]:hover {
    transform: translateY(-2px) scale(1.02);
    box-shadow: 0 10px 28px var(--shadow-light);
    filter: brightness(1.08);
}

.xx-cadastro-link,
.xx-login-link {
    text-align: center;
    margin-top: 22px;
    color: var(--text-secondary);
    font-size: 1rem;
}

.xx-cadastro-link a,
.xx-login-link a {
    color: var(--accent-primary);
    text-decoration: none;
    font-weight: 600;
    font-size: 1rem;
    transition: color 0.2s;
}

.xx-cadastro-link a:hover,
.xx-login-link a:hover {
    text-decoration: underline;
    color: var(--accent-secondary);
}

@media (max-width: 700px) {
    .xx-cadastro,
    .xx-login {
        max-width: 98vw;
        margin: 30px 2vw;
        padding: 20px 6vw;
        border-radius: 12px;
    }
    .xx-cadastro h2,
    .xx-login h2 {
        font-size: 1.2rem;
    }
    .xx-cadastro input[type="text"],
    .xx-cadastro input[type="email"],
    .xx-cadastro input[type="password"],
    .xx-login input[type="email"],
    .xx-login input[type="password"] {
        padding: 10px 8px;
        font-size: 0.98rem;
    }
    .xx-cadastro input[type="submit"],
    .xx-login input[type="submit"] {
        padding: 10px;
        font-size: 0.98rem;
    }
}

@media (max-width: 480px) {
    .xx-cadastro,
    .xx-login {
        margin: 10px 2vw;
        padding: 10px 2vw;
        border-radius: 10px;
    }
    .xx-cadastro h2,
    .xx-login h2 {
        font-size: 1rem;
        margin-bottom: 18px;
    }
    .xx-cadastro input[type="text"],
    .xx-cadastro input[type="email"],
    .xx-cadastro input[type="password"],
    .xx-login input[type="email"],
    .xx-login input[type="password"] {
        padding: 8px 6px;
        font-size: 0.95rem;
        margin-bottom: 12px;
    }
    .xx-cadastro input[type="submit"],
    .xx-login input[type="submit"] {
        padding: 8px;
        font-size: 0.95rem;
    }
    .xx-cadastro-link,
    .xx-login-link {
        font-size: 0.95rem;
        margin-top: 10px;
    }
}

/* Dark mode support */
[data-theme="dark"] .xx-cadastro,
[data-theme="dark"] .xx-login {
    background: var(--card-bg) !important;
    box-shadow: 0 0 32px var(--shadow-light);
}

[data-theme="dark"] .xx-cadastro h2,
[data-theme="dark"] .xx-login h2 {
    color: var(--accent-primary) !important;
}

[data-theme="dark"] .xx-cadastro label,
[data-theme="dark"] .xx-login label {
    color: var(--text-primary) !important;
}

[data-theme="dark"] .xx-cadastro input[type="text"],
[data-theme="dark"] .xx-cadastro input[type="email"],
[data-theme="dark"] .xx-cadastro input[type="password"],
[data-theme="dark"] .xx-login input[type="email"],
[data-theme="dark"] .xx-login input[type="password"] {
    background-color: var(--bg-secondary) !important;
    border-color: var(--border-color) !important;
    color: var(--text-primary) !important;
}

[data-theme="dark"] .xx-cadastro input:focus,
[data-theme="dark"] .xx-login input:focus {
    background-color: var(--bg-primary) !important;
    border-color: var(--accent-primary) !important;
    color: var(--text-primary) !important;
}

[data-theme="dark"] .xx-cadastro-link,
[data-theme="dark"] .xx-login-link {
    color: var(--text-secondary) !important;
}

[data-theme="dark"] .xx-cadastro-link a,
[data-theme="dark"] .xx-login-link a {
    color: var(--accent-primary) !important;
}

[data-theme="dark"] .xx-cadastro-link a:hover,
[data-theme="dark"] .xx-login-link a:hover {
    color: var(--accent-secondary) !important;
}

/* =====================================
   ESTILOS PARA PÁGINAS DE LOCAIS INTERNOS
   ===================================== */

/* Botão voltar */
.btn-voltar {
    position: absolute;
    top: 30px;
    left: 30px;
    background: linear-gradient(135deg, #6c757d, #868e96);
    border: none;
    padding: 12px 20px;
    border-radius: 12px;
    box-shadow: 0 4px 12px rgba(0,0,0,0.15);
    transition: all 0.3s ease;
    z-index: 10;
}

.btn-voltar a {
    color: white;
    text-decoration: none;
    font-weight: 600;
    display: flex;
    align-items: center;
    gap: 8px;
}

.btn-voltar:hover {
    transform: translateY(-2px);
    box-shadow: 0 6px 18px rgba(0,0,0,0.2);
}

/* Badges de destaque */
.feature-badges {
    display: flex;
    gap: 10px;
    margin: 1.5rem 0;
    flex-wrap: wrap;
    justify-content: center;
}

.badge {
    padding: 8px 16px;
    border-radius: 20px;
    font-size: 0.85rem;
    font-weight: 600;
    background: #f8f9fa;
    border: 1px solid #e9ecef;
    transition: background 0.3s, color 0.3s, box-shadow 0.3s;
    cursor: pointer;
    box-shadow: 0 2px 8px rgba(0,0,0,0.04);
}

.badge:hover {
    box-shadow: 0 4px 16px rgba(26,76,255,0.10);
    filter: brightness(1.08);
    transform: translateY(-2px) scale(1.04);
}

.badge.historical {
    background: linear-gradient(135deg, #667eea, #764ba2);
    color: white;
    border: none;
}
.badge.historical:hover {
    background: linear-gradient(135deg, #4e54c8, #8f94fb);
}

.badge.cultural {
    background: linear-gradient(135deg, #f093fb, #f5576c);
    color: white;
    border: none;
}
.badge.cultural:hover {
    background: linear-gradient(135deg, #fc67fa, #f5576c);
}

.badge.location {
    background: linear-gradient(135deg, #4facfe, #00f2fe);
    color: white;
    border: none;
}
.badge.location:hover {
    background: linear-gradient(135deg, #43e97b, #38f9d7);
}

/* Modo escuro para badges */
[data-theme="dark"] .badge {
    background: color-mix(in srgb, var(--accent-primary) 10%, var(--bg-secondary) 90%);
    color: var(--text-primary);
    border: 1px solid var(--border-color);
    box-shadow: 0 2px 8px var(--shadow-light);
}
[data-theme="dark"] .badge.historical {
    background: linear-gradient(135deg, #4dabf7, #764ba2);
    color: #fff;
    border: none;
}
[data-theme="dark"] .badge.historical:hover {
    background: linear-gradient(135deg, #3a8dde, #a084e8);
}
[data-theme="dark"] .badge.cultural {
    background: linear-gradient(135deg, #b388ff, #f5576c);
    color: #fff;
    border: none;
}
[data-theme="dark"] .badge.cultural:hover {
    background: linear-gradient(135deg, #fc67fa, #b388ff);
}
[data-theme="dark"] .badge.location {
    background: linear-gradient(135deg, #00b4d8, #38f9d7);
    color: #fff;
    border: none;
}
[data-theme="dark"] .badge.location:hover {
    background: linear-gradient(135deg, #43e97b, #00b4d8);
}

/* Divisórias melhoradas */
.section-divider {
    width: 80%;
    border: none;
    height: 2px;
    background: linear-gradient(90deg, transparent, #1a4cff, transparent);
    margin: 3rem auto;
}

/* Cabeçalho de seção com timeline */
.section-header {
    display: flex;
    align-items: center;
    gap: 20px;
    margin-bottom: 2rem;
}

.timeline-badge {
    background: linear-gradient(135deg, #1a4cff, #00b4d8);
    color: white;
    padding: 8px 16px;
    border-radius: 20px;
    font-weight: 700;
    font-size: 1.1rem;
}

/* Layout de história */
.history-content {
    display: grid;
    gap: 2rem;
}

.history-highlight {
    background: linear-gradient(135deg, #f8f9ff, #e8f0ff);
    padding: 1.5rem;
    border-radius: 12px;
    border-left: 4px solid #1a4cff;
}

/* Modo escuro para história */
[data-theme="dark"] .history-highlight {
    background: linear-gradient(
        135deg,
        color-mix(in srgb, var(--bg-secondary) 70%, transparent),
        color-mix(in srgb, var(--bg-tertiary) 70%, transparent)
    ) !important;
    border-left: 4px solid var(--accent-primary) !important;
    color: var(--text-primary) !important;
}

/* Cards de informação */
.info-card {
    background: #fff;
    padding: 1.5rem;
    border-radius: 12px;
    box-shadow: 0 4px 12px rgba(0,0,0,0.1);
    height: 100%;
}

.info-card.tpa-card {
  position: relative;
  z-index: 1;
}
.info-card.tpa-card .eco-link {
  position: relative;
  z-index: 2;
  pointer-events: auto;
}

.info-icon {
    font-size: 2rem;
    margin-bottom: 1rem;
}

.feature-list {
    list-style: none;
    padding: 0;
    margin: 1rem 0;
}

.feature-list li {
    padding: 8px 0;
    border-bottom: 1px solid #f1f3f4;
}

.feature-list li:last-child {
    border-bottom: none;
}

/* Grid de informações */
.info-grid {
    display: flex;
    flex-direction: column;
    gap: 1rem;
}

.info-item {
    display: flex;
    flex-direction: column;
    gap: 4px;
}

.info-item strong {
    color: #1a4cff;
}

/* Atividades */
.activities-section {
    margin-top: 2rem;
}

.activities-grid {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(200px, 1fr));
    gap: 1rem;
    margin-top: 1rem;
}

.activity-item {
    display: flex;
    align-items: center;
    gap: 12px;
    padding: 1rem;
    background: #f8f9fa;
    border-radius: 8px;
    transition: all 0.3s ease;
}

.activity-item:hover {
    background: #e9ecef;
    transform: translateY(-2px);
}

.activity-icon {
    font-size: 1.5rem;
}

/* Transporte */
.transport-options {
    margin-top: 2rem;
}

.transport-grid {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(150px, 1fr));
    gap: 1rem;
    margin-top: 1rem;
}

.transport-item {
    display: flex;
    align-items: center;
    gap: 12px;
    padding: 1rem;
    background: #f8f9fa;
    border-radius: 8px;
    transition: background 0.3s;
    color: #222;
}

.transport-icon {
    font-size: 1.8rem;
    color: #1a4cff;
}

/* Modo escuro para transporte */
[data-theme="dark"] .transport-item {
    background: color-mix(in srgb, var(--bg-secondary) 70%, transparent) !important;
    color: var(--text-primary) !important;
}

[data-theme="dark"] .transport-icon {
    color: var(--accent-primary) !important;
}

/* Indicadores do carrossel */
.carousel-indicators {
    display: flex;
    justify-content: center;
    gap: 8px;
    margin-top: 1rem;
}

.indicator {
    width: 12px;
    height: 12px;
    border-radius: 50%;
    background: #ccc;
    cursor: pointer;
    transition: all 0.3s ease;
}

.indicator.active {
    background: #1a4cff;
    transform: scale(1.2);
}

/* Legenda do carrossel */
.carousel-caption {
    position: absolute;
    bottom: 0;
    left: 0;
    right: 0;
    background: rgba(0,0,0,0.7);
    color: white;
    padding: 8px 12px;
    font-size: 0.9rem;
    text-align: center;
}

.navbar-brand img { filter: none; }
.logo-text { color: var(--text-primary) !important; }
.navItems {
  background: transparent !important;
}
.navItems li a {
  color: var(--text-primary) !important;
  background: transparent !important;
  border-color: transparent !important;
}
.navItems li a:hover {
  background: var(--bg-secondary) !important;
  color: var(--accent-primary) !important;
}
.navItems li i {
  color: var(--accent-primary) !important;
}
.auth-buttons a {
  color: #fff !important;
  background: var(--accent-primary) !important;
  border: none !important;
}
.auth-buttons a.btn-register {
  background: var(--accent-secondary) !important;
}
.auth-buttons a:hover {
  filter: brightness(1.1);
}
/* Footer totalmente temático */
footer {
  background: var(--header-bg) !important;
  color: var(--text-primary) !important;
  border-top: 1px solid var(--border-color) !important;
  box-shadow: 0 -2px 8px var(--shadow-light) !important;
}
footer .container-rodape { color: var(--text-primary) !important; }
footer a { color: var(--accent-primary) !important; }
footer a:hover { color: var(--accent-secondary) !important; }
footer .social-icons i { color: var(--accent-primary) !important; }

/* Corrige typo para garantir cor dos textos nos cards de gastronomia */
.container-locais p {
  color: var(--text-primary) !important;
}

/* ====== Página SOBRE A EQUIPE ====== */
.container-sobre {
  max-width: 1000px;
  margin: 48px auto 40px auto;
  padding: 40px 30px;
  background: var(--card-bg) !important;
  border-radius: 20px;
  box-shadow: 0 8px 40px var(--shadow-light);
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 36px;
  color: var(--text-primary) !important;
}
.sobre-header {
  text-align: center;
  width: 100%;
  padding-bottom: 20px;
  border-bottom: 2px solid color-mix(in srgb, var(--accent-primary) 20%, var(--border-color) 80%);
}
.container-sobre h1 {
  font-size: 2.5rem;
  font-weight: 800;
  color: var(--accent-primary);
  margin-bottom: 8px;
  text-align: center;
}
.sobre-subtitulo {
  font-size: 1.2rem;
  color: var(--text-secondary);
  font-weight: 500;
}
.sobre-bloco {
  background: color-mix(in srgb, var(--card-bg) 90%, transparent 10%) !important;
  border-radius: 16px;
  padding: 30px;
  box-shadow: 0 4px 20px var(--shadow-light);
  width: 100%;
  border: 1px solid var(--border-color);
  transition: transform 0.3s ease, box-shadow 0.3s ease;
}
.sobre-bloco h2 {
  color: var(--accent-primary);
  font-size: 1.3rem;
  font-weight: 700;
  margin-bottom: 10px;
}
.sobre-bloco p {
  color: var(--text-primary);
  font-size: 1.05rem;
  line-height: 1.7;
}
.sobre-integrantes {
  display: flex;
  flex-wrap: wrap;
  gap: 32px;
  justify-content: center;
  margin-top: 20px;
}
.sobre-integrante {
  background: color-mix(in srgb, var(--card-bg) 95%, transparent 5%) !important;
  border-radius: 14px;
  padding: 18px 24px;
  box-shadow: 0 2px 10px var(--shadow-light);
  min-width: 220px;
  max-width: 260px;
  text-align: center;
  border: 1px solid var(--border-color);
}
.sobre-integrante h3 {
  color: var(--accent-primary);
  font-size: 1.1rem;
  margin-bottom: 6px;
}
.sobre-integrante p {
  color: var(--text-secondary);
  font-size: 0.98rem;
}


.sobre-bloco.agradecimento {
  background: linear-gradient(135deg, color-mix(in srgb, var(--card-bg) 85%, transparent 15%), color-mix(in srgb, var(--accent-primary) 15%, transparent 85%)) !important;
  border-radius: 20px;
  padding: 35px;
  box-shadow: 0 8px 30px var(--shadow-light), 0 0 0 1px color-mix(in srgb, var(--accent-primary) 20%, transparent 80%);
  width: 100%;
  border: 2px solid color-mix(in srgb, var(--accent-primary) 30%, transparent 70%);
  transition: all 0.4s ease;
  position: relative;
  overflow: hidden;
}

/* Efeito de brilho sutil */
.sobre-bloco.agradecimento::before {
  content: '';
  position: absolute;
  top: -50%;
  left: -50%;
  width: 200%;
  height: 200%;
  background: radial-gradient(circle, color-mix(in srgb, var(--accent-primary) 10%, transparent 90%) 0%, transparent 70%);
  opacity: 0.3;
  transition: opacity 0.4s ease;
}

.sobre-bloco.agradecimento:hover {
  transform: translateY(-5px);
  box-shadow: 0 15px 40px var(--shadow-light), 0 0 0 2px color-mix(in srgb, var(--accent-primary) 30%, transparent 70%);
}

.sobre-bloco.agradecimento:hover::before {
  opacity: 0.5;
}

/* Ícone especial */
.sobre-bloco.agradecimento .bloco-icon {
  background: linear-gradient(135deg, var(--accent-primary), color-mix(in srgb, var(--accent-primary) 70%, #764ba2 30%));
  border-radius: 50%;
  width: 70px;
  height: 70px;
  display: flex;
  align-items: center;
  justify-content: center;
  margin-bottom: 20px;
  box-shadow: 0 6px 20px color-mix(in srgb, var(--accent-primary) 40%, transparent 60%);
}

.sobre-bloco.agradecimento .bloco-icon i {
  font-size: 1.8rem;
  color: white;
}

/* Conteúdo do agradecimento */
.sobre-bloco.agradecimento .bloco-content h3 {
  color: var(--accent-primary);
  font-size: 1.5rem;
  font-weight: 800;
  margin-bottom: 15px;
  background: linear-gradient(135deg, var(--accent-primary), color-mix(in srgb, var(--accent-primary) 60%, #764ba2 40%));
  -webkit-background-clip: text;
  -webkit-text-fill-color: transparent;
  background-clip: text;
}

.sobre-bloco.agradecimento .bloco-content p {
  color: var(--text-primary);
  font-size: 1.1rem;
  line-height: 1.8;
  font-weight: 500;
}

.sobre-bloco.agradecimento .bloco-content strong {
  color: var(--accent-primary);
  font-weight: 700;
}

/* Modo escuro - ajustes especiais */
[data-theme="dark"] .sobre-bloco.agradecimento {
  background: linear-gradient(135deg, color-mix(in srgb, var(--card-bg) 90%, transparent 10%), color-mix(in srgb, var(--accent-primary) 20%, transparent 80%)) !important;
  box-shadow: 0 8px 30px rgba(0, 0, 0, 0.4), 0 0 0 1px color-mix(in srgb, var(--accent-primary) 30%, transparent 70%);
}

[data-theme="dark"] .sobre-bloco.agradecimento .bloco-icon {
  background: linear-gradient(135deg, var(--accent-primary), color-mix(in srgb, var(--accent-primary) 50%, #81e6d9 50%));
  box-shadow: 0 6px 20px color-mix(in srgb, var(--accent-primary) 50%, transparent 50%);
}

/* Efeito de pulso sutil para chamar atenção */
@keyframes subtle-pulse {
  0%, 100% { transform: scale(1); }
  50% { transform: scale(1.02); }
}

.sobre-bloco.agradecimento {
  animation: subtle-pulse 6s ease-in-out infinite;
}

/* Responsivo */
@media (max-width: 768px) {
  .sobre-bloco.agradecimento {
    padding: 25px;
    border-radius: 18px;
  }
  
  .sobre-bloco.agradecimento .bloco-icon {
    width: 60px;
    height: 60px;
  }
  
  .sobre-bloco.agradecimento .bloco-icon i {
    font-size: 1.5rem;
  }
  
  .sobre-bloco.agradecimento .bloco-content h3 {
    font-size: 1.3rem;
  }
  
  .sobre-bloco.agradecimento .bloco-content p {
    font-size: 1rem;
  }
}

/* =====================================
   RESPONSIVIDADE ESPECÍFICA PARA GASTRONOMIA
   ===================================== */

@media (min-width: 1024px) {
    .container-locais {
        grid-template-columns: repeat(3, 1fr);
        max-width: 1100px;
        margin-left: auto;
        margin-right: auto;
    }
}

/* Para 2 cards - centralizar o terceiro */
@media (max-width: 1023px) and (min-width: 769px) {
    .container-locais {
        grid-template-columns: repeat(2, 1fr);
        max-width: 800px;
        margin-left: auto;
        margin-right: auto;
    }
    
    /* Quando tiver 3 itens em telas médias, mostrar 2 na primeira linha e 1 centralizado na segunda */
    .container-locais:has(div:nth-child(3):last-child) {
        grid-template-columns: repeat(2, 1fr);
    }
    
    .container-locais:has(div:nth-child(3):last-child) div:nth-child(3) {
        grid-column: 1 / -1;
        justify-self: center;
        max-width: 320px; /* Limita a largura do card centralizado */
    }
}

.container-locais {
    display: flex;
    flex-wrap: wrap;
    gap: 1.5rem;
    justify-content: center;
    align-items: stretch;
    padding: 1rem 0;
}

.container-locais div {
    background: #fff;
    border-radius: 20px;
    padding: 1.5rem;
    box-shadow: 0 8px 24px rgba(0, 0, 0, 0.1);
    display: flex;
    flex-direction: column;
    align-items: center;
    text-align: center;
    transition: all 0.3s ease;
    border: 1px solid rgba(0, 0, 0, 0.05);
    position: relative;
    overflow: hidden;
    min-height: 420px;
    width: 100%;
    max-width: 350px; /* Largura máxima consistente */
    flex: 1 1 300px;
}
/* Modo escuro para container de locais */
[data-theme="dark"] .container-locais div {
    background: var(--card-bg) !important;
    color: var(--text-primary) !important;
    border: 1px solid var(--border-color) !important;
}

[data-theme="dark"] .container-locais h3 {
    color: #1a4cff !important;
}


.container-locais div:hover {
    transform: translateY(-8px);
    box-shadow: 0 16px 40px rgba(0, 0, 0, 0.15);
}

.container-locais img {
    width: 100%;
    height: 220px; /* altura fixa para padronizar as imagens */
    object-fit: cover;
    border-radius: 12px;
    margin-bottom: 12px;
    transition: transform 0.3s ease;
}

.container-locais div:hover img {
    transform: scale(1.05);
}

.container-locais h3 {
    margin: 1rem 0 0.5rem 0;
    font-size: 1.3rem;
    color: #1a4cff;
    transition: color 0.3s ease;
}

.container-locais a:hover h3 {
    color: #00b4d8;
    text-decoration: none;
}

.container-locais p {
    color: #555;
    line-height: 1.6;
    font-size: 1rem;
    margin-bottom: 0;
    text-align: center;
    flex-grow: 1;
    align-self: flex-start;
    text-align: left;
}


.container-locais a {
    text-decoration: none;
}



/* ======== Transições suaves ======== */
@keyframes fadeIn {
    from { opacity: 0; transform: translateY(20px); }
    to { opacity: 1; transform: translateY(0); }
}

/* =====================================
   RESPONSIVIDADE ESPECÍFICA PARA CULTURA
   ===================================== */

@media (max-width: 768px) {
    .container {
        padding: 30px 15px;
        margin: 1rem auto;
        width: 98%;
    }

    .home-title {
        font-size: 2.2rem;
        margin-top: 2rem;
    }

    .home-text.lead-paragraph {
        font-size: 1.1rem;
        padding: 0 0.5rem;
    }

    .section-title {
        font-size: 1.8rem;
    }

    .tabs-pag {
        flex-direction: column;
        gap: 10px;
        padding: 1rem;
    }

    .tablinks {
        max-width: 100%;
        padding: 15px 20px;
    }

    .tab {
        padding: 1.5rem;
    }

    .container-locais {
        grid-template-columns: 1fr;
        gap: 1.5rem;
        padding: 0.5rem;
        justify-items: center;
    }

    .container-locais div {
        max-width: 100%;
    }

    .btn-voltar {
        position: relative;
        top: auto;
        left: auto;
        margin-bottom: 1rem;
        width: 100%;
        text-align: center;
    }

    .carrossel {
        margin: 1rem auto;
        padding: 0.5rem;
    }

    .section-intro,
    .section-folclore,
    .section-gastronomia,
    .section-locais,
    .section-mais {
        margin: 2rem 0;
        padding: 1.5rem;
    }
}

@media (max-width: 480px) {
    .home-title {
        font-size: 1.8rem;
    }

    .home-text {
        font-size: 1rem;
        padding: 0;
    }

    .section-title {
        font-size: 1.5rem;
    }

    .tab {
        padding: 1rem;
    }

    .lenda-img {
        border-radius: 12px;
    }

    .link-destaque {
        padding: 12px 24px;
        font-size: 1rem;
        width: 100%;
        text-align: center;
    }

    .container-locais div {
        padding: 1rem;
    }

    .section-intro, .section-folclore, .section-gastronomia, .section-locais, .section-mais {
    margin: 2rem 0;
    padding: 0rem;
    }
}

@media (max-width: 380px) {
    .btn-voltar a {
        font-size: 0.9rem;
        gap: 6px;
    }

        .section-intro, .section-folclore, .section-gastronomia, .section-locais, .section-mais {
    margin: 0rem 0;
    padding: 0rem;
    }
}

/* Efeitos de hover suaves */
.container-locais a,
.tablinks,
.link-destaque,
.btn-voltar {
    transition: all 0.3s cubic-bezier(0.4, 0, 0.2, 1);
}

/* Melhoria na legibilidade do texto */
.section-intro p,
.section-folclore p,
.section-gastronomia p,
.section-locais p,
.section-mais p {
    text-shadow: 0 1px 2px rgba(255, 255, 255, 0.8);
}

/* ==================== MENU ADMIN (TOPO) ==================== */
.menu_adm {
    position: fixed;
    top: 0;
    left: 80px;
    right: 0;
    height: 60px;
    background: rgba(255, 255, 255, 0.95);
    backdrop-filter: blur(6px);
    box-shadow: 0 2px 10px rgba(0, 0, 0, 0.08);
    border-bottom: 1px solid rgba(0, 0, 0, 0.05);
    display: flex;
    align-items: center;
    z-index: 900;
    padding: 0 16px;
    transition: left 0.3s ease, background 0.3s ease, border-color 0.3s ease;
    overflow-x: auto;
    overflow-y: hidden;
    white-space: nowrap;
    -webkit-overflow-scrolling: touch;
    scrollbar-width: thin;
    scrollbar-color: rgba(0, 0, 0, 0.2) transparent;
}

/* Custom scrollbar para Webkit */
.menu_adm::-webkit-scrollbar {
    height: 4px;
}

.menu_adm::-webkit-scrollbar-track {
    background: transparent;
}

.menu_adm::-webkit-scrollbar-thumb {
    background: rgba(0, 0, 0, 0.2);
    border-radius: 2px;
}

.menu_adm::-webkit-scrollbar-thumb:hover {
    background: rgba(0, 0, 0, 0.3);
}

.topo.expanded ~ .menu_adm {
    left: 250px;
}

/* Itens do menu */
.menu_adm .menu {
    display: flex;
    gap: 6px;
    list-style: none;
    margin: 0;
    padding: 0;
    min-width: max-content;
}

.menu_adm .link_tab {
    background: none;
    border: none;
    padding: 10px 18px;
    cursor: pointer;
    font-size: 0.95rem;
    font-weight: 600;
    color: #222a3a;
    transition: all 0.25s ease;
    display: flex;
    align-items: center;
    gap: 6px;
    border-radius: 8px;
    flex-shrink: 0;
}

.menu_adm .link_tab:hover {
    background: #eaf0ff;
    color: #1a4cff;
}

.menu_adm .link_tab.active {
    background: #1a4cff;
    color: #fff;
    box-shadow: 0 3px 8px rgba(26, 76, 255, 0.2);
}

.menu_adm .link_tab.sair {
    color: #c62828;
    font-weight: 700;
}

.menu_adm .link_tab.sair:hover {
    background: #ffeaea;
    color: #a10000;
}

/* ==================== RESPONSIVIDADE ==================== */

/* Tablets */
@media (max-width: 1024px) {
    .menu_adm {
        left: 80px;
        padding: 0 12px;
    }
    
    .topo.expanded ~ .menu_adm {
        left: 250px;
    }
    
    .menu_adm .link_tab {
        padding: 10px 16px;
        font-size: 0.9rem;
    }
}

/* Tablets pequenos */
@media (max-width: 768px) {
    .menu_adm {
        left: 80px;
        height: 55px;
        padding: 0 10px;
    }
    
    .topo.expanded ~ .menu_adm {
        left: 80px; /* Mantém a mesma posição quando expandido em mobile */
    }
    
    .menu_adm .link_tab {
        padding: 8px 14px;
        font-size: 0.85rem;
        gap: 4px;
    }
    
    .menu_adm .menu {
        gap: 4px;
    }
}

/* Celulares */
@media (max-width: 576px) {
    .menu_adm {
        left: 0;
        right: 0;
        height: 50px;
        padding: 0 8px;
    }
    
    .topo.expanded ~ .menu_adm {
        left: 0; /* Mantém a mesma posição quando expandido em mobile */
    }
    
    .menu_adm .link_tab {
        padding: 8px 12px;
        font-size: 0.8rem;
    }
    
    .menu_adm .menu {
        gap: 3px;
    }
    
    /* Esconde ícones em telas muito pequenas para economizar espaço */
    .menu_adm .link_tab i {
        font-size: 0.9rem;
    }
}

/* Celulares muito pequenos */
@media (max-width: 400px) {
    .menu_adm {
        height: 48px;
        padding: 0 6px;
    }
    
    .menu_adm .link_tab {
        padding: 7px 10px;
        font-size: 0.75rem;
    }
    
    /* Remove ícones em telas extremamente pequenas */
    .menu_adm .link_tab i {
        display: none;
    }
    
    .menu_adm .menu {
        gap: 2px;
    }
}

/* Modo escuro */
[data-theme="dark"] .menu_adm {
    background: rgba(45, 55, 72, 0.95);
    backdrop-filter: blur(6px);
    box-shadow: 0 2px 10px rgba(0, 0, 0, 0.2);
    border-bottom: 1px solid rgba(255, 255, 255, 0.05);
}

[data-theme="dark"] .menu_adm .link_tab {
    color: #e2e8f0;
}

[data-theme="dark"] .menu_adm .link_tab:hover {
    background: rgba(66, 153, 225, 0.15);
    color: #90cdf4;
}

[data-theme="dark"] .menu_adm .link_tab.active {
    background: #4299e1;
    color: #fff;
    box-shadow: 0 3px 8px rgba(66, 153, 225, 0.3);
}

[data-theme="dark"] .menu_adm .link_tab.sair {
    color: #fc8181;
}

[data-theme="dark"] .menu_adm .link_tab.sair:hover {
    background: rgba(248, 113, 113, 0.15);
    color: #feb2b2;
}

/* Ícones nos links */
.menu_adm .link_tab i {
    transition: transform 0.2s ease;
    font-size: 0.9rem;
}

.menu_adm .link_tab:hover i {
    transform: scale(1.1);
}

[data-theme="dark"] .menu_adm .link_tab i {
    color: #a0aec0;
}

[data-theme="dark"] .menu_adm .link_tab:hover i {
    color: #90cdf4;
}

.menu_adm .link_tab.active i {
    color: #fff;
}

.tab_adm {
    display: none;
    margin-top: 30px;
    padding: 20px;
    background: var(--bg-primary);
    border-radius: 12px;
    box-shadow: 0 4px 12px rgba(0,0,0,0.08);
    animation: fadeIn 0.4s ease-in-out;
    min-height: 400px;
    max-width: 900px;
    margin-left: auto;
    margin-right: auto;
    text-align: left;
    font-size: 1rem;
    line-height: 1.6;
    color: var(--text-primary);
    transition: all 0.3s ease;
}

.tab_adm:target {
    display: block;
}

.tab_adm#tab1 {
    display: block;
}

.tab_adm h2 {
    color: #1a4cff;
    font-size: 1.6rem;
    font-weight: 700;
    margin-bottom: 14px;
}

.tab_adm p {
    color: #333;
    font-size: 1.05rem;
    line-height: 1.6;
}

/* Responsividade */
@media (max-width: 900px) {
    .menu_adm {
        left: 0 !important;
        justify-content: center;
    }

    .container_tabs {
        margin-left: 0 !important;
        padding: 16px;
    }

    .tab_adm {
        padding: 20px;
    }

    .menu_adm .link_tab {
        font-size: 0.85rem;
        padding: 8px 12px;
    }
}

/* =====================================
   PÁGINA CULTURA (Tipografia e Estrutura)
   ===================================== */

.container-cultura{
    width: 95%;
    max-width: 1200px;
    padding: 40px 30px;
    background: rgb(255, 255, 255);
    border-radius: 20px;
    box-shadow: 0 8px 32px rgba(25, 125, 255, 0.12);
    margin: 0 auto;
    text-align: center;
    border: 1px solid rgba(255, 255, 255, 0.2);
}

@media (max-width: 768px) {
    .container-cultura {
        width: 100%;
        padding: 30px 0px;
        text-align: center;
    }
}

.home-title {
    font-size: 2.8rem;
    font-weight: 800;
    margin-bottom: 1rem;
    color: #1a4cff;
    text-shadow: 0 2px 4px rgba(0, 0, 0, 0.1);
    position: relative;
    display: inline-block;
}

.home-title::after {
    content: '';
    position: absolute;
    bottom: -10px;
    left: 50%;
    transform: translateX(-50%);
    width: 100px;
    height: 4px;
    background: linear-gradient(90deg, #1a4cff, #00b4d8);
    border-radius: 2px;
}

/* Novo estilo para o primeiro parágrafo de cada seção */
.home-text.lead-paragraph {
    font-size: 1.3rem;
    font-weight: 400;
    color: #2c3e50;
    line-height: 1.7;
    margin-bottom: 2rem;
    text-align: center;
    padding: 0 2rem;
}

.home-text {
    font-size: 1.1rem;
    color: var(--text-primary);
    line-height: 1.8;
    margin-top: 1.5rem;
    text-align: justify;
    padding: 0 1rem;
}

hr {
    width: 80%;
    border: none;
    height: 2px;
    background: linear-gradient(90deg, transparent, #1a4cff, transparent);
    margin: 3rem auto;
}

.section-intro,
.section-folclore,
.section-gastronomia,
.section-locais,
.section-mais {
    margin: 3rem 0;
    padding: 2rem;
    border-radius: 16px;
    background: rgba(255, 255, 255, 0.6);
    backdrop-filter: blur(5px);

}

.section-title {
  font-weight: 700;
  font-size: 1.8rem;
  color: #0f52ba;
  position: relative;
  padding-left: 20px; /* Ajuste conforme necessário */
  margin: 2rem 0 1.5rem 0;
}   

.section-title::before {
    content: '';
    position: absolute;
    left: 0;
    top: 50%;
    transform: translateY(-50%);
    width: 8px;
    height: 100%;
    background: linear-gradient(180deg, #1a4cff, #00b4d8);
    border-radius: 4px;
}

.subtitle { /* Mantido para h3 */
    color: #2c3e50;
    font-size: 1.4rem;
    margin-top: 25px;
    margin-bottom: 15px;
    font-weight: 700;
}

.lenda-title { /* Nova classe para h4 dentro das abas */
    font-size: 1.8rem;
    font-weight: 700;
    color: #0055cc;
    margin: 20px 0 15px;
    text-align: center;
}

/* Estilo para a lista de pratos (Melhoria na UX) */
.gastronomia-list {
    list-style: none;
    padding: 0;
    margin: 30px auto;
    max-width: 800px;
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(300px, 1fr)); /* 2 colunas em telas maiores */
    gap: 20px;
}

.gastronomia-list li {
    background: #ffffff;
    padding: 15px;
    border-left: 5px solid #00b4d8; /* Cor de destaque */
    border-radius: 8px;
    box-shadow: 0 2px 8px rgba(0, 0, 0, 0.05);
    transition: transform 0.2s;
    font-size: 1.05rem;
    line-height: 1.5;
    text-align: left;
}

.gastronomia-list li:hover {
    transform: translateY(-3px);
    box-shadow: 0 4px 12px rgba(0, 0, 0, 0.1);
}

.gastronomia-list li strong {
    display: block;
    color: #1746ff;
    font-size: 1.15rem;
    margin-bottom: 5px;
}

/* ===== Carrossel: CORREÇÃO FINAL GARANTIDA ===== */
.carrossel {
  position: relative;
  width: 100%;
  max-width: 1200px;
  margin: 20px auto;
  display: flex;
  align-items: center;
  justify-content: center;
}

.carousel-viewport {
    overflow: hidden;
    width: 100%;
    border-radius: 12px;
    box-shadow: 0 3px 16px rgba(25,125,255,0.12);
    background: #d9d9d9;
}

/* Modo escuro para o carrossel */
[data-theme="dark"] .carousel-viewport {
    background: var(--bg-tertiary) !important;
}

.carousel-list {
  display: flex;
  transition: transform 0.5s ease;
  gap: 20px;
  padding: 10px;
}

.slide {
  position: relative;
  flex: 0 0 calc((100% - 40px) / 3);
  min-height: 300px; 
  border-radius: 12px;
  overflow: hidden;
  box-shadow: 0 4px 12px rgba(0,0,0,0.1);
}

.slide img {
  width: 100%;
  height: 100%; 
  object-fit: cover;
  border-radius: 12px;
}

.slide-gastronomia {
    display: flex; 
    flex-direction: column;
    height: 100%; 
}

/* Redefine a altura da IMAGEM APENAS NO CARROSSEL DE GASTRONOMIA */
.slide-gastronomia img {
    height: 220px; 
    border-radius: 12px 12px 0 0; 
}

/* legenda padrão (Home Page) - Caso exista uma, será simples e horizontal */
.carousel-caption {
    background-color: #6c757d;
    color: #fff;
    padding: 12px;
    text-align: left;
    font-size: 14px;
    font-weight: 500;
    line-height: 1.4;
    border-radius: 0 0 10px 10px; 
    display: flex; 
    align-items: center;
    justify-content: flex-start;
}


/* Redefine a altura da IMAGEM APENAS NO CARROSSEL DE GASTRONOMIA */
.slide-gastronomia img {
    height: 220px; 
    border-radius: 12px 12px 0 0; 
    object-fit: cover; /* Garante que a imagem preencha o espaço */
    width: 100%;
}

/* ===== Estilo Específico para Carrossel de GASTRONOMIA (Título em cima, texto em baixo) ===== */
.carousel-caption-gastronomia {
    background-color: #6c757d;
    color: #fff;
    padding: 15px;
    text-align: left;
    line-height: 1.4;
    border-radius: 0 0 10px 10px;
    flex: 1; /* Ocupa todo espaço restante */
    display: flex; 
    flex-direction: column;
    align-items: flex-start; 
    justify-content: flex-start;
    min-height: 120px; /* Altura mínima para uniformizar */
    height: 100%; /* Garante que ocupe toda altura disponível */
}

.carousel-caption-gastronomia h3 {
    margin: 0 0 8px 0;
    padding: 0;
    font-size: 1.1rem; 
    font-weight: 700; 
    color: #ffffff;
    line-height: 1.2;
}

.carousel-caption-gastronomia p {
    margin: 0;
    padding: 0;
    font-size: 0.85rem; 
    font-weight: 400; 
    line-height: 1.4;
    color: #e9ecef;
    flex: 1;
    overflow: hidden; 
    display: -webkit-box;
    -webkit-line-clamp: 3; 
    line-clamp: 3; 
    -webkit-box-orient: vertical;
}

/* botões */
.carousel-button {
    position: absolute;
    top: 50%;
    transform: translateY(-50%);
    background-color: rgba(0,0,0,0.35);
    color: #fff;
    border: none;
    width: 40px;
    height: 40px;
    border-radius: 50%;
    cursor: pointer;
    z-index: 20;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 20px;
    transition: background 0.2s, transform 0.12s;
}
.carousel-button:hover { 
    background-color: rgba(0,0,0,0.55); 
    transform: translateY(-50%) scale(1.03); 
}
.carousel-button.prev { left: 8px; }
.carousel-button.next { right: 8px; }

/* RESPONSIVIDADE CORRIGIDA */

@media (max-width: 1450px) {
    .carrossel {
        max-width: 95%;
        margin: 15px auto;
    }
    
    .carousel-viewport {
        width: 100%;
    }
    
    .slide {
        flex: 0 0 calc((100% - 20px) / 2); /* Mantém 2 slides em tablets */
        min-height: 280px;
    }
    
    .slide-gastronomia img {
        height: 200px;
    }
    
    .carousel-button {
        width: 35px;
        height: 35px;
        font-size: 18px;
    }
}

@media (max-width: 1024px) {
    .carrossel {
        max-width: 95%;
        margin: 15px auto;
    }
    
    .carousel-viewport {
        width: 100%;
    }
    
    .slide {
        flex: 0 0 calc((100% - 20px) / 2); /* Mantém 2 slides em tablets */
        min-height: 280px;
    }
    
    .slide-gastronomia img {
        height: 200px;
    }
    
    .carousel-button {
        width: 35px;
        height: 35px;
        font-size: 18px;
    }
}

@media (max-width: 768px) {
    .slide {
        flex: 0 0 calc(100% - 10px); /* 1 slide em mobile com gap reduzido */
        min-height: 250px;
    }
    
    .carousel-list {
        gap: 10px;
        padding: 8px;
    }
    
    .slide-gastronomia img {
        height: 180px;
    }
    
    .carousel-caption,
    .carousel-caption-gastronomia {
        padding: 30px 20px;
        font-size: 13px;
    }
    
    .carousel-caption-gastronomia h3 {
        font-size: 1rem;
    }
    
    .carousel-caption-gastronomia p {
        font-size: 0.9rem;
    }
    
    .carousel-button {
        width: 32px;
        height: 32px;
        font-size: 16px;
    }
    
    .carousel-button.prev { left: 5px; }
    .carousel-button.next { right: 5px; }
}

@media (max-width: 480px) {
    .slide {
        flex: 0 0 100%; /* 1 slide ocupando toda largura */
        min-height: 220px;
    }
    
    .carousel-list {
        gap: 8px;
        padding: 5px;
    }
    
    .slide-gastronomia img {
        height: 160px;
    }
    
    .carousel-caption,
    .carousel-caption-gastronomia {
        padding: 30px 20px;
        font-size: 12px;
    }
    
    .carousel-caption-gastronomia h3 {
        font-size: 0.95rem;
    }
    
    .carousel-caption-gastronomia p {
        font-size: 0.85rem;
    }
}

/* =====================================
   NOTÍCIAS
   ===================================== */

/* Layout principal */
.container-noticia-completo {
    margin-left: 100px;
    margin-right: 20px;
    transition: margin-left 0.3s ease;
    width: auto;
    max-width: 1600px;
    min-width: 0;
}

.topo.expanded ~ .container-noticia-completo {
    margin-left: 260px;
}

.noticia-layout {
    grid-template-columns: 2fr 1fr;
    gap: 2rem;
    align-items: start;
    min-width: 0;
}

.noticia-conteudo-principal {
    background: white;
    border-radius: 20px;
    padding: 3rem;
    box-shadow: 0 8px 30px rgba(0,0,0,0.12);
    margin: 0;
    width: 100%;
    min-width: 0;
    overflow: hidden; /* Importante para conter vídeos */
}

/* Cabeçalho da notícia */
.noticia-header {
    text-align: center;
    margin-bottom: 3rem;
    padding: 0 2rem;
}

.noticia-meta {
    display: flex;
    justify-content: center;
    gap: 1.2rem;
    margin-bottom: 1.5rem;
    flex-wrap: wrap;
}

.noticia-categoria {
    background: linear-gradient(135deg, #3498db 0%, #2ecc71 100%);
    color: white;
    padding: 0.6rem 1.8rem;
    border-radius: 30px;
    font-size: 0.85rem;
    font-weight: 700;
    letter-spacing: 0.5px;
    transition: all 0.4s cubic-bezier(0.25, 0.46, 0.45, 0.94);
    position: relative;
    overflow: hidden;
    border: none;
    text-transform: uppercase;
    box-shadow: 0 4px 15px rgba(52, 152, 219, 0.3);
    display: inline-flex;
    align-items: center;
    gap: 0.4rem;
    text-decoration: none;
}

.noticia-categoria::before {
    content: '';
    position: absolute;
    top: 0;
    left: -100%;
    width: 100%;
    height: 100%;
    background: linear-gradient(90deg, transparent, rgba(255,255,255,0.2), transparent);
    transition: left 0.6s ease;
}

.noticia-categoria:hover::before {
    left: 100%;
}

.noticia-categoria i {
    font-size: 0.8rem;
}

.noticia-subcategoria {
    background: linear-gradient(135deg, #e74c3c 0%, #e67e22 100%);
    color: white;
    padding: 0.6rem 1.8rem;
    border-radius: 30px;
    font-size: 0.85rem;
    font-weight: 700;
    letter-spacing: 0.5px;
    transition: all 0.4s cubic-bezier(0.25, 0.46, 0.45, 0.94);
    position: relative;
    overflow: hidden;
    border: none;
    text-transform: uppercase;
    box-shadow: 0 4px 15px rgba(52, 152, 219, 0.3);
    display: inline-flex;
    align-items: center;
    gap: 0.4rem;
    text-decoration: none;
}

.noticia-subcategoria::before {
    content: '';
    position: absolute;
    top: 0;
    left: -100%;
    width: 100%;
    height: 100%;
    background: linear-gradient(90deg, transparent, rgba(255,255,255,0.2), transparent);
    transition: left 0.6s ease;
}

.noticia-subcategoria:hover::before {
    left: 100%;
}

.noticia-subcategoria i {
    font-size: 0.8rem;
}

/* REGIÃO - Estilo adicionado */
.noticia-regiao {
    background: linear-gradient(135deg, #10b981 0%, #059669 100%);
    color: white;
    padding: 0.6rem 1.8rem;
    border-radius: 7px;
    font-size: 0.85rem;
    font-weight: 700;
    letter-spacing: 0.5px;
    transition: all 0.4s cubic-bezier(0.25, 0.46, 0.45, 0.94);
    position: relative;
    overflow: hidden;
    border: none;
    text-transform: uppercase;
    box-shadow: 0 4px 15px rgba(52, 152, 219, 0.3);
    display: inline-flex;
    align-items: center;
    gap: 0.4rem;
    text-decoration: none;
}

.noticia-regiao::before {
    content: '';
    position: absolute;
    top: 0;
    left: -100%;
    width: 100%;
    height: 100%;
    background: linear-gradient(90deg, transparent, rgba(255,255,255,0.2), transparent);
    transition: left 0.6s ease;
}

.noticia-regiao:hover::before {
    left: 100%;
}

.noticia-regiao i {
    font-size: 0.8rem;
}

.noticia-data {
    display: flex;
    align-items: center;
    gap: 0.8rem;
    background: linear-gradient(135deg, #f8f9fa 0%, #e9ecef 100%);
    padding: 0.8rem 1.8rem;
    border-radius: 30px;
    font-size: 0.85rem;
    color: #555;
    border: 2px solid transparent;
    font-weight: 600;
    letter-spacing: 0.3px;
    transition: all 0.4s cubic-bezier(0.25, 0.46, 0.45, 0.94);
    position: relative;
    overflow: hidden;
    box-shadow: 0 3px 10px rgba(0, 0, 0, 0.08);
}

.noticia-data::before {
    content: '';
    position: absolute;
    top: 0;
    left: -100%;
    width: 100%;
    height: 100%;
    background: linear-gradient(90deg, transparent, rgba(52, 152, 219, 0.1), transparent);
    transition: left 0.6s ease;
}

.noticia-data:hover::before {
    left: 100%;
}

.noticia-data i {
    color: #3498db;
    font-size: 1rem;
    transition: all 0.4s ease;
    filter: drop-shadow(0 2px 3px rgba(52, 152, 219, 0.3));
}

/* Efeitos hover para modo claro */
.noticia-categoria:hover,
.noticia-subcategoria:hover,
.noticia-regiao:hover {
    transform: translateY(-3px) scale(1.05);
    box-shadow: 0 8px 25px rgba(0, 0, 0, 0.25);
    text-decoration: none;
    color: white;
}

.noticia-categoria:hover {
    box-shadow: 0 8px 25px rgba(52, 152, 219, 0.4);
}

.noticia-subcategoria:hover {
    box-shadow: 0 8px 25px rgba(231, 76, 60, 0.4);
}

.noticia-regiao:hover {
    box-shadow: 0 8px 25px rgba(16, 185, 129, 0.4);
}

.noticia-data:hover {
    transform: translateY(-3px) scale(1.05);
    box-shadow: 0 8px 20px rgba(0, 0, 0, 0.15);
    border-color: #3498db;
    background: linear-gradient(135deg, #ffffff 0%, #ecf0f1 100%);
}

.noticia-data:hover i {
    transform: scale(1.2) rotate(5deg);
    color: #2980b9;
    filter: drop-shadow(0 3px 5px rgba(41, 128, 185, 0.4));
}

/* Modo escuro */
[data-theme="dark"] .noticia-categoria {
    background: linear-gradient(135deg, #2980b9 0%, #27ae60 100%);
    box-shadow: 0 4px 20px rgba(41, 128, 185, 0.4);
    color: #f7fafc;
}

[data-theme="dark"] .noticia-subcategoria {
    background: linear-gradient(135deg, #c0392b 0%, #d35400 100%);
    box-shadow: 0 4px 20px rgba(192, 57, 43, 0.4);
    color: #f7fafc;
}

[data-theme="dark"] .noticia-regiao {
    background: linear-gradient(135deg, #059669 0%, #047857 100%);
    box-shadow: 0 4px 20px rgba(16, 185, 129, 0.4);
    color: #f7fafc;
}

[data-theme="dark"] .noticia-data {
    background: linear-gradient(135deg, #2c3e50 0%, #34495e 100%);
    color: #ecf0f1;
    border: 2px solid #34495e;
    box-shadow: 0 3px 15px rgba(0, 0, 0, 0.3);
}

[data-theme="dark"] .noticia-data i {
    color: #3498db;
    filter: drop-shadow(0 2px 3px rgba(52, 152, 219, 0.3));
}

[data-theme="dark"] .noticia-data::before {
    background: linear-gradient(90deg, transparent, rgba(52, 152, 219, 0.1), transparent);
}

/* Efeitos hover para modo escuro */
[data-theme="dark"] .noticia-categoria:hover,
[data-theme="dark"] .noticia-subcategoria:hover,
[data-theme="dark"] .noticia-regiao:hover {
    transform: translateY(-3px) scale(1.05);
    box-shadow: 0 12px 30px rgba(0, 0, 0, 0.5);
}

[data-theme="dark"] .noticia-categoria:hover {
    box-shadow: 0 12px 30px rgba(41, 128, 185, 0.5);
}

[data-theme="dark"] .noticia-subcategoria:hover {
    box-shadow: 0 12px 30px rgba(192, 57, 43, 0.5);
}

[data-theme="dark"] .noticia-regiao:hover {
    box-shadow: 0 12px 30px rgba(16, 185, 129, 0.5);
}

[data-theme="dark"] .noticia-data:hover {
    transform: translateY(-3px) scale(1.05);
    background: linear-gradient(135deg, #34495e 0%, #2c3e50 100%);
    border-color: #3498db;
    box-shadow: 0 8px 25px rgba(0, 0, 0, 0.4);
}

[data-theme="dark"] .noticia-data:hover i {
    transform: scale(1.2) rotate(5deg);
    color: #2980b9;
    filter: drop-shadow(0 3px 5px rgba(41, 128, 185, 0.4));
}

/* Animação de entrada suave */
.noticia-categoria,
.noticia-subcategoria,
.noticia-regiao,
.noticia-data {
    animation: fadeInUp 0.6s ease-out;
}

@keyframes fadeInUp {
    from {
        opacity: 0;
        transform: translateY(20px);
    }
    to {
        opacity: 1;
        transform: translateY(0);
    }
}

/* Efeito de brilho pulsante sutil */
.noticia-categoria::after,
.noticia-subcategoria::after,
.noticia-regiao::after {
    content: '';
    position: absolute;
    top: -2px;
    left: -2px;
    right: -2px;
    bottom: -2px;
    background: linear-gradient(135deg, 
        rgba(255,255,255,0.1) 0%, 
        transparent 30%, 
        transparent 70%, 
        rgba(255,255,255,0.1) 100%);
    border-radius: 32px;
    opacity: 0;
    transition: opacity 0.4s ease;
    z-index: -1;
}

.noticia-categoria:hover::after,
.noticia-subcategoria:hover::after,
.noticia-regiao:hover::after {
    opacity: 1;
}

.noticia-titulo {
    font-size: 2.8rem;
    color: #333;
    margin: 2rem 0;
    line-height: 1.2;
    font-weight: 700;
    word-wrap: break-word;
    overflow-wrap: break-word;
    transition: color 0.3s ease;
}

/* Modo escuro */
[data-theme="dark"] .noticia-titulo {
    color: #e2e8f0;
}

.noticia-divider {
    width: 120px;
    height: 5px;
    background: linear-gradient(135deg, #667eea 0%, #764ba2 100%);
    margin: 2.5rem auto;
    border-radius: 3px;
}

/* Imagem da notícia */
.noticia-imagem-destaque {
    position: relative;
    margin: 3.5rem 0;
    border-radius: 20px;
    overflow: hidden; 
    box-shadow: 0 20px 50px rgba(0,0,0,0.15);
    max-width: 100%; 
}

.noticia-img {
    width: 100%;
    height: 550px;
    object-fit: cover;
    display: block;
    transition: transform 0.3s ease;
    max-width: 100%;
}

.noticia-imagem-destaque:hover .noticia-img {
    transform: scale(1.02);
}

.noticia-imagem-overlay {
    position: absolute;
    bottom: 0;
    left: 0;
    right: 0;
    height: 50%;
    background: linear-gradient(transparent, rgba(0,0,0,0.4));
}

/* Conteúdo da notícia*/
.noticia-corpo {
    margin: 2.5rem 0;
    max-width: 100%;
    overflow: hidden; /* Importante para conter vídeos */
}

.noticia-texto {
    font-size: 1.15rem;
    line-height: 1.8;
    color: #444;
    margin-bottom: 3.5rem;
    text-align: justify;
    max-width: 100%;
    overflow: hidden; /* Importante para conter vídeos */
}

.noticia-texto p {
    margin-bottom: 1.8rem;
    max-width: 100%;
}

/* ESTILO PARA IMAGENS DENTRO DO TEXTO DA NOTÍCIA */
.noticia-texto img {
    max-width: 100% !important;
    height: auto !important; 
    display: block;
    margin: 2rem auto;
    border-radius: 12px;
    box-shadow: 0 5px 15px rgba(0,0,0,0.1);
}

/* ESTILO PARA VÍDEOS DENTRO DO TEXTO DA NOTÍCIA */
.noticia-texto video,
.noticia-texto iframe,
.noticia-texto .video-container {
    max-width: 100% !important;
    width: 100% !important;
    height: auto !important;
    display: block;
    margin: 2rem auto;
    border-radius: 12px;
    box-shadow: 0 5px 15px rgba(0,0,0,0.1);
    aspect-ratio: 16 / 9; /* Mantém proporção padrão de vídeo */
}

/* Container específico para vídeos responsivos */
.video-container {
    position: relative;
    width: 100%;
    max-width: 100%;
    overflow: hidden;
    border-radius: 12px;
}

.video-container iframe,
.video-container video {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    border: none;
}

/* Ratio 16:9 para vídeos */
.video-container-16-9 {
    padding-bottom: 56.25%; /* 16:9 Aspect Ratio */
}

/* Ratio 4:3 para vídeos */
.video-container-4-3 {
    padding-bottom: 75%; /* 4:3 Aspect Ratio */
}

/* Tags */
.noticia-tags {
    display: flex;
    gap: 1.2rem;
    margin-bottom: 3rem;
    flex-wrap: wrap;
    max-width: 100%;
}

.noticia-tags h2 {
    width: 100%;
    font-size: 1.4rem;
    color: var(--text-primary);
    margin-bottom: 1.2rem;
    font-weight: 600;
}

.tag-item {
    display: flex;
    align-items: center;
    gap: 0.6rem;
    background: #f8f9fa;
    padding: 0.8rem 1.5rem;
    border-radius: 30px;
    border: 1px solid #e9ecef;
    color: #666;
    font-size: 0.95rem;
    font-weight: 500;
    max-width: 100%;
    transition: all 0.3s ease;
    text-decoration: none;
}

.tag-item i {
    color: #667eea;
    transition: color 0.3s ease;
}

/* Estilo específico para tag de região */
.tag-item.regiao-tag {
    border-left: 3px solid #10b981;
}

.tag-item.regiao-tag i {
    color: #10b981;
}

/* Modo escuro */
[data-theme="dark"] .tag-item {
    background: #2d3748;
    border: 1px solid #4a5568;
    color: #e2e8f0;
}

[data-theme="dark"] .tag-item i {
    color: #81e6d9;
}

[data-theme="dark"] .tag-item.regiao-tag {
    border-left-color: #10b981;
}

[data-theme="dark"] .tag-item.regiao-tag i {
    color: #10b981;
}

/* Hover states para ambos os temas */
.tag-item:hover {
    transform: translateY(-2px);
    box-shadow: 0 4px 12px rgba(0, 0, 0, 0.1);
    text-decoration: none;
    color: inherit;
}

[data-theme="dark"] .tag-item:hover {
    background: #3a4556;
    box-shadow: 0 4px 12px rgba(0, 0, 0, 0.3);
}

/* Autor da notícia */
.noticia-user-simple {
    display: inline-flex;
    align-items: center;
    gap: 0.7rem;
    padding: 1rem 2rem;
    background: #f8f9fa;
    border-radius: 30px;
    font-size: 1rem;
    color: #666;
    border: 1px solid #e9ecef;
    margin-bottom: 2.5rem;
    font-weight: 500;
    max-width: 100%;
}

.noticia-user-simple i {
    color: #667eea;
    font-size: 1.1rem;
}

/* Modo escuro */
[data-theme="dark"] .noticia-user-simple {
    background: #2d3748;
    color: #cbd5e0;
    border: 1px solid #4a5568;
}

[data-theme="dark"] .noticia-user-simple i {
    color: #4299e1;
}

/* =====================================
   CONTAINER EXTERNO DOS CARDS
   ===================================== */
.cards-container-outer {
    max-width: 1400px;
    margin: 0 auto;
    padding: 0 1rem 3rem 1rem;
}

/* =====================================
   CARDS DE NOTÍCIAS (ÚLTIMAS NOTÍCIAS)
   ===================================== */
.cards-noticias {
    margin: 0;
    position: sticky;
    top: 2rem;
    min-width: 0; /* Importante: permite que os cards se ajustem */
}

.cards-noticias h2 {
    font-size: 1.8rem; /* Título um pouco menor */
    color: #333;
    margin-bottom: 1.5rem;
    text-align: center;
    font-weight: 700;
}

/* FORÇA OS CARDS DA SIDEBAR A FICAREM EM UMA ÚNICA COLUNA */
.cards-noticias .cards-noticias-container {
    display: grid;
    grid-template-columns: 1fr;
    gap: 1rem;
    margin-top: 0;
}

/* NOVO ESTILO COMPACTO PARA OS CARDS NA SIDEBAR */
.cards-noticias .card-noticia {
    display: flex;
    flex-direction: row;
    align-items: center;
    gap: 12px;
    padding: 10px;
    border-radius: 12px;
    background: white;
    box-shadow: 0 4px 15px rgba(0,0,0,0.08);
    transition: all 0.3s ease;
    height: auto;
    min-width: 0;
    max-width: 100%;
}

.cards-noticias .card-noticia:hover {
    transform: translateY(-4px) scale(1.02);
    box-shadow: 0 8px 25px rgba(0,0,0,0.12);
}

/* AJUSTE DA IMAGEM DO CARD COMPACTO */
.cards-noticias .card-noticia img {
    width: 80px;
    height: 60px;
    object-fit: cover;
    border-radius: 8px;
    flex-shrink: 0; 
    max-width: 100%; 
}

/* AJUSTE DO CONTEÚDO DO CARD COMPACTO */
.cards-noticias .card-content {
    padding: 0;
    flex-grow: 1;
    min-width: 0; 
    overflow: hidden; 
    max-width: 100%;
}

.cards-noticias .card-content h3 {
    font-size: 0.9rem; 
    margin-bottom: 5px;
    line-height: 1.3;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
    max-width: 100%;
}

/* ESCONDE O PARÁGRAFO PARA ECONOMIZAR ESPAÇO */
.cards-noticias .card-content p {
    display: none;
}

/* AJUSTE DO BOTÃO DO CARD COMPACTO */
.cards-noticias .btn-card {
    padding: 4px 10px;
    font-size: 0.75rem;
    margin-top: 6px;
    white-space: nowrap;
    max-width: 100%;
}

/* Estilos para quando não há notícias */
.sem-noticias {
    text-align: center;
    color: #666;
    font-size: 1.1rem;
    padding: 2rem;
    background: #f8f9fa;
    border-radius: 12px;
    border: 2px dashed #dee2e6;
    max-width: 100%;
    transition: all 0.3s ease;
}

.noticia-nao-encontrada {
    text-align: center;
    padding: 4rem 2rem;
    max-width: 100%;
    transition: all 0.3s ease;
}

.noticia-nao-encontrada h2 {
    color: #333;
    margin-bottom: 1rem;
    font-size: 2rem;
    transition: color 0.3s ease;
}

.noticia-nao-encontrada p {
    color: #666;
    font-size: 1.1rem;
    transition: color 0.3s ease;
}

/* Modo escuro */
[data-theme="dark"] .sem-noticias {
    color: #a0aec0;
    background: #2d3748;
    border: 2px dashed #4a5568;
}

[data-theme="dark"] .noticia-nao-encontrada h2 {
    color: #e2e8f0;
}

[data-theme="dark"] .noticia-nao-encontrada p {
    color: #a0aec0;
}

/* =====================================
   RESPONSIVIDADE (SEÇÃO CORRIGIDA E UNIFICADA)
   ===================================== */

/* Telas grandes (Desktop) */
@media (max-width: 1400px) {
    .container-noticia-completo {
        margin-left: 90px;
        margin-right: 15px;
    }
    
    .topo.expanded ~ .container-noticia-completo {
        margin-left: 250px;
    }
    
    .noticia-conteudo-principal {
        padding: 2.5rem;
    }
}

@media (max-width: 1200px) {
    .container-noticia-completo {
        margin-left: 85px;
        margin-right: 10px;
    }
    
    .topo.expanded ~ .container-noticia-completo {
        margin-left: 240px;
    }
    
    .noticia-conteudo-principal {
        padding: 2rem;
    }
    
    .noticia-titulo {
        font-size: 2.4rem;
    }
    
    /* Reduz ainda mais os cards em telas menores */
    .cards-noticias .card-noticia img {
        width: 70px;
        height: 50px;
    }
    
    .cards-noticias .card-content h3 {
        font-size: 0.85rem;
    }
    
    .cards-noticias .btn-card {
        font-size: 0.7rem;
        padding: 3px 8px;
    }
}

/* Telas médias (Tablets) - PONTO CRÍTICO */
@media (max-width: 1100px) {
    .container-noticia-completo {
        margin-left: 80px;
        margin-right: 8px;
    }
    
    .topo.expanded ~ .container-noticia-completo {
        margin-left: 230px;
    }
}

@media (max-width: 1024px) {
    .noticia-layout {
        grid-template-columns: 1fr; /* Muda para uma coluna */
        gap: 1.5rem;
    }
    
    .cards-noticias {
        position: static;
        margin-top: 2rem;
        order: 2; /* Garante que os cards fiquem abaixo */
    }
    
    .noticia-conteudo-principal {
        order: 1; /* Garante que a notícia fique acima */
    }
    
    /* Reverte para cards normais quando estão abaixo */
    .cards-noticias .cards-noticias-container {
        grid-template-columns: repeat(auto-fit, minmax(280px, 1fr));
        gap: 1.5rem;
    }
    
    .cards-noticias .card-noticia {
        flex-direction: column;
        align-items: stretch;
        padding: 0;
    }

    .cards-noticias .card-noticia img {
        width: 100%;
        height: 200px;
        border-radius: 12px 12px 0 0;
    }
    
    .cards-noticias .card-content {
        padding: 1.2rem;
    }
    
    .cards-noticias .card-content h3 {
        font-size: 1.1rem;
        white-space: normal;
        overflow: visible;
        text-overflow: clip;
    }
    
    .cards-noticias .card-content p {
        display: block;
        font-size: 0.9rem;
    }
    
    .cards-noticias .btn-card {
        padding: 0.6rem 1.2rem;
        font-size: 0.85rem;
        margin-top: 10px;
    }
    
    .noticia-img {
        height: 400px;
    }
}

/* Telas pequenas (Tablets pequenos) */
@media (max-width: 900px) {
    .container-noticia-completo {
        margin-left: 75px;
        margin-right: 5px;
    }
    
    .topo.expanded ~ .container-noticia-completo {
        margin-left: 75px; /* Sidebar expandida ocupa mais espaço */
    }
}

/* Telas muito pequenas (Celulares grandes) */
@media (max-width: 768px) {
    .container-noticia-completo {
        margin-left: 70px;
        margin-right: 5px;
        padding: 0 8px;
    }

    .topo.expanded ~ .container-noticia-completo {
        margin-left: 70px;
    }

    .noticia-conteudo-principal {
        padding: 2rem;
        border-radius: 16px;
    }
    
    .noticia-header {
        padding: 0 1rem;
        margin-bottom: 2rem;
    }
    
    .noticia-titulo {
        font-size: 2.2rem;
        margin: 1.5rem 0;
    }
    
    .noticia-meta {
        flex-direction: column;
        align-items: center;
        gap: 0.8rem;
    }
    
    .noticia-img {
        height: 350px;
    }
    
    .noticia-texto {
        font-size: 1.1rem;
    }
    
    /* CORREÇÃO ESPECÍFICA PARA IMAGENS E VÍDEOS NO TEXTO EM MOBILE */
    .noticia-texto img,
    .noticia-texto video,
    .noticia-texto iframe,
    .noticia-texto .video-container {
        margin: 1.5rem auto;
        border-radius: 8px;
    }
    
    .cards-noticias {
        margin: 2rem 0;
        padding: 0 0.5rem;
    }
    
    .cards-noticias h2 {
        font-size: 1.8rem;
        margin-bottom: 1.5rem;
    }
    
    /* Garante uma coluna única para os cards */
    .cards-noticias-container {
        grid-template-columns: 1fr;
        gap: 1rem;
    }
    
    .card-content h3 {
        font-size: 1.2rem;
    }
}

/* Telas muito pequenas (Celulares) */
@media (max-width: 576px) {
    .container-noticia-completo {
        margin-left: 0px;
        margin-right: 5px;
        padding: 0 5px;
    }
    
    .topo.expanded ~ .container-noticia-completo {
        margin-left: 60px;
    }
    
    .noticia-conteudo-principal {
        padding: 1.5rem;
        border-radius: 12px;
    }
    
    .noticia-titulo {
        font-size: 1.8rem;
    }
    
    .noticia-texto {
        font-size: 1rem;
    }
    
    .noticia-tags {
        flex-direction: column;
        align-items: flex-start;
        gap: 1rem;
    }
    
    .noticia-tags h2 {
        margin-bottom: 0.8rem;
        font-size: 1.3rem;
    }
    
    .noticia-user-simple {
        padding: 0.8rem 1.5rem;
        font-size: 0.9rem;
    }
    
    .cards-noticias h2 {
        font-size: 1.6rem;
    }
    
    .card-content h3 {
        font-size: 1.1rem;
    }
    
    .card-content p {
        font-size: 0.9rem;
    }
    
    /* CORREÇÃO ESPECÍFICA PARA VÍDEOS EM CELULARES */
    .noticia-texto video,
    .noticia-texto iframe {
        height: 250px !important;
    }
    
    .video-container-16-9 {
        padding-bottom: 56.25%;
    }
}

@media (max-width: 360px) {
    .cards-noticias {
        padding: 0 0.2rem;
    }
    
    .card-noticia {
        border-radius: 8px;
    }
    
    .card-content {
        padding: 1rem;
    }
    
    /* CORREÇÃO FINAL PARA VÍDEOS EM TELAS MUITO PEQUENAS */
    .noticia-texto video,
    .noticia-texto iframe {
        height: 200px !important;
    }
}

/* =====================================
   FORMULÁRIOS E INPUTS
   ===================================== */

input[type="text"],
input[type="file"],
select,
textarea {
    width: 100%;
    padding: 12px;
    border-radius: 8px;
    border: 1px solid #dcdde1;
    font-size: 1rem;
    background-color: #f9f9f9;
    margin-top: 6px;
    transition: all 0.2s ease-in-out;
}

input[type="text"]:focus,
input[type="file"]:focus,
select:focus,
textarea:focus {
    outline: none;
    border-color: #40739e;
    background-color: #fff;
    box-shadow: 0 0 0 2px rgba(64, 115, 158, 0.2);
}

label {
    font-weight: 600;
    color: #353b48;
    display: block;
    margin-top: 15px;
}

input[type="submit"] {
    display: block;
    width: 100%;
    margin-top: 25px;
    padding: 12px;
    border: none;
    border-radius: 8px;
    background-color: #40739e;
    color: white;
    font-size: 1rem;
    font-weight: 600;
    cursor: pointer;
    transition: background-color 0.3s ease;
}

input[type="submit"]:hover {
    background-color: #273c75;
}

/* =====================================
   CATEGORIAS E TABELAS
   ===================================== */

.categoria-container {
    max-width: 800px;
    background: #fff;
    margin: 60px auto;
    padding: 30px 40px;
    border-radius: 15px;
    box-shadow: 0 4px 15px rgba(0,0,0,0.1);
}

.categoria-container h1 {
    text-align: center;
    margin-bottom: 30px;
    color: #2c3e50;
}

/* Tabela de categorias */
.tabela-categorias {
    width: 100%;
    border-collapse: collapse;
    margin-top: 15px;
}

.tabela-categorias th,
.tabela-categorias td {
    border-bottom: 1px solid #e0e0e0;
    padding: 12px 10px;
    text-align: left;
}

.tabela-categorias th {
    background-color: #3498db;
    color: white;
    font-weight: 600;
    text-transform: uppercase;
    letter-spacing: 0.5px;
}

.tabela-categorias tr:hover {
    background-color: #f8f9fb;
}

/* Botão excluir */
.btn-delete {
    background-color: #e74c3c;
    color: white;
    padding: 6px 12px;
    border-radius: 6px;
    text-decoration: none;
    font-size: 14px;
    transition: 0.2s;
}

.btn-delete:hover {
    background-color: #c0392b;
}

/* Mensagem sem categorias */
.sem-categorias {
    text-align: center;
    color: #777;
    font-style: italic;
    margin-top: 20px;
}

/* =====================================
   CONTAINER NEW ADM
   ===================================== */

.container-newadm {
    background: rgba(255, 255, 255, 0.75);
    backdrop-filter: blur(8px);
    border-radius: 20px;
    box-shadow: 0 8px 24px rgba(0, 0, 0, 0.1);
    padding: 40px 90px;
    width: 100%;
    max-width: 420px;
    margin: 60px auto;
    transition: all 0.3s ease;
}

.container-newadm label {
    display: block;
    margin: 12px 0 6px;
    font-weight: 600;
    font-size: 0.95rem;
    color: #333;
    transition: color 0.3s ease;
}

.container-newadm input[type="text"],
.container-newadm input[type="email"],
.container-newadm input[type="password"] {
    width: 100%;
    padding: 12px;
    border-radius: 10px;
    border: 1px solid #ccc;
    font-size: 0.95rem;
    background-color: #fff;
    box-sizing: border-box;
    transition: all 0.3s ease;
    color: #333;
}

.container-newadm input[type="text"]:focus,
.container-newadm input[type="email"]:focus,
.container-newadm input[type="password"]:focus {
    border-color: #0096c7;
    box-shadow: 0 0 5px rgba(0, 150, 199, 0.3);
    outline: none;
}

.container-newadm input[type="submit"] {
    margin-top: 20px;
    background: linear-gradient(90deg, #0096c7, #00b4d8);
    color: white;
    border: none;
    padding: 12px 0;
    border-radius: 10px;
    font-size: 1rem;
    font-weight: 600;
    cursor: pointer;
    width: 100%;
    box-shadow: 0 3px 8px rgba(0, 150, 199, 0.3);
    transition: all 0.3s ease;
}

.container-newadm input[type="submit"]:hover {
    background: linear-gradient(90deg, #00a8e8, #48cae4);
    transform: translateY(-2px);
}

/* Modo escuro */
[data-theme="dark"] .container-newadm {
    background: rgba(45, 55, 72, 0.75);
    backdrop-filter: blur(8px);
    box-shadow: 0 8px 24px rgba(0, 0, 0, 0.3);
}

[data-theme="dark"] .container-newadm label {
    color: #e2e8f0;
}

[data-theme="dark"] .container-newadm input[type="text"],
[data-theme="dark"] .container-newadm input[type="email"],
[data-theme="dark"] .container-newadm input[type="password"] {
    background-color: #2d3748;
    border: 1px solid #4a5568;
    color: #e2e8f0;
}

[data-theme="dark"] .container-newadm input[type="text"]:focus,
[data-theme="dark"] .container-newadm input[type="email"]:focus,
[data-theme="dark"] .container-newadm input[type="password"]:focus {
    border-color: #4299e1;
    box-shadow: 0 0 5px rgba(66, 153, 225, 0.4);
    background-color: #2d3748;
}

[data-theme="dark"] .container-newadm input[type="submit"] {
    background: linear-gradient(90deg, #4299e1, #63b3ed);
    box-shadow: 0 3px 8px rgba(66, 153, 225, 0.4);
}

[data-theme="dark"] .container-newadm input[type="submit"]:hover {
    background: linear-gradient(90deg, #3182ce, #90cdf4);
}

/* Placeholder para modo escuro */
[data-theme="dark"] .container-newadm input::placeholder {
    color: #a0aec0;
    opacity: 0.7;
}

/* =====================================
   FOOTER
   ===================================== */

footer {
    background: #ffffffcc;
    backdrop-filter: blur(8px);
    border-top: 2px solid rgba(0,0,0,0.05);
    padding: 20px 0;
    text-align: center;
    font-size: 0.9rem;
    color: #222a3a;
    position: relative;
    width: 100%;
    box-shadow: 0 -2px 8px rgba(25, 125, 255, 0.1);
    margin-top: auto;
}

footer .container-rodape {
    max-width: 1100px;
    margin: 0 auto;
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 10px;
}

footer a {
    color: #1a4cff;
    text-decoration: none;
    margin: 0 5px;
    transition: color 0.2s;
}

footer a:hover {
    color: #0d2a7a;
}

footer .social-icons i {
    font-size: 1.2rem;
    margin: 0 8px;
}

/* Ajuste para sidebar expandida */
body.sidebar-expanded footer {
    padding-left: 250px;
}


/* =====================================
   ESTILOS PARA PÁGINAS DE LOCAIS INTERNOS
   ===================================== */

.section-intro-local, .section-historia, .section-visita, .section-mapa {
    margin: 40px 0;
}

.subsection-title {
    font-size: 1.5rem;
    color: #1a4cff; /* Cor primária para subtítulos */
    margin-top: 20px;
    margin-bottom: 15px;
    border-bottom: 2px solid rgba(26, 76, 255, 0.2);
    padding-bottom: 5px;
}

/* Layout de duas colunas para informações de visita */
.info-columns {
    display: flex;
    gap: 30px;
    margin-top: 20px;
}

.info-columns .column {
    flex: 1; /* Faz as duas colunas terem o mesmo tamanho */
}

/* Ajuste para o carrossel nesta página (Reutiliza classes existentes, mas garante margem) */
.local-carrossel {
    margin: 30px auto 50px auto;
    max-width: 900px; /* Um pouco menor para dar destaque ao conteúdo */
}

/* Media Query para responsividade das colunas */
@media (max-width: 768px) {
    .info-columns {
        flex-direction: column; /* Colunas empilham em telas menores */
    }
}

@media (max-width: 1000px) {
    /* Responsividade do Carrossel */
    .slide {
        flex: 0 0 calc((100% - 20px) / 2); /* 2 visíveis em tablets */
        min-height: 250px;
    }
    .slide img {
        height: 160px;
    }
}

@media (max-width: 768px) {
    .container {
        padding: 20px 10px;
    }
    
    .btn-voltar {
        position: relative;
        left: auto;
        top: auto;
        margin-bottom: 20px;
        width: 100%;
    }
    
    .section-title {
        font-size: 1.8rem;
    }

    .tabs-pag {
        flex-direction: column;
        gap: 8px;
    }

    .tablinks {
        padding: 10px 12px;
        flex-grow: 1;
        width: 100%;
    }

    .gastronomia-list {
        grid-template-columns: 1fr; /* Uma coluna no mobile */
        gap: 15px;
    }

    .slide {
        flex: 0 0 100%; /* 1 por vez no mobile */
        min-height: 220px;
    }
    .slide img {
        height: 140px;
    }

    /* Outras seções */
    .container-noticias .noticia {
        padding: 35px 25px;
        border-radius: 18px;
    }

    .container-noticias .noticia h1 {
        font-size: 2rem;
    }

    .container-noticias .noticia p {
        font-size: 1.05rem;
    }

    .container-newadm {
        padding: 30px 35px;
    }
}

@media (max-width: 900px) {
    .container-noticias {
        padding: 12px 2vw;
    }

    .container-noticias .noticia {
        padding: 18px 10px 18px 10px;
        max-width: 99vw;
    }

    .container-noticias .noticia h1 {
        font-size: 1.4rem;
    }

    .container-noticias .noticia img {
        max-height: 180px;
    }

    .container-noticias > .link-destaque {
        width: 100%;
        padding: 10px 0;
        max-width: none;
        margin: 18px 0 0 0;
        text-align: center;
    }
}

/* =====================================
   ESTILOS ESPECÍFICOS PARA ECOTURISMO
   ===================================== */

/* Container principal do ecoturismo */
.eco-container {
    max-width: 1200px;
    margin: 0 auto;
    padding: 20px;
}

/* Hero section */
.eco-hero {
    text-align: center;
    padding: 3rem 0 2rem 0;
    background: linear-gradient(135deg, rgba(22, 160, 133, 0.1), rgba(26, 188, 156, 0.1));
    border-radius: 20px;
    margin-bottom: 3rem;
}

.eco-intro {
    font-size: 1.2rem !important;
    color: #2c3e50 !important;
    max-width: 800px;
    margin: 0 auto 2rem auto;
    line-height: 1.7;
}

.eco-badges {
    display: flex;
    justify-content: center;
    gap: 1rem;
    margin: 2rem 0 1rem 0;
    flex-wrap: wrap;
}

.eco-badge {
    background: linear-gradient(135deg, #16a085, #1abc9c);
    color: white;
    padding: 0.75rem 1.5rem;
    border-radius: 25px;
    font-weight: 600;
    font-size: 0.95rem;
    display: flex;
    align-items: center;
    gap: 0.5rem;
    box-shadow: 0 4px 12px rgba(22, 160, 133, 0.3);
    transition: transform 0.3s ease, box-shadow 0.3s ease;
}

.eco-badge:hover {
    transform: translateY(-2px);
    box-shadow: 0 6px 16px rgba(22, 160, 133, 0.4);
}

.eco-badge i {
    font-size: 1.1rem;
}

/* Seções */
.eco-section {
    margin: 4rem 0;
    padding: 2.5rem;
    border-radius: 20px;
    background: rgba(255, 255, 255, 0.95);
    backdrop-filter: blur(10px);
    box-shadow: 0 8px 32px rgba(0, 0, 0, 0.1);
    border: 1px solid rgba(255, 255, 255, 0.2);
}

.section-header {
    display: flex;
    align-items: center;
    gap: 1rem;
    margin-bottom: 2rem;
    padding-bottom: 1rem;
    border-bottom: 2px solid rgba(22, 160, 133, 0.2);
}

.section-icon {
    font-size: 2rem;
    color: #16a085;
    background: rgba(22, 160, 133, 0.1);
    padding: 0.75rem;
    border-radius: 12px;
    width: 60px;
    height: 60px;
    display: flex;
    align-items: center;
    justify-content: center;
}

.section-icon-warning {
    font-size: 2rem;
    color: #a04d16;
    background: rgba(22, 160, 133, 0.1);
    padding: 0.75rem;
    border-radius: 12px;
    width: 60px;
    height: 60px;
    display: flex;
    align-items: center;
    justify-content: center;
}

/* Títulos temáticos - CORRIGIDOS E REMOVIDA A ESTRELA */
.title-green {
    color: #16a085 !important;
    font-size: 2.5rem !important;
    font-weight: 800 !important;
    margin: 0 !important;
    position: relative;
}

.title-green::before {
    display: none !important; /* Remove a estrelinha */
}

.title-green-light {
    color: #1abc9c !important;
    font-size: 1.5rem !important;
    font-weight: 700 !important;
    margin: 1.5rem 0 1rem 0 !important;
}

.title-blue {
    color: #1a4cff !important;
    font-size: 2.2rem !important;
    font-weight: 800 !important;
    margin: 0 !important;
    position: relative;
}

.title-blue::before {
    display: none !important; /* Remove a estrelinha */
}

.title-warning {
    color: #e8491d !important;
    font-size: 2.2rem !important;
    font-weight: 800 !important;
    margin: 0 !important;
    position: relative;
}

.title-warning::before {
    display: none !important; /* Remove a estrelinha */
}

/* Section title específico para ecoturismo - SEM ESTRELA */
.eco-section .section-title {
    font-size: 2.2rem !important;
    font-weight: 800 !important;
    margin: 0 !important;
    position: relative;
}

.eco-section .section-title::before {
    display: none !important; /* Remove completamente a estrelinha */
}

/* Seções com destaque */
.section-highlight {
    background: linear-gradient(135deg, rgba(234, 245, 245, 0.9), rgba(224, 242, 241, 0.9));
    border-left: 6px solid #1a4cff;
    position: relative;
    overflow: hidden;
}

.section-highlight::before {
    content: '';
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background: url('data:image/svg+xml,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 100 100" fill="%2316a085" opacity="0.05"><path d="M20,20 Q40,10 60,20 T100,20 L100,80 Q80,90 60,80 T20,80 Z"/></svg>');
    background-size: cover;
}

.section-highlight-secondary {
    border: 2px solid rgba(22, 160, 133, 0.3);
    position: relative;
}

/* Cards de projeto */
.project-card {
    background: white;
    padding: 2rem;
    border-radius: 16px;
    box-shadow: 0 6px 20px rgba(0,0,0,0.08);
    height: 100%;
    border: 1px solid rgba(0, 0, 0, 0.05);
    transition: transform 0.3s ease, box-shadow 0.3s ease, border-color 0.3s ease;
    position: relative;
    overflow: hidden;
}

.project-card::before {
    content: '';
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 4px;
    background: linear-gradient(90deg, #16a085, #1abc9c);
}

.project-card:hover {
    transform: translateY(-5px);
    box-shadow: 0 12px 30px rgba(0,0,0,0.15);
}

.argonauta-card {
    border-left: 0px 0px 0px 4px solid #1a4cff;
}

.argonauta-card::before {
    background: linear-gradient(90deg, #1a4cff, #00b4d8);
}

/* Colunas ecológicas */
.eco-columns {
    display: flex;
    gap: 2rem;
    margin: 2rem 0;
}

.eco-column {
    flex: 1;
}

/* Links ecológicos */
.eco-link {
    display: inline-flex;
    align-items: center;
    gap: 0.5rem;
    margin: 0.5rem 0;
    color: #1a4cff;
    text-decoration: none;
    font-weight: 600;
    padding: 0.75rem 1.5rem;
    background: rgba(26, 76, 255, 0.1);
    border-radius: 8px;
    transition: all 0.3s ease;
}

.eco-link:hover {
    background: rgba(26, 76, 255, 0.2);
    color: #0d2a7a;
    text-decoration: none;
    transform: translateX(5px);
}

/* Info cards */
.info-card {
    background: white;
    padding: 1.5rem;
    border-radius: 12px;
    box-shadow: 0 4px 12px rgba(0,0,0,0.1);
    margin: 1.5rem 0;
    border-left: 4px solid #16a085;
}

/* Grid de decomposição */
.decomposition-grid {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(280px, 1fr));
    gap: 1.2rem;
    margin: 2.5rem 0;
}

.decomposition-item {
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding: 1.2rem 1.5rem;
    background: white;
    border-radius: 12px;
    box-shadow: 0 4px 12px rgba(0,0,0,0.08);
    transition: all 0.3s ease;
    border-left: 6px solid #16a085;
}

.decomposition-item:hover {
    transform: translateY(-3px);
    box-shadow: 0 8px 20px rgba(0,0,0,0.12);
}

.decomp-material {
    font-weight: 700;
    font-size: 1.1rem;
    display: flex;
    align-items: center;
    gap: 0.75rem;
}

.decomp-material i {
    font-size: 1.3rem;
    width: 30px;
    text-align: center;
}

.decomp-time {
    color: #666;
    font-size: 1rem;
    font-weight: 600;
    background: rgba(0, 0, 0, 0.05);
    padding: 0.4rem 0.8rem;
    border-radius: 6px;
}

/* Cores de status para decomposição */
.item-short {
    border-left-color: #27ae60;
    background: linear-gradient(135deg, #f0f9f0, #e8f5e8);
}

.item-medium {
    border-left-color: #f39c12;
    background: linear-gradient(135deg, #fef9e7, #fcf3cf);
}

.item-long {
    border-left-color: #e74c3c;
    background: linear-gradient(135deg, #fdedec, #fadbd8);
}

.item-vlong {
    border-left-color: #c0392b;
    background: linear-gradient(135deg, #f9ebea, #f2d7d5);
}

.item-eternal {
    border-left-color: #7d3c98;
    background: linear-gradient(135deg, #f4ecf7, #e8daef);
}

/* Features sustentáveis */
.sustainable-features {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(220px, 1fr));
    gap: 1.2rem;
    margin: 2rem 0;
}

.feature-item {
    display: flex;
    align-items: center;
    gap: 1rem;
    padding: 1.2rem;
    background: linear-gradient(135deg, #f8f9fa, #e9ecef);
    border-radius: 12px;
    transition: all 0.3s ease;
    border: 1px solid rgba(0, 0, 0, 0.05);
}

.feature-item:hover {
    background: linear-gradient(135deg, #e3f2fd, #bbdefb);
    transform: translateY(-2px);
    box-shadow: 0 4px 12px rgba(0,0,0,0.1);
}

.feature-item i {
    font-size: 1.5rem;
    color: #16a085;
    width: 30px;
    text-align: center;
}

/* Callout final */
.eco-callout {
    background: linear-gradient(135deg, #e8f5e8, #d4edda);
    padding: 2rem;
    border-radius: 16px;
    text-align: center;
    margin-top: 3rem;
    border-left: 6px solid #28a745;
    position: relative;
    overflow: hidden;
}

.eco-callout::before {
    content: '';
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background: url('data:image/svg+xml,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 100 100" fill="%2328a745" opacity="0.05"><path d="M50,10 C70,20 80,40 70,60 C60,80 40,80 30,60 C20,40 30,20 50,10 Z"/><path d="M40,20 C60,30 70,50 60,70 C50,90 30,90 20,70 C10,50 20,30 40,20 Z" transform="translate(30,20) scale(0.7)"/></svg>');
    background-size: cover;
}

.eco-callout i {
    font-size: 3rem;
    color: #28a745;
    margin-bottom: 1rem;
    display: block;
}

.eco-callout p {
    font-size: 1.3rem;
    font-weight: 600;
    color: #155724;
    margin: 0;
    position: relative;
    z-index: 2;
}

/* Carrossel ecológico */
.eco-carousel .carousel-caption {
    background: rgba(22, 160, 133, 0.9);
    color: white;
    padding: 1rem;
    font-size: 1rem;
    font-weight: 600;
    display: flex;
    align-items: center;
    gap: 0.5rem;
    justify-content: center;
}

.eco-carousel .carousel-caption i {
    font-size: 1.2rem;
}

/* Textos auxiliares */
.small-text {
    font-size: 0.95rem !important;
    color: #666 !important;
    font-style: italic;
}

.eco-alert {
    background: linear-gradient(135deg, #ffeaa7, #fab1a0);
    padding: 1.5rem;
    border-radius: 12px;
    border-left: 4px solid #e8491d;
    font-weight: 600;
    color: #d63031;
    text-align: center;
}

.ong-name {
    color: #16a085;
    font-weight: 700;
    background: rgba(22, 160, 133, 0.1);
    padding: 0.2rem 0.5rem;
    border-radius: 4px;
}

/* Mapa section */
.map-section {
    margin-top: 2.5rem;
}

.map-section h3 {
    text-align: center;
    margin-bottom: 1.5rem;
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 0.75rem;
}

.map-responsive {
    border-radius: 16px;
    overflow: hidden;
    box-shadow: 0 8px 25px rgba(0,0,0,0.15);
}

/* Subsection title para ecoturismo */
.subsection-title {
    font-size: 1.5rem !important;
    color: #1abc9c !important;
    margin: 1.5rem 0 1rem 0 !important;
    font-weight: 700 !important;
    display: flex;
    align-items: center;
    gap: 0.75rem;
}

.subsection-title i {
    font-size: 1.3rem;
    color: #16a085;
}

/* Responsividade */
@media (max-width: 768px) {
    .eco-container {
        padding: 15px;
    }
    
    .eco-hero {
        padding: 2rem 1rem;
    }
    
    .eco-section {
        margin: 2.5rem 0;
        padding: 1.5rem;
    }
    
    .section-header {
        flex-direction: column;
        text-align: center;
        gap: 0.75rem;
    }
    
    .section-icon {
        width: 50px;
        height: 50px;
        font-size: 1.5rem;
    }
    
    .eco-columns {
        flex-direction: column;
        gap: 1.5rem;
    }
    
    .decomposition-grid {
        grid-template-columns: 1fr;
        gap: 1rem;
    }
    
    .sustainable-features {
        grid-template-columns: 1fr;
        gap: 1rem;
    }
    
    .eco-badges {
        flex-direction: column;
        align-items: center;
        gap: 0.75rem;
    }
    
    .eco-badge {
        width: 100%;
        max-width: 250px;
        justify-content: center;
    }
    
    .title-green,
    .title-blue,
    .title-warning,
    .eco-section .section-title {
        font-size: 1.8rem !important;
        text-align: center;
    }
    
    .project-card {
        padding: 1.5rem;
    }
    
    .decomposition-item {
        flex-direction: column;
        gap: 0.75rem;
        text-align: center;
    }
    
    .decomp-material {
        justify-content: center;
    }
    
    .subsection-title {
        font-size: 1.3rem !important;
        justify-content: center;
        text-align: center;
    }
}

@media (max-width: 480px) {
    .eco-section {
        padding: 1rem;
    }
    
    .eco-hero {
        padding: 1.5rem 1rem;
    }
    
    .title-green,
    .title-blue,
    .title-warning,
    .eco-section .section-title {
        font-size: 1.6rem !important;
    }
    
    .eco-callout {
        padding: 1.5rem;
    }
    
    .eco-callout p {
        font-size: 1.1rem;
    }
    
    .subsection-title {
        font-size: 1.2rem !important;
    }
}

/* =====================================
   SEÇÃO BORBOLETAS AZUIS
   ===================================== */

.butterflies-section {
    background: linear-gradient(135deg, rgba(173, 216, 230, 0.15), rgba(135, 206, 250, 0.15));
    border-left: 6px solid #1a4cff;
    position: relative;
    overflow: hidden;
    padding: 3rem 0; /* Adicionado padding vertical para melhor espaçamento */
    margin: 2rem 0; /* Margem externa para separação de seções */
}

.butterflies-section::before {
    content: '';
    position: absolute;
    top: -50px;
    right: -50px;
    width: 250px;
    height: 250px;
    background: url('data:image/svg+xml,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 100 100" fill="%231a4cff" opacity="0.08"><path d="M50,10 C70,20 80,40 70,60 C60,80 40,80 30,60 C20,40 30,20 50,10 Z"/><path d="M40,20 C60,30 70,50 60,70 C50,90 30,90 20,70 C10,50 20,30 40,20 Z" transform="translate(30,20) scale(0.7)"/></svg>');
    background-size: contain;
    background-repeat: no-repeat;
    opacity: 0.4;
    animation: float 6s ease-in-out infinite; /* Adicionada animação sutil de flutuação */
}

@keyframes float {
    0% { transform: translateY(0); }
    50% { transform: translateY(-20px); }
    100% { transform: translateY(0); }
}

.butterflies-intro {
    text-align: center;
    margin-bottom: 3rem;
    padding: 0 2.5rem;
    max-width: 800px;
    margin-left: auto;
    margin-right: auto; /* Centralizado para melhor leitura */
}

.butterflies-columns {
    display: flex;
    gap: 2.5rem;
    margin: 3rem 0;
    justify-content: center; /* Centralizado as colunas */
}

.butterflies-column {
    flex: 1;
    max-width: 450px; /* Limite de largura para colunas em telas grandes */
}

.butterflies-card {
    background: white;
    padding: 2.5rem;
    border-radius: 20px;
    box-shadow: 0 8px 25px rgba(0,0,0,0.1);
    height: 100%;
    border: 1px solid rgba(26, 76, 255, 0.15);
    transition: transform 0.4s ease, box-shadow 0.4s ease, border-color 0.4s ease;
    position: relative;
    overflow: hidden;
}

.butterflies-card::before {
    content: '';
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 5px;
    background: linear-gradient(90deg, #1a4cff, #00b4d8, #1a4cff);
    background-size: 200% 100%;
    animation: gradient-shift 3s linear infinite; /* Animação no gradiente para efeito dinâmico */
}

@keyframes gradient-shift {
    0% { background-position: 0% 50%; }
    100% { background-position: 200% 50%; }
}

.butterflies-card:hover {
    transform: translateY(-8px) rotate(1deg); /* Adicionado leve rotação para efeito "voo" */
    box-shadow: 0 15px 35px rgba(26, 76, 255, 0.2);
}

.butterflies-list {
    list-style: none;
    padding: 0;
    margin: 2rem 0 0 0;
}

.butterflies-list li {
    padding: 1rem 0;
    border-bottom: 1px dashed rgba(0,0,0,0.1); /* Mudado para dashed para visual mais leve */
    display: flex;
    align-items: center;
    transition: color 0.3s ease;
}

.butterflies-list li:hover {
    color: #00b4d8; /* Mudança de cor ao hover para interatividade */
}

.butterflies-list li:last-child {
    border-bottom: none;
}

.butterflies-list li::before {
    content: '🦋'; /* Mudado para emoji de borboleta para tema mais relevante */
    margin-right: 1rem;
    font-size: 1.2rem;
    color: #1a4cff;
}

.butterflies-habitat {
    background: rgba(255, 255, 255, 0.8);
    padding: 2.5rem;
    border-radius: 20px;
    margin-top: 3rem;
    border: 1px solid rgba(26, 76, 255, 0.25);
    box-shadow: 0 4px 15px rgba(26, 76, 255, 0.1); /* Adicionado sombra suave */
}

.habitat-features {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(240px, 1fr));
    gap: 1.5rem;
    margin: 2.5rem 0 0 0;
}

.habitat-item {
    display: flex;
    align-items: center;
    gap: 1.2rem;
    padding: 1.5rem;
    background: linear-gradient(135deg, #e3f2fd, #bbdefb);
    border-radius: 14px;
    transition: all 0.4s ease;
    border: 1px solid rgba(26, 76, 255, 0.15);
}

.habitat-item:hover {
    background: linear-gradient(135deg, #90caf9, #64b5f6);
    transform: translateY(-4px) scale(1.02); /* Escala leve para zoom ao hover */
    box-shadow: 0 6px 15px rgba(26, 76, 255, 0.25);
}

.habitat-item i {
    font-size: 1.8rem;
    color: #1a4cff;
    width: 35px;
    text-align: center;
    transition: transform 0.3s ease;
}

.habitat-item:hover i {
    transform: rotate(15deg); /* Rotação no ícone para dinamismo */
}

.habitat-item span {
    font-weight: 700;
    color: #1a4cff;
}

/* Títulos específicos para borboletas */
.title-blue-light {
    color: #00b4d8 !important;
    font-size: 1.6rem !important;
    font-weight: 700 !important;
    margin: 2rem 0 1.2rem 0 !important;
    text-shadow: 0 1px 2px rgba(0,0,0,0.05); /* Adicionado sombra no texto para destaque */
}

/* Responsividade para seção de borboletas */
@media (max-width: 768px) {
    .butterflies-columns {
        flex-direction: column;
        gap: 2rem;
    }
    
    .butterflies-card {
        padding: 2rem;
    }
    
    .butterflies-intro {
        padding: 0 1.5rem;
    }
    
    .butterflies-habitat {
        padding: 2rem;
    }
    
    .habitat-features {
        grid-template-columns: 1fr;
        gap: 1.2rem;
    }
    
    .butterflies-section::before {
        width: 150px;
        height: 150px;
        top: -30px;
        right: -30px;
    }
}

@media (max-width: 480px) {
    .butterflies-card {
        padding: 1.5rem;
    }
    
    .butterflies-habitat {
        padding: 1.5rem;
    }
    
    .butterflies-list li {
        padding: 0.8rem 0;
        font-size: 1rem;
    }
    
    .habitat-item {
        padding: 1.2rem;
        gap: 1rem;
    }
    
    .habitat-item i {
        font-size: 1.5rem;
    }
}

/* =====================================
   CARDS DE NOTÍCIAS (DIREITA DO SITE)
   ===================================== */

.cards-noticias {
    position: absolute;
    top: 100px;
    right: 40px;
    width: 320px;
    background: #ffffffcc;
    backdrop-filter: blur(8px);
    border-radius: 16px;
    box-shadow: 0 6px 20px rgba(0, 0, 0, 0.12);
    padding: 20px;
    display: flex;
    flex-direction: column;
    gap: 18px;
    z-index: 90;
}

.cards-noticias h2 {
    font-size: 1.4rem;
    font-weight: 800;
    color: #1746ff;
    text-align: center;
    margin-bottom: 8px;
}

.card-noticia {
    background: #fff;
    border-radius: 14px;
    overflow: hidden;
    box-shadow: 0 4px 14px rgba(0,0,0,0.08);
    display: flex;
    flex-direction: column;
    transition: transform 0.25s ease, box-shadow 0.25s ease;
}

.card-noticia:hover {
    transform: translateY(-5px);
    box-shadow: 0 6px 20px rgba(23,70,255,0.15);
}

.card-noticia img {
    width: 100%;
    height: 150px;
    object-fit: cover;
}

.card-content {
    padding: 14px;
    text-align: left;
}

.card-content h3 {
    font-size: 1.1rem;
    color: #1746ff;
    margin-bottom: 8px;
    font-weight: 700;
}

.card-content p {
    font-size: 0.95rem;
    color: #333;
    line-height: 1.4;
    margin-bottom: 10px;
}

.btn-card {
    display: inline-block;
    text-decoration: none;
    color: #fff;
    background: linear-gradient(90deg, #1746ff, #2f7df6);
    padding: 6px 12px;
    border-radius: 8px;
    font-weight: 600;
    font-size: 0.9rem;
    transition: background 0.3s, transform 0.2s;
}

.btn-card:hover {
    background: linear-gradient(90deg, #3165ff, #4b8bff);
    transform: translateY(-1px);
}

.sem-noticias {
    text-align: center;
    color: #666;
    font-style: italic;
    margin-top: 10px;
}

/* Responsivo - Em telas menores, esconde os cards e expande o conteúdo principal */
@media (max-width: 1200px) {
    .cards-noticias {
        display: none;
    }

    main {
    margin-right: 0;
    padding: 0;
    }
}



/* =====================================
   PÁGINAS DE CATEGORIAS (PRAIAS, ILHAS, TRILHAS, JORNAL, Cultura e Eventos)
   ===================================== */

/* Container principal das categorias */
.categoria-page-container {
    max-width: 1100px;
    margin: 0 auto;
    padding: 0.8rem;
    min-height: 100vh;
    background: #f5f6f8;
    box-sizing: border-box;
}

/* Cabeçalho da página de categoria */
.categoria-header {
    text-align: center;
    margin-bottom: 1.5rem;
    padding: 0 0.8rem;
}

.categoria-title {
    font-size: 1.7rem;
    color: #0e2f2f;
    margin: 0.8rem 0 0.4rem 0;
    font-weight: 600;
}

/* ===== MODO ESCURO PARA CATEGORIAS ===== */
[data-theme="dark"] .categoria-page-container {
    background: var(--bg-primary) !important;
}

[data-theme="dark"] .categoria-title {
    color: var(--accent-primary) !important;
}

[data-theme="dark"] .categoria-header {
    color: var(--text-primary) !important;
}

.categoria-subtitle {
    font-size: 1rem;
    color: #555;
    max-width: 500px;
    margin: 0 auto;
    line-height: 1.4;
}

/* ===== TAGS/BADGES ===== */
.categoria-badges {
    display: flex;
    flex-wrap: wrap;
    gap: 0.4rem;
    margin-bottom: 0.8rem;
}

.badge-tipo,
.badge-subtipo,
.badge-regiao {
    padding: 0.3rem 0.6rem;
    border-radius: 4px;
    font-size: 0.7rem;
    font-weight: 600;
    text-transform: uppercase;
    letter-spacing: 0.3px;
}

.badge-tipo {
    background: rgba(0, 168, 150, 0.1);
    color: #00796b;
    border: 1px solid rgba(0, 168, 150, 0.2);
}

.badge-subtipo {
    background: rgba(33, 150, 243, 0.1);
    color: #1565c0;
    border: 1px solid rgba(33, 150, 243, 0.2);
}

.badge-regiao {
    background: rgba(156, 39, 176, 0.1);
    color: #7b1fa2;
    border: 1px solid rgba(156, 39, 176, 0.2);
}

/* Modo escuro para badges */
[data-theme="dark"] .badge-tipo {
    background: rgba(0, 168, 150, 0.2);
    color: #4db6ac;
    border-color: rgba(0, 168, 150, 0.3);
}

[data-theme="dark"] .badge-subtipo {
    background: rgba(33, 150, 243, 0.2);
    color: #64b5f6;
    border-color: rgba(33, 150, 243, 0.3);
}

[data-theme="dark"] .badge-regiao {
    background: rgba(156, 39, 176, 0.2);
    color: #ba68c8;
    border-color: rgba(156, 39, 176, 0.3);
}

/* Grid de notícias da categoria */
.categoria-grid {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(250px, 1fr));
    gap: 1.2rem;
    margin-top: 0.8rem;
}

/* Item de notícia da categoria */
.categoria-item {
    background: white;
    border-radius: 10px;
    overflow: hidden;
    box-shadow: 0 2px 8px rgba(0,0,0,0.06);
    transition: all 0.2s ease;
    display: flex;
    flex-direction: column;
    border: 1px solid #e8e8e8;
}

.categoria-item:hover {
    transform: translateY(-3px);
    box-shadow: 0 4px 12px rgba(0,0,0,0.1);
}

/* Link do item */
.categoria-link {
    text-decoration: none;
    color: inherit;
    display: flex;
    flex-direction: column;
    height: 100%;
}

/* Container e imagem */
.categoria-image-container {
    width: 100%;
    height: 150px;
    overflow: hidden;
}

.categoria-image {
    width: 100%;
    height: 100%;
    object-fit: cover;
    display: block;
    transition: transform 0.2s ease;
}

.categoria-item:hover .categoria-image {
    transform: scale(1.03);
}

/* Conteúdo do item */
.categoria-content {
    padding: 1rem;
    display: flex;
    flex-direction: column;
    flex-grow: 1;
}

.categoria-item-title {
    font-size: 1rem;
    color: #004d40;
    margin-bottom: 0.5rem;
    line-height: 1.3;
    font-weight: 600;
}

/* ===== MODO ESCURO PARA NOTÍCIAS DE CATEGORIA ===== */
[data-theme="dark"] .categoria-item {
    background: var(--card-bg) !important;
    border: 1px solid var(--border-color) !important;
    box-shadow: 0 2px 8px var(--shadow-light);
}

[data-theme="dark"] .categoria-item-title {
    color: var(--accent-primary) !important;
}

[data-theme="dark"] .categoria-content {
    color: var(--text-primary) !important;
}

.categoria-excerpt {
    color: #444;
    line-height: 1.4;
    margin-bottom: 0.8rem;
    flex-grow: 1;
    font-size: 0.85rem;
    display: -webkit-box;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
    overflow: hidden;
}

[data-theme="dark"] .categoria-excerpt {
    color: var(--text-primary) !important;
}

/* ===== FILTROS COM CORES VIBRANTES ===== */
.filtros-container {
    background: rgba(255, 255, 255, 0.9);
    backdrop-filter: blur(10px);
    padding: 0.8rem 1.2rem;
    border-radius: 10px;
    margin-bottom: 1.5rem;
    border: 1px solid rgba(0, 168, 150, 0.2);
    box-shadow: 0 4px 12px rgba(0, 168, 150, 0.1);
    transition: all 0.3s ease;
    width: fit-content;
    margin-left: auto;
    max-width: 500px;
}

.filtros-container:hover {
    box-shadow: 0 6px 20px rgba(0, 168, 150, 0.15);
    transform: translateY(-2px);
}

.filtros-header {
    margin-bottom: 0.6rem;
    text-align: right;
}

.filtros-label {
    font-size: 0.75rem;
    color: #00796b;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: 0.5px;
}

.filtros-form {
    display: flex;
    gap: 0.6rem;
    flex-wrap: nowrap;
    align-items: center;
    justify-content: flex-end;
}

/* Grupo dos selects */
.filtro-group {
    display: flex;
    align-items: center;
}

/* Selects com cores */
.filtro-select {
    padding: 0.5rem 1.8rem 0.5rem 0.8rem;
    border: 1px solid #00a896;
    border-radius: 8px;
    background: linear-gradient(to bottom, #ffffff, #f8fdff);
    font-size: 0.8rem;
    color: #00796b;
    min-width: 140px;
    max-width: 160px;
    appearance: none;
    transition: all 0.2s ease;
    font-weight: 500;
}

.filtro-select:hover {
    border-color: #00796b;
    background: linear-gradient(to bottom, #f0fffd, #e8f8f6);
    box-shadow: 0 2px 6px rgba(0, 168, 150, 0.2);
}

.filtro-select:focus {
    outline: none;
    border-color: #00796b;
    box-shadow: 0 0 0 3px rgba(0, 168, 150, 0.2);
}

/* Botão limpar com cor */
.btn-limpar {
    padding: 0.5rem 1rem;
    background: linear-gradient(135deg, #00a896, #00796b);
    color: white;
    border: none;
    border-radius: 8px;
    cursor: pointer;
    font-size: 0.8rem;
    font-weight: 600;
    transition: all 0.2s ease;
    white-space: nowrap;
    box-shadow: 0 2px 4px rgba(0, 168, 150, 0.3);
}

.btn-limpar:hover {
    background: linear-gradient(135deg, #00796b, #005a4f);
    transform: translateY(-1px);
    box-shadow: 0 4px 8px rgba(0, 168, 150, 0.4);
}

.btn-limpar:active {
    transform: translateY(0);
    box-shadow: 0 1px 2px rgba(0, 168, 150, 0.3);
}

/* ===== MODO ESCURO PARA FILTROS ===== */
[data-theme="dark"] .filtros-container {
    background: rgba(30, 30, 30, 0.9);
    border: 1px solid rgba(0, 168, 150, 0.4);
    box-shadow: 0 4px 12px rgba(0, 168, 150, 0.2);
}

[data-theme="dark"] .filtros-label {
    color: #4db6ac;
}

[data-theme="dark"] .filtro-select {
    background: rgba(45, 45, 45, 0.9);
    border-color: rgba(0, 168, 150, 0.6);
    color: #4db6ac;
}

[data-theme="dark"] .filtro-select:hover {
    border-color: #4db6ac;
    background: rgba(0, 168, 150, 0.1);
    box-shadow: 0 2px 6px rgba(0, 168, 150, 0.3);
}

[data-theme="dark"] .filtro-select:focus {
    border-color: #4db6ac;
    box-shadow: 0 0 0 3px rgba(0, 168, 150, 0.3);
}

[data-theme="dark"] .btn-limpar {
    background: linear-gradient(135deg, #00796b, #005a4f);
    box-shadow: 0 2px 4px rgba(0, 168, 150, 0.4);
}

[data-theme="dark"] .btn-limpar:hover {
    background: linear-gradient(135deg, #005a4f, #00433a);
    box-shadow: 0 4px 8px rgba(0, 168, 150, 0.5);
}

/* ===== RESPONSIVIDADE ===== */
@media (max-width: 768px) {
    .filtros-container {
        width: 100%;
        max-width: none;
        margin-left: 0;
    }
    
    .filtros-header {
        text-align: center;
    }
    
    .filtros-form {
        flex-wrap: wrap;
        justify-content: center;
        gap: 0.5rem;
    }
    
    .filtro-select {
        min-width: 120px;
        max-width: 140px;
    }
}

@media (max-width: 576px) {
    .filtros-container {
        padding: 0.6rem 0.8rem;
    }
    
    .filtros-form {
        flex-direction: column;
        align-items: stretch;
    }
    
    .filtro-select {
        min-width: auto;
        max-width: none;
        width: 100%;
    }
    
    .btn-limpar {
        width: 100%;
        padding: 0.6rem;
    }
}

/* Meta informações */
.categoria-meta {
    display: flex;
    justify-content: space-between;
    align-items: center;
    margin-top: auto;
    padding-top: 0.6rem;
    border-top: 1px solid #f0f0f0;
}

.categoria-date {
    font-size: 0.75rem;
    color: #666;
    display: flex;
    align-items: center;
    gap: 0.3rem;
}

.categoria-date i {
    color: #00a896;
    font-size: 0.7rem;
}

.categoria-read-more {
    color: #00a896;
    font-weight: 600;
    font-size: 0.8rem;
    transition: color 0.2s ease;
}

.categoria-read-more:hover {
    color: #00796b;
}

/* Mensagem quando não há itens */
.categoria-empty {
    text-align: center;
    padding: 2rem 1.5rem;
    background: white;
    border-radius: 10px;
    border: 2px dashed #dee2e6;
    grid-column: 1 / -1;
}

.categoria-empty h3 {
    color: #666;
    font-size: 1.1rem;
    margin-bottom: 0.5rem;
    font-weight: 600;
}

.categoria-empty p {
    color: #888;
    font-size: 0.9rem;
}

/* Modo escuro para categoria-empty */
[data-theme="dark"] .categoria-empty {
    background: var(--card-bg) !important;
    border: 2px dashed var(--border-color) !important;
}

[data-theme="dark"] .categoria-empty h3 {
    color: var(--text-secondary) !important;
}

[data-theme="dark"] .categoria-empty p {
    color: var(--text-secondary) !important;
}

/* =====================================
   RESPONSIVIDADE DAS CATEGORIAS
   ===================================== */

/* Telas grandes (Desktop) */
@media (max-width: 1200px) {
    .categoria-page-container {
        padding: 0.8rem 1.2rem;
    }
    
    .categoria-grid {
        grid-template-columns: repeat(auto-fit, minmax(240px, 1fr));
        gap: 1rem;
    }
}

/* Telas médias (Tablets) */
@media (max-width: 1024px) {
    .categoria-title {
        font-size: 1.5rem;
    }
    
    .categoria-subtitle {
        font-size: 0.95rem;
    }
    
    .categoria-grid {
        grid-template-columns: repeat(auto-fit, minmax(220px, 1fr));
        gap: 1rem;
    }
    
    .categoria-image-container {
        height: 140px;
    }
    
    .categoria-content {
        padding: 0.9rem;
    }
    
    .filtros-form {
        gap: 0.8rem;
    }
    
    .filtro-select {
        min-width: 140px;
    }
}

/* Tablets pequenos */
@media (max-width: 768px) {
    .categoria-page-container {
        padding: 0.6rem 0.8rem;
        margin-left: 80px;
        margin-right: 5px;
    }
    
    .categoria-header {
        margin-bottom: 1.2rem;
    }
    
    .categoria-title {
        font-size: 1.4rem;
        margin: 0.6rem 0 0.3rem 0;
    }
    
    .categoria-grid {
        grid-template-columns: repeat(2, 1fr);
        gap: 0.8rem;
    }
    
    .categoria-item {
        border-radius: 8px;
    }
    
    .categoria-image-container {
        height: 130px;
    }
    
    .categoria-content {
        padding: 0.8rem;
    }
    
    .categoria-item-title {
        font-size: 0.95rem;
    }
    
    .categoria-excerpt {
        font-size: 0.8rem;
        -webkit-line-clamp: 2;
    }
    
    .filtros-container {
        padding: 0.8rem 1rem;
    }
    
    .filtros-form {
        flex-direction: column;
        align-items: stretch;
        gap: 0.6rem;
    }
    
    .filtro-group {
        width: 100%;
    }
    
    .filtro-select {
        width: 100%;
        min-width: auto;
    }
    
    .btn-limpar {
        width: 100%;
        padding: 0.6rem;
    }
}

/* Celulares */
@media (max-width: 576px) {
    .categoria-page-container {
        padding: 0.5rem;
        margin-left: 20px;
        margin-right: 30px;
    }
    
    .categoria-title {
        font-size: 1.3rem;
    }
    
    .categoria-subtitle {
        font-size: 0.9rem;
        padding: 0 0.5rem;
    }
    
    .categoria-grid {
        grid-template-columns: 1fr;
        gap: 0.8rem;
    }
    
    .categoria-image-container {
        height: 140px;
    }
    
    .categoria-content {
        padding: 0.8rem;
    }
    
    .categoria-item-title {
        font-size: 0.95rem;
    }
    
    .categoria-excerpt {
        font-size: 0.8rem;
    }
    
    .categoria-meta {
        flex-direction: row;
        align-items: center;
    }
    
    .filtros-container {
        padding: 0.8rem;
    }
}

/* Celulares muito pequenos */
@media (max-width: 400px) {
    .categoria-page-container {
        padding: 0.4rem;
        margin-left: 0px;
        margin-right: 3px;
    }
    
    .categoria-header {
        padding: 0 0.5rem;
    }
    
    .categoria-title {
        font-size: 1.2rem;
    }
    
    .categoria-subtitle {
        font-size: 0.85rem;
    }
    
    .categoria-grid {
        gap: 0.6rem;
    }
    
    .categoria-image-container {
        height: 120px;
    }
    
    .categoria-content {
        padding: 0.7rem;
    }
    
    .categoria-item-title {
        font-size: 0.9rem;
    }
    
    .categoria-excerpt {
        font-size: 0.75rem;
        -webkit-line-clamp: 2;
    }
    
    .categoria-meta {
        flex-direction: column;
        gap: 0.4rem;
        align-items: flex-start;
    }
    
    .filtros-container {
        padding: 0.7rem;
    }
}

/* Ajuste para quando a sidebar está expandida */
.topo.expanded ~ .categoria-page-container {
    margin-left: 250px;
}

@media (max-width: 768px) {
    .topo.expanded ~ .categoria-page-container {
        margin-left: 80px;
    }
}

@media (max-width: 576px) {
    .topo.expanded ~ .categoria-page-container {
        margin-left: 70px;
    }
}

@media (max-width: 400px) {
    .topo.expanded ~ .categoria-page-container {
        margin-left: 65px;
    }
}

.categoria-page-container {
    width: 100%;
    overflow: hidden;
}

.categoria-grid {
    width: 100%;
}

/* ================================== 
    Botão de mudar tema 
   ================================== */
#themeToggle.theme-toggle {
    display: flex;
    align-items: center;
    justify-content: center;
    margin: 0 auto 18px auto;
    width: 52px;
    height: 52px;
    border-radius: 16px;
    background: linear-gradient(135deg, var(--sidebar-bg) 80%, var(--bg-secondary) 20%);
    color: var(--accent-primary);
    border: 2.5px solid var(--accent-primary);
    box-shadow: 0 2px 10px var(--shadow-light), 0 1.5px 8px var(--accent-primary);
    font-size: 1.7rem;
    cursor: pointer;
    transition: 
        background 0.25s, 
        color 0.25s, 
        border-color 0.25s, 
        box-shadow 0.25s, 
        transform 0.18s cubic-bezier(.4,1.4,.6,1.1);
    outline: none;
    position: relative;
    overflow: hidden;
    border-bottom: 3.5px solid var(--accent-secondary);
    border-top: none;
    border-left: none;
    border-right: none;
    margin-bottom: 10px;
    margin-top: 6px;
}

#themeToggle.theme-toggle:hover,
#themeToggle.theme-toggle:focus {
    background: linear-gradient(135deg, var(--accent-primary) 80%, var(--accent-secondary) 20%);
    color: #fff;
    border-color: var(--accent-primary);
    box-shadow: 0 8px 28px var(--shadow-light), 0 2px 12px var(--accent-primary);
    transform: scale(1.07) rotate(-2deg);
}

/* Hover específico para modo escuro */
[data-theme="dark"] #themeToggle.theme-toggle:hover,
[data-theme="dark"] #themeToggle.theme-toggle:focus {
    background: linear-gradient(135deg, var(--accent-primary) 80%, var(--accent-secondary) 20%);
    color: #fff;
    border-color: var(--accent-primary);
    box-shadow: 0 8px 28px rgba(0, 0, 0, 0.3), 0 2px 12px var(--accent-primary);
    transform: scale(1.07) rotate(-2deg);
}

#themeToggle.theme-toggle[aria-pressed="true"] {
    background: linear-gradient(135deg, var(--accent-primary) 80%, var(--accent-secondary) 20%);
    color: #fff;
    border-color: var(--accent-primary);
    box-shadow: 0 8px 28px var(--shadow-light), 0 2px 12px var(--accent-primary);
    transform: none;
}

#themeToggle.theme-toggle i {
    pointer-events: none;
    filter: drop-shadow(0 1px 2px rgba(0,0,0,0.10));
    transition: color 0.2s, filter 0.2s;
    z-index: 1;
}

#themeToggle.theme-toggle .theme-glow {
    content: "";
    position: absolute;
    inset: 0;
    border-radius: 16px;
    pointer-events: none;
    box-shadow: 0 0 24px 8px var(--accent-primary);
    opacity: 0.13;
    z-index: 0;
    transition: opacity 0.25s;
}

#themeToggle.theme-toggle:hover .theme-glow,
#themeToggle.theme-toggle:focus .theme-glow {
    opacity: 0.28;
}

/* Glow específico para modo escuro no hover */
[data-theme="dark"] #themeToggle.theme-toggle:hover .theme-glow,
[data-theme="dark"] #themeToggle.theme-toggle:focus .theme-glow {
    opacity: 0.35;
}

#themeToggle.theme-toggle[aria-pressed="true"] .theme-glow {
    opacity: 0.18;
}

@media (max-width: 768px) {
    #themeToggle.theme-toggle {
        width: 44px;
        height: 44px;
        font-size: 1.2rem;
        border-radius: 12px;
    }
}

/* =====================================
   ESTILOS PARA PÁGINA DE PRIVACIDADE
   ===================================== */

.container-privacidade {
    max-width: 1000px;
    margin: 48px auto 40px auto;
    padding: 0 20px;
}

.privacidade-section {
    background: var(--card-bg);
    border-radius: 20px;
    padding: 40px;
    box-shadow: 0 8px 40px var(--shadow-light);
    border: 1px solid var(--border-color);
    color: var(--text-primary);
}

.privacidade-title {
    color: var(--accent-primary);
    font-size: 2.5rem;
    font-weight: 800;
    margin-bottom: 1rem;
    display: flex;
    align-items: center;
    gap: 15px;
    text-align: center;
    justify-content: center;
}

.privacidade-title i {
    font-size: 2.2rem;
    color: var(--accent-secondary);
}

.divider-privacidade {
    width: 80%;
    border: none;
    height: 3px;
    background: linear-gradient(90deg, transparent, var(--accent-primary), transparent);
    margin: 2rem auto 3rem auto;
}

.privacidade-section p {
    font-size: 1.1rem;
    line-height: 1.7;
    margin-bottom: 1.5rem;
    color: var(--text-primary);
    text-align: justify;
}

.privacidade-section h2 {
    color: var(--accent-primary);
    font-size: 1.8rem;
    font-weight: 700;
    margin: 3rem 0 1.5rem 0;
    display: flex;
    align-items: center;
    gap: 12px;
    padding-bottom: 8px;
    border-bottom: 2px solid var(--border-color);
}

.privacidade-section h2 i {
    font-size: 1.5rem;
    color: var(--accent-secondary);
    width: 30px;
}

.privacidade-section ul {
    margin: 1.5rem 0;
    padding-left: 2rem;
}

.privacidade-section li {
    font-size: 1.1rem;
    line-height: 1.6;
    margin-bottom: 1rem;
    color: var(--text-primary);
    padding-left: 0.5rem;
}

.privacidade-section strong {
    color: var(--accent-primary);
    font-weight: 700;
}

.privacidade-section a {
    color: var(--accent-primary);
    text-decoration: none;
    font-weight: 600;
    transition: color 0.3s ease;
}

.privacidade-section a:hover {
    color: var(--accent-secondary);
    text-decoration: underline;
}

.data-efetiva {
    text-align: center;
    font-size: 1.2rem;
    font-weight: 600;
    margin: 3rem 0;
    padding: 1.5rem;
    background: color-mix(in srgb, var(--accent-primary) 10%, transparent);
    border-radius: 12px;
    border-left: 4px solid var(--accent-primary);
}

.privacidade-callout {
    background: linear-gradient(135deg, color-mix(in srgb, var(--accent-secondary) 15%, transparent), color-mix(in srgb, var(--accent-primary) 10%, transparent));
    padding: 2rem;
    border-radius: 16px;
    margin-top: 3rem;
    border: 1px solid var(--border-color);
    display: flex;
    align-items: center;
    gap: 20px;
    text-align: left;
}

.privacidade-callout i {
    font-size: 2.5rem;
    color: var(--accent-secondary);
    flex-shrink: 0;
}

.privacidade-callout p {
    margin: 0;
    font-size: 1.2rem;
    line-height: 1.6;
}

/* =====================================
   ESTILOS PARA PÁGINA SOBRE
   ===================================== */

.container-sobre {
    max-width: 1000px;
    margin: 48px auto 40px auto;
    padding: 40px 30px;
    background: var(--card-bg);
    border-radius: 20px;
    box-shadow: 0 8px 40px var(--shadow-light);
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 36px;
    color: var(--text-primary);
}

.sobre-header {
    text-align: center;
    width: 100%;
    padding-bottom: 20px;
    border-bottom: 2px solid color-mix(in srgb, var(--accent-primary) 20%, var(--border-color) 80%);
}

.container-sobre h1 {
    font-size: 2.5rem;
    font-weight: 800;
    color: var(--accent-primary);
    margin-bottom: 8px;
    text-align: center;
}

.sobre-subtitulo {
    font-size: 1.2rem;
    color: var(--text-secondary);
    font-weight: 500;
}

.sobre-bloco {
    background: color-mix(in srgb, var(--card-bg) 90%, transparent 10%);
    border-radius: 16px;
    padding: 30px;
    box-shadow: 0 4px 20px var(--shadow-light);
    width: 100%;
    border: 1px solid var(--border-color);
    transition: transform 0.3s ease, box-shadow 0.3s ease;
}

.sobre-bloco:hover {
    transform: translateY(-2px);
    box-shadow: 0 6px 25px var(--shadow-light);
}

.sobre-bloco h2 {
    color: var(--accent-primary);
    font-size: 1.8rem;
    font-weight: 700;
    margin-bottom: 20px;
    display: flex;
    align-items: center;
    gap: 12px;
}

.sobre-bloco h2 i {
    font-size: 1.5rem;
    color: var(--accent-secondary);
}

.sobre-bloco h3 {
    color: var(--accent-primary);
    font-size: 1.4rem;
    font-weight: 600;
    margin-bottom: 15px;
}

.sobre-bloco p {
    color: var(--text-primary);
    font-size: 1.05rem;
    line-height: 1.7;
    margin-bottom: 1rem;
}

/* Layout para blocos com ícone */
.sobre-bloco.introducao,
.sobre-bloco.contato,
.sobre-bloco.agradecimento {
    display: flex;
    align-items: flex-start;
    gap: 25px;
}

.bloco-icon {
    flex-shrink: 0;
    width: 60px;
    height: 60px;
    background: linear-gradient(135deg, var(--accent-primary), var(--accent-secondary));
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    color: white;
    font-size: 1.5rem;
}

.bloco-content {
    flex: 1;
}

/* Grid de membros */
.membros-grid {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(300px, 1fr));
    gap: 30px;
    margin-top: 25px;
}

.membro-categoria {
    background: color-mix(in srgb, var(--bg-secondary) 50%, transparent);
    border-radius: 12px;
    padding: 25px;
    border: 1px solid var(--border-color);
}

.categoria-titulo {
    color: var(--accent-primary);
    font-size: 1.3rem;
    font-weight: 600;
    margin-bottom: 20px;
    display: flex;
    align-items: center;
    gap: 10px;
    padding-bottom: 10px;
    border-bottom: 1px solid var(--border-color);
}

.categoria-titulo i {
    color: var(--accent-secondary);
    font-size: 1.2rem;
}

.membros-lista {
    display: flex;
    flex-direction: column;
    gap: 15px;
}

.membro-item {
    display: flex;
    flex-direction: column;
    gap: 5px;
    padding: 15px;
    background: var(--card-bg);
    border-radius: 8px;
    border: 1px solid var(--border-color);
    transition: transform 0.2s ease;
}

.membro-item:hover {
    transform: translateX(5px);
}

.membro-nome {
    font-weight: 700;
    color: var(--accent-primary);
    font-size: 1.1rem;
}

.membro-funcao {
    color: var(--text-secondary);
    font-size: 0.95rem;
    line-height: 1.4;
}

/* Grid de tecnologias */
.tech-grid {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(120px, 1fr));
    gap: 20px;
    margin-top: 25px;
}

.tech-item {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 12px;
    padding: 20px;
    background: var(--card-bg);
    border-radius: 12px;
    border: 1px solid var(--border-color);
    transition: all 0.3s ease;
    text-align: center;
}

.tech-item:hover {
    transform: translateY(-5px);
    box-shadow: 0 5px 15px var(--shadow-light);
    border-color: var(--accent-primary);
}

.tech-item i {
    font-size: 2.5rem;
    color: var(--accent-primary);
}

.tech-item span {
    font-weight: 600;
    color: var(--text-primary);
    font-size: 0.95rem;
}

/* Estilos específicos para ícones de tecnologia */
.tech-item .fa-html5 { color: #e34f26; }
.tech-item .fa-css3-alt { color: #1572b6; }
.tech-item .fa-js { color: #f7df1e; }
.tech-item .fa-php { color: #777bb4; }
.tech-item .fa-database { color: var(--accent-secondary); }

/* Contato email */
.contato-email {
    display: flex;
    align-items: center;
    gap: 12px;
    margin-top: 15px;
    padding: 15px;
    background: color-mix(in srgb, var(--accent-primary) 10%, transparent);
    border-radius: 8px;
    border: 1px solid var(--border-color);
}

.contato-email i {
    color: var(--accent-primary);
    font-size: 1.2rem;
}

.contato-email a {
    color: var(--accent-primary);
    text-decoration: none;
    font-weight: 600;
    font-size: 1.1rem;
    transition: color 0.3s ease;
}

.contato-email a:hover {
    color: var(--accent-secondary);
    text-decoration: underline;
}

/* =====================================
   RESPONSIVIDADE
   ===================================== */

@media (max-width: 768px) {
    .container-privacidade,
    .container-sobre {
        margin: 30px auto;
        padding: 0 15px;
    }
    
    .privacidade-section,
    .container-sobre {
        padding: 25px;
    }
    
    .privacidade-title {
        font-size: 2rem;
        flex-direction: column;
        gap: 10px;
    }
    
    .container-sobre h1 {
        font-size: 2rem;
    }
    
    .sobre-bloco h2 {
        font-size: 1.5rem;
    }
    
    .membros-grid {
        grid-template-columns: 1fr;
        gap: 20px;
    }
    
    .tech-grid {
        grid-template-columns: repeat(auto-fit, minmax(100px, 1fr));
        gap: 15px;
    }
    
    .sobre-bloco.introducao,
    .sobre-bloco.contato,
    .sobre-bloco.agradecimento {
        flex-direction: column;
        text-align: center;
    }
    
    .bloco-icon {
        align-self: center;
    }
    
    .privacidade-callout {
        flex-direction: column;
        text-align: center;
        gap: 15px;
    }
}

@media (max-width: 480px) {
    .privacidade-section,
    .container-sobre {
        padding: 20px;
    }
    
    .privacidade-title {
        font-size: 1.7rem;
    }
    
    .container-sobre h1 {
        font-size: 1.8rem;
    }
    
    .sobre-bloco {
        padding: 20px;
    }
    
    .tech-grid {
        grid-template-columns: repeat(2, 1fr);
    }
    
    .membro-categoria {
        padding: 20px;
    }
}

/* =====================================
   CORREÇÕES PARA MODO ESCURO - TEXTOS E CORES
   ===================================== */

/* Garante que todos os textos principais fiquem brancos no modo escuro */
[data-theme="dark"] {
  --text-primary: #ffffff;
  --text-secondary: #b0b8c5;
}

/* Textos específicos que devem manter cores originais */
[data-theme="dark"] .home-title,
[data-theme="dark"] .section-title,
[data-theme="dark"] .title-green,
[data-theme="dark"] .title-blue,
[data-theme="dark"] .title-warning,
[data-theme="dark"] .title-green-light,
[data-theme="dark"] .title-blue-light,
[data-theme="dark"] .subsection-title,
[data-theme="dark"] .lenda-title,
[data-theme="dark"] .subtitle {
  color: inherit !important; /* Mantém as cores específicas dos títulos */
}

/* Correção específica para textos da página inicial */
[data-theme="dark"] .home-text,
[data-theme="dark"] .home-text.lead-paragraph,
[data-theme="dark"] .home-text p {
  color: var(--text-primary) !important;
}

[data-theme="dark"] .destaque {
  color: var(--text-primary) !important;
}

[data-theme="dark"] .link-destaque {
  color: var(--accent-primary) !important;
}

[data-theme="dark"] .link-destaque:hover {
  color: var(--accent-secondary) !important;
}

/* =====================================
   CORREÇÕES ESPECÍFICAS PARA ECOTURISMO
   ===================================== */

/* Container do ecoturismo */
[data-theme="dark"] .eco-container {
  background: var(--bg-primary) !important;
}

[data-theme="dark"] .eco-hero {
  background: linear-gradient(135deg, rgba(22, 160, 133, 0.15), rgba(26, 188, 156, 0.15)) !important;
}

[data-theme="dark"] .eco-intro {
  color: var(--text-primary) !important;
}

/* Seções do ecoturismo */
[data-theme="dark"] .eco-section {
  background: var(--card-bg) !important;
  border: 1px solid var(--border-color) !important;
}

[data-theme="dark"] .section-highlight {
  background: linear-gradient(135deg, color-mix(in srgb, var(--accent-primary) 10%, transparent), color-mix(in srgb, var(--accent-secondary) 5%, transparent)) !important;
}

[data-theme="dark"] .section-highlight-secondary {
  background: linear-gradient(135deg, color-mix(in srgb, #e8491d 15%, transparent), color-mix(in srgb, #f24646 10%, transparent)) !important;
}

/* Cards de projeto */
[data-theme="dark"] .project-card,
[data-theme="dark"] .butterflies-card,
[data-theme="dark"] .info-card {
  background: var(--card-bg) !important;
  border: 1px solid var(--border-color) !important;
}

[data-theme="dark"] .project-card:hover,
[data-theme="dark"] .butterflies-card:hover {
  border-color: var(--accent-primary) !important;
}

/* Textos dentro dos cards */
[data-theme="dark"] .project-card p,
[data-theme="dark"] .butterflies-card p,
[data-theme="dark"] .info-card p {
  color: var(--text-primary) !important;
}

/* Listas */
[data-theme="dark"] .butterflies-list li {
  color: var(--text-primary) !important;
  border-bottom-color: var(--border-color) !important;
}

[data-theme="dark"] .butterflies-list li:hover {
  color: var(--accent-primary) !important;
}

/* Habitat features */
[data-theme="dark"] .habitat-item {
  background: color-mix(in srgb, var(--accent-primary) 10%, transparent) !important;
  border: 1px solid var(--border-color) !important;
}

[data-theme="dark"] .habitat-item:hover {
  background: color-mix(in srgb, var(--accent-primary) 20%, transparent) !important;
}

[data-theme="dark"] .habitat-item span {
  color: var(--text-primary) !important;
}

/* Decomposition grid */
[data-theme="dark"] .decomposition-item {
  background: var(--card-bg) !important;
  border: 1px solid var(--border-color) !important;
}

[data-theme="dark"] .decomp-time {
  background: color-mix(in srgb, var(--text-primary) 10%, transparent) !important;
  color: var(--text-primary) !important;
}

/* Cores de status para decomposição no modo escuro */
[data-theme="dark"] .item-short {
  border-left-color: #27ae60 !important;
  background: linear-gradient(135deg, color-mix(in srgb, #27ae60 10%, transparent), color-mix(in srgb, #27ae60 5%, transparent)) !important;
}

[data-theme="dark"] .item-medium {
  border-left-color: #f39c12 !important;
  background: linear-gradient(135deg, color-mix(in srgb, #f39c12 10%, transparent), color-mix(in srgb, #f39c12 5%, transparent)) !important;
}

[data-theme="dark"] .item-long {
  border-left-color: #e74c3c !important;
  background: linear-gradient(135deg, color-mix(in srgb, #e74c3c 10%, transparent), color-mix(in srgb, #e74c3c 5%, transparent)) !important;
}

[data-theme="dark"] .item-vlong {
  border-left-color: #c0392b !important;
  background: linear-gradient(135deg, color-mix(in srgb, #c0392b 10%, transparent), color-mix(in srgb, #c0392b 5%, transparent)) !important;
}

[data-theme="dark"] .item-eternal {
  border-left-color: #7d3c98 !important;
  background: linear-gradient(135deg, color-mix(in srgb, #7d3c98 10%, transparent), color-mix(in srgb, #7d3c98 5%, transparent)) !important;
}

/* Sustainable features */
[data-theme="dark"] .feature-item {
  background: color-mix(in srgb, var(--bg-secondary) 50%, transparent) !important;
  border: 1px solid var(--border-color) !important;
}

[data-theme="dark"] .feature-item:hover {
  background: color-mix(in srgb, var(--accent-primary) 15%, transparent) !important;
}

[data-theme="dark"] .feature-item span {
  color: var(--text-primary) !important;
}

/* Alertas e callouts */
[data-theme="dark"] .eco-alert {
  background: linear-gradient(135deg, color-mix(in srgb, #e8491d 20%, transparent), color-mix(in srgb, #d63031 15%, transparent)) !important;
  color: var(--text-primary) !important;
  border-left-color: #e8491d !important;
}

[data-theme="dark"] .eco-callout {
  background: linear-gradient(135deg, color-mix(in srgb, #28a745 15%, transparent), color-mix(in srgb, #155724 10%, transparent)) !important;
  border-left: 6px solid #28a745 !important;
}

[data-theme="dark"] .eco-callout p {
  color: var(--text-primary) !important;
}

/* Small text */
[data-theme="dark"] .small-text {
  color: var(--text-secondary) !important;
}

/* Links */
[data-theme="dark"] .eco-link {
  background: color-mix(in srgb, var(--accent-primary) 10%, transparent) !important;
  color: var(--accent-primary) !important;
  border: 1px solid var(--border-color) !important;
}

[data-theme="dark"] .eco-link:hover {
  background: color-mix(in srgb, var(--accent-primary) 20%, transparent) !important;
}

/* ONG name */
[data-theme="dark"] .ong-name {
  background: color-mix(in srgb, var(--accent-secondary) 15%, transparent) !important;
  color: var(--accent-secondary) !important;
}

/* =====================================
   CORREÇÕES PARA CARROSSEL NO MODO ESCURO
   ===================================== */

[data-theme="dark"] .carousel-caption {
  background: rgba(0, 0, 0, 0.8) !important;
  color: white !important;
}

[data-theme="dark"] .eco-carousel .carousel-caption {
  background: rgba(22, 160, 133, 0.9) !important;
}

/* =====================================
   CORREÇÕES PARA BADGES NO MODO ESCURO
   ===================================== */

[data-theme="dark"] .eco-badge {
  background: linear-gradient(135deg, var(--accent-secondary), color-mix(in srgb, var(--accent-secondary) 80%, #000)) !important;
}

/* =====================================
   CORREÇÕES GERAIS DE CORES NO MODO ESCURO
   ===================================== */

/* Garante que textos em containers específicos fiquem brancos */
[data-theme="dark"] .container p,
[data-theme="dark"] .container div,
[data-theme="dark"] .container span:not(.section-title):not(.home-title):not(.title-green):not(.title-blue):not(.title-warning):not(.subsection-title) {
  color: var(--text-primary) !important;
}

/* Links em modo escuro */
[data-theme="dark"] a:not(.btn-card):not(.btn-login):not(.btn-register) {
    color: var(--accent-primary) !important;
}

[data-theme="dark"] a:hover:not(.btn-card):not(.btn-login):not(.btn-register) {
    color: var(--accent-secondary) !important;
}

/* Botões principais mais escuros no modo escuro */
[data-theme="dark"] .btn-login,
[data-theme="dark"] input[type="submit"],
[data-theme="dark"] .btn-register,
[data-theme="dark"] .btn-voltar,
[data-theme="dark"] .btn-card {
    background: color-mix(in srgb, var(--accent-primary) 70%, #000 30%) !important;
    color: #fff !important;
    border: none !important;
}

[data-theme="dark"] .btn-login:hover,
[data-theme="dark"] input[type="submit"]:hover,
[data-theme="dark"] .btn-register:hover,
[data-theme="dark"] .btn-voltar:hover,
[data-theme="dark"] .btn-card:hover {
    background: color-mix(in srgb, var(--accent-secondary) 70%, #000 30%) !important;
    color: #fff !important;
}

/* =====================================
   CORREÇÕES PARA SEÇÃO BORBOLETAS NO MODO ESCURO
   ===================================== */

[data-theme="dark"] .butterflies-section {
  background: linear-gradient(135deg, color-mix(in srgb, var(--accent-primary) 8%, transparent), color-mix(in srgb, var(--accent-primary) 5%, transparent)) !important;
  border-left: 6px solid var(--accent-primary) !important;
}

[data-theme="dark"] .butterflies-habitat {
  background: color-mix(in srgb, var(--card-bg) 90%, transparent) !important;
  border: 1px solid var(--border-color) !important;
}

/* =====================================
   CORREÇÕES PARA TABS E ABAS NO MODO ESCURO
   ===================================== */

[data-theme="dark"] .tabs-pag {
  background: linear-gradient(135deg, color-mix(in srgb, var(--bg-secondary) 50%, transparent), color-mix(in srgb, var(--bg-tertiary) 50%, transparent)) !important;
}

[data-theme="dark"] .tab {
  background: var(--card-bg) !important;
  border: 1px solid var(--border-color) !important;
}

/* =====================================
   CORREÇÕES PARA FORMULÁRIOS NO MODO ESCURO
   ===================================== */

[data-theme="dark"] input[type="text"],
[data-theme="dark"] input[type="file"],
[data-theme="dark"] select,
[data-theme="dark"] textarea {
  background-color: var(--bg-secondary) !important;
  border-color: var(--border-color) !important;
  color: var(--text-primary) !important;
}

[data-theme="dark"] input[type="text"]:focus,
[data-theme="dark"] input[type="file"]:focus,
[data-theme="dark"] select:focus,
[data-theme="dark"] textarea:focus {
  background-color: var(--bg-primary) !important;
  border-color: var(--accent-primary) !important;
}

[data-theme="dark"] label {
  color: var(--text-primary) !important;
}

/* =====================================
   CORREÇÕES ADICIONAIS PARA PÁGINA HOME
   ===================================== */

[data-theme="dark"] .container {
  background: var(--card-bg) !important;
  border: 1px solid var(--border-color) !important;
}

[data-theme="dark"] .section-intro,
[data-theme="dark"] .section-folclore,
[data-theme="dark"] .section-gastronomia,
[data-theme="dark"] .section-locais,
[data-theme="dark"] .section-mais {
  background: color-mix(in srgb, var(--card-bg) 95%, transparent) !important;
}

/* =====================================
   GARANTIR CONTRASTE EM TODOS OS TEXTOS
   ===================================== */

[data-theme="dark"] body,
[data-theme="dark"] main,
[data-theme="dark"] .container,
[data-theme="dark"] .container-cultura,
[data-theme="dark"] .eco-container,
[data-theme="dark"] .container-sobre,
[data-theme="dark"] .privacidade-section {
  color: var(--text-primary) !important;
}

[data-theme="dark"] p,
[data-theme="dark"] span:not([class*="title"]):not([class*="section"]),
[data-theme="dark"] div:not([class*="title"]):not([class*="section"]) {
  color: var(--text-primary) !important;
}


/* =================================
    ESTILOS PARA BARRA DE PESQUISA
   ================================*/

/* BARRA DO TOPO - Desktop */
.search-container {
  max-width: 300px;
  margin: 0 1rem;
}

.search-form {
  display: flex;
  border-bottom: 2px solid #e0e0e0;
  transition: border-color 0.3s ease;
}

.search-form:focus-within {
  border-bottom-color: #3498db;
}

.search-input {
  flex: 1;
  padding: 0.5rem 0;
  border: none;
  outline: none;
  background: transparent;
  color: #2c3e50;
  font-size: 0.95rem;
}

.search-input::placeholder {
  color: #95a5a6;
}

.search-btn {
  padding: 0.5rem 0.8rem;
  border: none;
  background: transparent;
  color: #7f8c8d;
  cursor: pointer;
  transition: color 0.3s ease;
}

.search-btn:hover {
  color: #3498db;
}

/* Esconde texto "Buscar" */
.search-btn span {
  display: none;
}

/* BARRA MOBILE - Dentro do menu */
.navItems .search-container {
  display: none;
  width: 100%;
  padding: 10px 16px;
  border-bottom: 1px solid rgba(0, 0, 0, 0.1);
}

.navItems .search-form {
  width: 100%;
}

.navItems .search-input {
  padding: 0.8rem 0;
}

/* BARRA DOS CARDS */
.cards-search-container {
  max-width: 400px;
}

/* MOBILE */
@media (max-width: 1240px) {
  /* Esconde barra do topo no mobile */
  .search-container {
    display: none;
  }
  
  /* Mostra barra no menu mobile */
  .navItems .search-container {
    display: block;
    order: -1;
  }
  
  .cards-search-container {
    max-width: 100%;
  }
}

/* TEMA ESCURO */
[data-theme="dark"] .search-form {
  border-bottom-color: #4a6572;
}

[data-theme="dark"] .search-input {
  color: #ecf0f1;
}

[data-theme="dark"] .search-input::placeholder {
  color: #bdc3c7;
}

[data-theme="dark"] .search-btn {
  color: #bdc3c7;
}

[data-theme="dark"] .navItems .search-container {
  border-bottom-color: rgba(255, 255, 255, 0.1);
}

/* =================================
    ESTILOS PARA PÁGINA DE RESULTADOS
   ================================*/

.resultados-pesquisa {
  max-width: 1200px;
  margin: 2rem auto;
  padding: 0 1rem;
}

.titulo-pesquisa {
  text-align: center;
  color: #2c3e50;
  margin-bottom: 2rem;
  font-size: 2rem;
}

.resultados-count {
  text-align: center;
  color: #7f8c8d;
  margin-bottom: 2rem;
}

.sem-resultados {
  text-align: center;
  color: #7f8c8d;
  padding: 3rem 1rem;
}

.sem-resultados i {
  font-size: 3rem;
  margin-bottom: 1rem;
  color: #bdc3c7;
}

.sem-resultados h3 {
  margin-bottom: 1rem;
  color: #2c3e50;
}

/* CARDS DE RESULTADOS */
.cards-noticias-container {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(300px, 1fr));
  gap: 20px;
  margin-top: 20px;
}

.card-noticia {
  background: white;
  border-radius: 8px;
  overflow: hidden;
  box-shadow: 0 2px 10px rgba(0,0,0,0.1);
}

.card-noticia img {
  width: 100%;
  height: 200px;
  object-fit: cover;
}

.card-content {
  padding: 15px;
}

/* Estilos para badges nos cards de pesquisa */
.card-badges {
    display: flex;
    gap: 0.5rem;
    margin-bottom: 1rem;
    flex-wrap: wrap;
}

.card-content h3 {
  margin: 10px 0;
  color: #2c3e50;
  font-size: 1.2rem;
}

.card-content p {
  color: #666;
  line-height: 1.4;
  margin-bottom: 15px;
}

.btn-card {
  display: inline-block;
  background: #3498db;
  color: white;
  padding: 8px 16px;
  border-radius: 4px;
  text-decoration: none;
  transition: background 0.3s ease;
}

.btn-card:hover {
  background: #2980b9;
}

/* TEMA ESCURO PARA RESULTADOS */
[data-theme="dark"] .titulo-pesquisa,
[data-theme="dark"] .sem-resultados h3,
[data-theme="dark"] .card-content h3 {
  color: #ecf0f1;
}

[data-theme="dark"] .sem-resultados {
  color: #bdc3c7;
}

[data-theme="dark"] .card-noticia {
  background: #2d3748;
}

[data-theme="dark"] .card-content p {
  color: #cbd5e0;
}

/* RESPONSIVO */
@media (max-width: 768px) {
  .cards-noticias-container {
    grid-template-columns: 1fr;
  }
  
  .titulo-pesquisa {
    font-size: 1.5rem;
  }
}

/* ================================
    ESTILOS PARA USUÁRIO LOGADO
   ================================*/

/* Estilos para o container do usuário logado */
.user-logged-container {
    display: flex;
    flex-direction: column;
    gap: 8px;
}

.btn-user,
.btn-login,
.btn-register,
.btn-logout {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 8px;
    padding: 10px 16px;
    text-decoration: none;
    border-radius: 8px;
    transition: all 0.3s cubic-bezier(0.4, 0, 0.2, 1);
    font-weight: 500;
    border: 2px solid transparent;
    text-align: center;
    cursor: pointer;
    position: relative;
    overflow: hidden;
}

/* Efeito de brilho no hover */
.btn-user::before,
.btn-login::before,
.btn-register::before,
.btn-logout::before {
    content: '';
    position: absolute;
    top: 0;
    left: -100%;
    width: 100%;
    height: 100%;
    background: linear-gradient(90deg, transparent, rgba(255,255,255,0.2), transparent);
    transition: left 0.5s ease;
}

.btn-user:hover::before,
.btn-login:hover::before,
.btn-register:hover::before,
.btn-logout:hover::before {
    left: 100%;
}

/* Botão do usuário (logado) */
.btn-user {
    background: var(--accent-color);
    color: white;
    box-shadow: 0 2px 8px rgba(0, 123, 255, 0.3);
}

.btn-user:hover {
    background: var(--accent-color-dark);
    color: white;
    transform: translateY(-2px) scale(1.02);
    box-shadow: 0 4px 15px rgba(0, 123, 255, 0.4);
}

/* Botão de login (não logado) */
.btn-login {
    background: var(--accent-color);
    color: white;
    box-shadow: 0 2px 8px rgba(0, 123, 255, 0.3);
}

.btn-login:hover {
    background: var(--accent-color-dark);
    color: white;
    transform: translateY(-2px) scale(1.02);
    box-shadow: 0 4px 15px rgba(0, 123, 255, 0.4);
}

/* Botão de cadastro (não logado) */
.btn-register {
    background: transparent;
    color: var(--text-color);
    border: 2px solid var(--accent-color);
    box-shadow: 0 2px 8px rgba(0, 123, 255, 0.2);
}

.btn-register:hover {
    background: var(--accent-color);
    color: white;
    transform: translateY(-2px) scale(1.02);
    box-shadow: 0 4px 15px rgba(0, 123, 255, 0.3);
    border-color: var(--accent-color);
}

/* Botão de sair */
.btn-logout {
    background: #dc3545;
    color: white;
    box-shadow: 0 2px 8px rgba(220, 53, 69, 0.3);
}

.btn-logout:hover {
    background: #c82333;
    color: white;
    transform: translateY(-2px) scale(1.02);
    box-shadow: 0 4px 15px rgba(220, 53, 69, 0.4);
}

.user-name {
    font-weight: 600;
    max-width: 120px;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

/* ===== ESTILOS PARA OS ÍCONES ===== */
/* Ícones nos botões com fundo colorido (usuário, login, logout) */
.btn-user i,
.btn-login i,
.btn-logout i {
    color: white !important;
    transition: all 0.3s ease;
}

/* Ícone no botão de cadastro (modo claro) */
.btn-register i {
    color: var(--accent-color);
    transition: all 0.3s ease;
}

/* Ícone no botão de cadastro no hover */
.btn-register:hover i {
    color: white !important;
}

/* ===== ESTILOS PARA MODO ESCURO ===== */
[data-theme="dark"] .btn-user {
    background: var(--accent-color);
    color: white;
    box-shadow: 0 2px 8px rgba(0, 123, 255, 0.4);
}

[data-theme="dark"] .btn-user:hover {
    background: var(--accent-color-dark);
    color: white;
    transform: translateY(-2px) scale(1.02);
    box-shadow: 0 4px 15px rgba(0, 123, 255, 0.6);
}

[data-theme="dark"] .btn-login {
    background: var(--accent-color);
    color: white;
    box-shadow: 0 2px 8px rgba(0, 123, 255, 0.4);
}

[data-theme="dark"] .btn-login:hover {
    background: var(--accent-color-dark);
    color: white;
    transform: translateY(-2px) scale(1.02);
    box-shadow: 0 4px 15px rgba(0, 123, 255, 0.6);
}

[data-theme="dark"] .btn-register {
    background: transparent;
    color: var(--text-color);
    border: 2px solid var(--accent-color);
    box-shadow: 0 2px 8px rgba(0, 123, 255, 0.3);
}

[data-theme="dark"] .btn-register:hover {
    background: var(--accent-color);
    color: white;
    transform: translateY(-2px) scale(1.02);
    box-shadow: 0 4px 15px rgba(0, 123, 255, 0.5);
}

[data-theme="dark"] .btn-logout {
    background: #dc3545;
    color: white;
    box-shadow: 0 2px 8px rgba(220, 53, 69, 0.4);
}

[data-theme="dark"] .btn-logout:hover {
    background: #c82333;
    color: white;
    transform: translateY(-2px) scale(1.02);
    box-shadow: 0 4px 15px rgba(220, 53, 69, 0.6);
}

/* ===== ÍCONES NO MODO ESCURO ===== */
/* Ícones nos botões com fundo colorido (modo escuro) */
[data-theme="dark"] .btn-user i,
[data-theme="dark"] .btn-login i,
[data-theme="dark"] .btn-logout i {
    color: white !important;
}

/* Ícone no botão de cadastro (modo escuro) - agora visível! */
[data-theme="dark"] .btn-register i {
    color: var(--accent-color) !important;
}

/* Ícone no botão de cadastro no hover (modo escuro) */
[data-theme="dark"] .btn-register:hover i {
    color: white !important;
}

/* Ajustes para garantir contraste no modo escuro */
[data-theme="dark"] .auth-buttons {
    color: var(--text-color);
}

/* Ajustes responsivos */
@media (max-width: 768px) {
    .user-logged-container {
        gap: 6px;
    }
    
    .btn-user,
    .btn-login,
    .btn-register,
    .btn-logout {
        padding: 8px 12px;
        font-size: 0.9rem;
        border-radius: 6px;
    }
    
    .user-name {
        max-width: 100px;
    }
    
    /* Efeitos mais suaves em mobile */
    .btn-user:hover,
    .btn-login:hover,
    .btn-register:hover,
    .btn-logout:hover {
        transform: translateY(-1px) scale(1.01);
    }
}

/* Melhorando a acessibilidade */
.btn-user:focus,
.btn-login:focus,
.btn-register:focus,
.btn-logout:focus {
    outline: 2px solid var(--accent-color);
    outline-offset: 2px;
}

[data-theme="dark"] .btn-user:focus,
[data-theme="dark"] .btn-login:focus,
[data-theme="dark"] .btn-register:focus,
[data-theme="dark"] .btn-logout:focus {
    outline: 2px solid var(--accent-color);
    outline-offset: 2px;
}

/* ================================
    ESTILOS PARA MENSAGEM DE BOAS-VINDAS
   ================================*/

.welcome-user {
    text-align: center;
    margin-bottom: 20px;
}

.welcome-message {
    font-size: 1.1rem;
    color: var(--text-color);
    margin-top: 10px;
    padding: 10px 20px;
    background: rgba(0, 123, 255, 0.1);
    border-radius: 8px;
    display: inline-block;
    border-left: 4px solid var(--accent-color);
}

.user-highlight {
    color: var(--accent-color);
    font-weight: 700;
    text-shadow: 0 2px 4px rgba(0, 123, 255, 0.2);
    position: relative;
    display: inline-block;
}

.user-highlight::after {
    content: '';
    position: absolute;
    bottom: -2px;
    left: 0;
    width: 100%;
    height: 2px;
    background: linear-gradient(90deg, transparent, var(--accent-color), transparent);
    border-radius: 2px;
}

/* Estilos para modo escuro */
[data-theme="dark"] .welcome-message {
    background: rgba(0, 123, 255, 0.15);
    border-left: 4px solid var(--accent-color);
    color: var(--text-color);
}

[data-theme="dark"] .user-highlight {
    color: var(--accent-color);
    text-shadow: 0 2px 8px rgba(0, 123, 255, 0.4);
}

/* Animação suave para a mensagem */
.welcome-user {
    animation: fadeInUp 0.6s ease-out;
}

@keyframes fadeInUp {
    from {
        opacity: 0;
        transform: translateY(20px);
    }
    to {
        opacity: 1;
        transform: translateY(0);
    }
}

/* Ajustes responsivos */
@media (max-width: 768px) {
    .welcome-message {
        font-size: 1rem;
        padding: 8px 16px;
    }
    
    .user-highlight {
        font-size: 1.8rem;
    }
}

/* ================================
    STYLE PARA SISTEMA DE COMENTÁRIOS
   ================================*/

.container-comentario {
    margin: 2.5rem 0;
    padding: 2rem;
    background: linear-gradient(135deg, #f8f9fa 0%, #ffffff 100%);
    border-radius: 12px;
    border: 1px solid #e9ecef;
    box-shadow: 0 4px 6px rgba(0, 0, 0, 0.05);
}

.container-comentario h3 {
    margin-bottom: 1.5rem;
    color: #2c3e50;
    font-size: 1.4rem;
    font-weight: 600;
    display: flex;
    align-items: center;
    gap: 0.5rem;
}

.container-comentario h3::before {
    content: "";
    font-size: 1.2rem;
}

.form-comentario {
    display: flex;
    flex-direction: column;
    gap: 1.2rem;
}

.form-comentario textarea {
    width: 100%;
    padding: 1.2rem;
    border: 2px solid #e9ecef;
    border-radius: 10px;
    font-family: inherit;
    font-size: 1rem;
    resize: vertical;
    min-height: 120px;
    transition: all 0.3s ease;
    background: white;
    line-height: 1.5;
}

.form-comentario textarea:focus {
    outline: none;
    border-color: #3498db;
    box-shadow: 0 0 0 3px rgba(52, 152, 219, 0.1);
    transform: translateY(-2px);
}

.form-comentario textarea::placeholder {
    color: #a0aec0;
}

.btn-enviar {
    padding: 0.9rem 2rem;
    background: linear-gradient(135deg, #3498db 0%, #2980b9 100%);
    color: white;
    border: none;
    border-radius: 8px;
    font-size: 1rem;
    font-weight: 600;
    cursor: pointer;
    transition: all 0.3s ease;
    align-self: flex-start;
    box-shadow: 0 2px 4px rgba(52, 152, 219, 0.3);
}

.btn-enviar:hover {
    background: linear-gradient(135deg, #2980b9 0%, #2573a7 100%);
    transform: translateY(-2px);
    box-shadow: 0 4px 8px rgba(52, 152, 219, 0.4);
}

.btn-enviar:active {
    transform: translateY(0);
}

.aviso-login {
    text-align: center;
    padding: 2rem;
    background: linear-gradient(135deg, #fff3cd 0%, #ffeaa7 100%);
    border: 2px solid #ffd43b;
    border-radius: 10px;
    color: #856404;
    margin: 2.5rem 0;
    font-weight: 500;
}

.aviso-login a {
    color: #e74c3c;
    text-decoration: none;
    font-weight: 600;
    transition: color 0.3s ease;
}

.aviso-login a:hover {
    color: #c0392b;
    text-decoration: underline;
}

.comentarios {
    margin: 2.5rem 0;
}

.comentarios h3 {
    margin-bottom: 1.8rem;
    color: #2c3e50;
    font-size: 1.4rem;
    font-weight: 600;
    display: flex;
    align-items: center;
    gap: 0.5rem;
}

.comentarios h3::before {
    content: "";
    font-size: 1.2rem;
}

.comentario-item {
    background: white;
    border: 1px solid #e9ecef;
    border-radius: 12px;
    padding: 1.8rem;
    margin-bottom: 1.2rem;
    box-shadow: 0 2px 8px rgba(0, 0, 0, 0.08);
    transition: all 0.3s ease;
    position: relative;
}

.comentario-item:hover {
    transform: translateY(-2px);
    box-shadow: 0 4px 12px rgba(0, 0, 0, 0.12);
}

.comentario-item:last-child {
    margin-bottom: 0;
}

.comentario-header {
    display: flex;
    justify-content: space-between;
    align-items: flex-start;
    margin-bottom: 1rem;
    flex-wrap: wrap;
    gap: 0.8rem;
}

/* Estilos para as fotos dos usuários nos comentários */
.usuario-info {
    display: flex;
    align-items: center;
    gap: 12px;
    flex: 1;
}

.usuario-foto {
    width: 45px;
    height: 45px;
    border-radius: 50%;
    overflow: hidden;
    flex-shrink: 0;
}

.usuario-foto img {
    width: 100%;
    height: 100%;
    object-fit: inherit;
}

.usuario-foto-padrao {
    width: 100%;
    height: 100%;
    background: #3498db;
    display: flex;
    align-items: center;
    justify-content: center;
    color: white;
    border-radius: 50%;
    font-size: 1.2rem;
}

.usuario-detalhes {
    display: flex;
    flex-direction: column;
}

.usuario-detalhes strong {
    color: #2c3e50;
    font-size: 1.05rem;
    font-weight: 600;
    margin-bottom: 2px;
}

.comentario-data {
    color: #7f8c8d;
    font-size: 0.85rem;
}

.comentario-texto {
    color: #4a5568;
    line-height: 1.6;
    font-size: 1rem;
    margin-left: 57px; /* Alinha com a foto do usuário */
}

.btn-deletar {
    background: #e74c3c;
    color: white;
    border: none;
    border-radius: 6px;
    padding: 0.5rem 0.8rem;
    cursor: pointer;
    transition: all 0.3s ease;
    font-size: 0.85rem;
    text-decoration: none;
    display: inline-flex;
    align-items: center;
    gap: 0.3rem;
}

.btn-deletar:hover {
    background: #c0392b;
    transform: scale(1.05);
}

.sem-comentarios {
    text-align: center;
    padding: 3rem 2rem;
    color: #7f8c8d;
    font-style: italic;
    background: linear-gradient(135deg, #f8f9fa 0%, #e9ecef 100%);
    border-radius: 12px;
    border: 2px dashed #dee2e6;
    font-size: 1.1rem;
}

/* ===== MODO ESCURO ===== */
[data-theme="dark"] .container-comentario {
    background: linear-gradient(135deg, #2d3748 0%, #4a5568 100%);
    border: 1px solid #718096;
    box-shadow: 0 4px 6px rgba(0, 0, 0, 0.2);
}

[data-theme="dark"] .container-comentario h3,
[data-theme="dark"] .comentarios h3 {
    color: #e2e8f0;
}

[data-theme="dark"] .form-comentario textarea {
    background: #4a5568;
    border-color: #718096;
    color: #e2e8f0;
}

[data-theme="dark"] .form-comentario textarea:focus {
    border-color: #4299e1;
    box-shadow: 0 0 0 3px rgba(66, 153, 225, 0.2);
}

[data-theme="dark"] .aviso-login {
    background: linear-gradient(135deg, #744210 0%, #975a16 100%);
    border-color: #d69e2e;
    color: #fed7aa;
}

[data-theme="dark"] .comentario-item {
    background: #2d3748;
    border-color: #4a5568;
}

[data-theme="dark"] .usuario-detalhes strong {
    color: #e2e8f0;
}

[data-theme="dark"] .comentario-data {
    color: #cbd5e0;
}

[data-theme="dark"] .comentario-texto {
    color: #e2e8f0;
}

[data-theme="dark"] .sem-comentarios {
    background: linear-gradient(135deg, #2d3748 0%, #1a202c 100%);
    border-color: #4a5568;
    color: #a0aec0;
}

[data-theme="dark"] .usuario-foto-padrao {
    background: #4299e1;
}

/* ===== ANIMAÇÕES ===== */
@keyframes fadeInUp {
    from {
        opacity: 0;
        transform: translateY(20px);
    }
    to {
        opacity: 1;
        transform: translateY(0);
    }
}

.comentario-item {
    animation: fadeInUp 0.4s ease-out;
}

/* ===== RESPONSIVO ===== */
@media (max-width: 768px) {
    .container-comentario,
    .comentario-item {
        padding: 1.5rem;
        margin: 1.5rem 0;
    }
    
    .comentario-header {
        flex-direction: column;
        align-items: flex-start;
        gap: 0.8rem;
    }
    
    .btn-enviar {
        align-self: stretch;
        text-align: center;
    }
    
    .usuario-info {
        width: 100%;
    }
    
    .usuario-foto {
        width: 40px;
        height: 40px;
    }
    
    .comentario-texto {
        margin-left: 0;
        margin-top: 10px;
    }
}

@media (max-width: 480px) {
    .container-comentario,
    .comentario-item {
        padding: 1.2rem;
    }
    
    .container-comentario h3,
    .comentarios h3 {
        font-size: 1.2rem;
    }
    
    .form-comentario textarea {
        min-height: 100px;
        padding: 1rem;
    }
    
    .usuario-foto {
        width: 35px;
        height: 35px;
    }
    
    .usuario-foto-padrao {
        font-size: 1rem;
    }
}

.noticia-tags a {
    color: #3498db;
    text-decoration: none;
    transition: color 0.3s ease;
    padding: 0.3rem 0.6rem;
    border-radius: 4px;
}

.noticia-tags a:hover {
    color: #2980b9;
    background-color: #f8f9fa;
    text-decoration: none;
}

.noticia-categoria,
.noticia-subcategoria {
    color: #3498db;
    text-decoration: none;
    transition: color 0.3s ease;
    padding: 0.2rem 0.5rem;
    border-radius: 4px;
}

.noticia-categoria:hover,
.noticia-subcategoria:hover {
    color: #2980b9;
    background-color: #f8f9fa;
    text-decoration: none;
}

/* Modo escuro */
[data-theme="dark"] .noticia-tags a:hover,
[data-theme="dark"] .noticia-categoria:hover,
[data-theme="dark"] .noticia-subcategoria:hover {
    background-color: #4a5568;
    color: #63b3ed;
}


/* Estilos Gerais do Painel */
/* ===== Estilos Gerais ===== */
.painel-container {
  display: flex;
  justify-content: center;
  align-items: flex-start;
  min-height: 100vh;
  padding: 50px 20px;
}

.painel-card {
  background: #fff;
  border-radius: 20px;
  padding: 40px 50px;
  max-width: 700px;
  width: 100%;
  box-shadow: 0 10px 25px rgba(0, 0, 0, 0.1);
  transition: 0.3s ease;
}

/* ===== Cabeçalho ===== */
.painel-header {
  text-align: center;
  margin-bottom: 30px;
}

.painel-header h1 {
  font-size: 1.9rem;
  color: #222;
}

.painel-header p {
  color: #555;
  font-size: 1rem;
}

/* ===== Informações do Usuário ===== */
.painel-info {
  text-align: center;
  background: #f9fafb;
  border-radius: 15px;
  padding: 25px;
  margin-bottom: 25px;
  border: 1px solid #e0e0e0;
}

.user-img {
  width: 120px;
  height: 120px;
  margin: 0 auto 15px;
  border-radius: 50%;
  overflow: hidden;
}

.user-img img {
  width: 100%;
  height: 100%;
  object-fit: cover;
}

[data-theme="dark"] .user-img-default img {
    filter: invert(100%);
}

.painel-info p {
  margin: 6px 0;
  font-size: 0.95rem;
  color: #444;
}

/* ===== Navegação ===== */
.painel-navegacao {
  display: flex;
  justify-content: center;
  gap: 10px;
  margin-bottom: 30px;
}

.nav-btn {
  background: transparent;
  border: 2px solid #007bff;
  color: #007bff;
  padding: 8px 15px;
  border-radius: 8px;
  font-weight: 600;
  cursor: pointer;
  transition: 0.2s;
}

.nav-btn.active,
.nav-btn:hover {
  background: #007bff;
  color: white;
}

/* ===== Conteúdo ===== */
.conteudo-secao {
  display: none;
}

.conteudo-secao.active {
  display: block;
}

.conteudo-secao h2 {
  font-size: 1.3rem;
  margin-bottom: 15px;
  color: var(--text-primary);
}

/* ===== Formulários ===== */
.form-group {
  display: flex;
  flex-direction: column;
  margin-bottom: 15px;
}

.form-group label {
  font-weight: 500;
  margin-bottom: 5px;
  color: #333;
}

.form-group input[type="file"],
.form-group input[type="password"] {
  padding: 10px;
  border: 1px solid #ccc;
  border-radius: 6px;
  font-size: 0.95rem;
}

small {
  color: #777;
  font-size: 0.85rem;
}

/* ===== Botões ===== */
.btn-primary {
  display: inline-block;
  background: #007bff;
  color: white;
  border: none;
  padding: 10px 20px;
  border-radius: 8px;
  font-weight: 600;
  cursor: pointer;
  transition: 0.2s;
}

.btn-primary:hover {
  background: #005ecb;
}

/* ===== Comentários ===== */
.comentarios-container {
  margin-top: 20px;
}

.comentario-item {
  background: #f8f9fa;
  border-radius: 10px;
  padding: 12px 16px;
  margin-bottom: 10px;
  border-left: 4px solid #007bff;
}

.comentario-texto {
  font-style: italic;
  margin-bottom: 5px;
}

.comentario-info {
  font-size: 0.85rem;
  color: #666;
}

.comentario-info a {
  color: #007bff;
  text-decoration: none;
}

.comentario-info a:hover {
  text-decoration: underline;
}

/* ====== Tema Escuro ====== */

[data-theme="dark"] .painel-card {
  background: #1b2435;
  box-shadow: 0 10px 30px rgba(0, 0, 0, 0.4);
}

[data-theme="dark"] .painel-header h1 {
  color: #f5f6fa;
}

[data-theme="dark"] .painel-header p,
[data-theme="dark"] .painel-info p,
[data-theme="dark"] .form-group label,
[data-theme="dark"] small {
  color: #c9d1d9;
}

[data-theme="dark"] .painel-info {
  background: #232f47;
  border: 1px solid #2f3a56;
}

[data-theme="dark"] .comentario-item {
  background: #2b3854;
  border-left-color: #60a5fa;
}

[data-theme="dark"] .btn-primary {
  background: #60a5fa;
}

[data-theme="dark"] .nav-btn {
  border-color: #60a5fa;
  color: #60a5fa;
}

[data-theme="dark"] .nav-btn.active,
[data-theme="dark"] .nav-btn:hover {
  background: #60a5fa;
  color: #0b1220;
}


    .container-meus-dados {
      max-width: 800px;
      margin: 20px auto;
      padding: 20px;
      background: white;
      border-radius: 8px;
      box-shadow: 0 2px 10px rgba(0,0,0,0.1);
    }
    
    .info-box {
      background: #f8f9fa;
      padding: 15px;
      border-radius: 5px;
      margin-bottom: 20px;
    }
    
    .noticias-list {
      margin-top: 20px;
    }
    
    .noticia-item {
      border: 1px solid #ddd;
      padding: 15px;
      margin-bottom: 10px;
      border-radius: 5px;
    }
    
    .noticia-item h3 {
      margin: 0 0 5px 0;
    }
    
    .noticia-data {
      color: #666;
      font-size: 0.9em;
    }
    
    .btn {
      display: inline-block;
      padding: 8px 15px;
      background: #007bff;
      color: white;
      text-decoration: none;
      border-radius: 4px;
      margin-right: 10px;
    }
    
    .btn:hover {
      background: #0056b3;
    }
    
    .btn-sair {
      background: #dc3545;
    }
    
    .btn-sair:hover {
      background: #c82333;
    }

.tab_adm .painel-container {
    max-width: 100% !important;
    padding: 0 !important;
    margin: 0 !important;
    min-height: 80vh;
}

/* =====================================
   MENSAGENS GLOBAIS (NO TOPO DA PÁGINA)
   ===================================== */

.mensagem-global {
    position: fixed;
    top: 20px;
    left: 50%;
    transform: translateX(-50%);
    padding: 15px 25px;
    border-radius: 8px;
    font-weight: 600;
    z-index: 10000;
    animation: slideDownGlobal 0.3s ease;
    min-width: 300px;
    max-width: 90vw;
    text-align: center;
    box-shadow: 0 4px 20px rgba(0,0,0,0.25);
    backdrop-filter: blur(10px);
    border: none;
}

.mensagem-global.sucesso {
    background: linear-gradient(135deg, #d4edda, #c3e6cb);
    color: #155724;
    border-left: 4px solid #28a745;
}

.mensagem-global.erro {
    background: linear-gradient(135deg, #f8d7da, #f5c6cb);
    color: #721c24;
    border-left: 4px solid #dc3545;
}

.mensagem-global.info {
    background: linear-gradient(135deg, #cce7ff, #b3d7ff);
    color: #004085;
    border-left: 4px solid #007bff;
}

.mensagem-global .fechar {
    position: absolute;
    top: 8px;
    right: 12px;
    background: none;
    border: none;
    font-size: 1.2rem;
    cursor: pointer;
    opacity: 0.7;
    transition: opacity 0.3s ease;
    color: inherit;
}

.mensagem-global .fechar:hover {
    opacity: 1;
}

@keyframes slideDownGlobal {
    from {
        opacity: 0;
        transform: translateX(-50%) translateY(-30px);
    }
    to {
        opacity: 1;
        transform: translateX(-50%) translateY(0);
    }
}

/* Fechar automaticamente após alguns segundos */
.mensagem-global.auto-fechar {
    animation: slideDownGlobal 0.3s ease, fadeOut 5s 3s ease forwards;
}

@keyframes fadeOut {
    to {
        opacity: 0;
        visibility: hidden;
        transform: translateX(-50%) translateY(-20px);
    }
}



/* =====================================
   NOTIFICAÇÃO DE SEGURANÇA
   ===================================== */

.security-notice {
    background: linear-gradient(135deg, var(--bg-secondary), color-mix(in srgb, var(--bg-secondary) 90%, transparent));
    border: 1px solid var(--border-color);
    border-radius: 12px;
    padding: 20px;
    margin-bottom: 25px;
    display: flex;
    align-items: flex-start;
    gap: 15px;
    border-left: 4px solid var(--accent-primary);
}

.security-notice i {
    color: var(--accent-primary);
    font-size: 1.4rem;
    flex-shrink: 0;
    margin-top: 2px;
}

.security-notice .conteudo {
    flex: 1;
}

.security-notice h4 {
    margin: 0 0 8px 0;
    color: var(--text-primary);
    font-size: 1.1rem;
    font-weight: 700;
}

.security-notice p {
    margin: 0;
    color: var(--text-secondary);
    font-size: 0.95rem;
    line-height: 1.5;
}

/* =====================================
   FORMULÁRIOS
   ===================================== */

.form-informacoes,
.form-senha,
.form-foto {
    max-width: 600px;
    animation: slideUp 0.4s ease;
}

.form-group {
    margin-bottom: 25px;
    position: relative;
}

.form-group label {
    display: block;
    margin-bottom: 8px;
    font-weight: 600;
    color: var(--text-primary);
    font-size: 1rem;
    transition: color 0.3s ease;
}

.form-group.required label::after {
    content: " *";
    color: #dc3545;
}

.form-group input {
    width: 100%;
    padding: 14px 16px;
    border: 2px solid var(--border-color);
    border-radius: 10px;
    background: var(--bg-primary);
    color: var(--text-primary);
    font-size: 1rem;
    transition: all 0.3s ease;
    box-sizing: border-box;
}

.form-group input:focus {
    outline: none;
    border-color: var(--accent-primary);
    box-shadow: 0 0 0 3px color-mix(in srgb, var(--accent-primary) 20%, transparent);
    background: var(--bg-primary);
}

.form-group input:disabled {
    background: var(--bg-secondary);
    color: var(--text-secondary);
    cursor: not-allowed;
    opacity: 0.7;
}

.form-group small {
    display: block;
    margin-top: 6px;
    color: var(--text-secondary);
    font-size: 0.85rem;
    line-height: 1.4;
}

/* Grupo de campos relacionados */
.campo-grupo {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 15px;
}

/* Seção destacada */
.secao-destacada {
    border-top: 2px solid var(--border-color);
    padding-top: 25px;
    margin-top: 25px;
    position: relative;
}

.secao-destacada::before {
    content: "🔒";
    position: absolute;
    top: -15px;
    left: 0;
    background: var(--bg-primary);
    padding: 0 10px;
    font-size: 1.2rem;
}

.secao-destacada .form-group label {
    color: var(--accent-primary);
    font-weight: 700;
}

/* =====================================
   BOTÕES E ESTADOS
   ===================================== */

.btn-primary {
    background: linear-gradient(135deg, var(--accent-primary), color-mix(in srgb, var(--accent-primary) 80%, black));
    color: white;
    border: none;
    padding: 15px 40px;
    border-radius: 10px;
    font-weight: 700;
    font-size: 1rem;
    cursor: pointer;
    transition: all 0.3s ease;
    margin-top: 10px;
    position: relative;
    overflow: hidden;
}

.btn-primary:hover {
    background: linear-gradient(135deg, color-mix(in srgb, var(--accent-primary) 90%, black), var(--accent-primary));
    transform: translateY(-2px);
    box-shadow: 0 6px 20px color-mix(in srgb, var(--accent-primary) 30%, transparent);
}

.btn-primary:active {
    transform: translateY(0);
}

.btn-primary:disabled {
    background: var(--text-secondary);
    cursor: not-allowed;
    transform: none;
    box-shadow: none;
}

/* Estados de loading */
.btn-primary.loading {
    color: transparent;
    pointer-events: none;
}

.btn-primary.loading::after {
    content: '';
    position: absolute;
    width: 20px;
    height: 20px;
    top: 50%;
    left: 50%;
    margin-left: -10px;
    margin-top: -10px;
    border: 2px solid transparent;
    border-top: 2px solid white;
    border-radius: 50%;
    animation: spin 1s linear infinite;
}

@keyframes spin {
    0% { transform: rotate(0deg); }
    100% { transform: rotate(360deg); }
}

/* Grupo de botões */
.grupo-botoes {
    display: flex;
    gap: 15px;
    margin-top: 25px;
    flex-wrap: wrap;
}

.grupo-botoes .btn-primary {
    margin-top: 0;
    flex: 1;
    min-width: 120px;
}

/* =====================================
   ANIMAÇÕES E TRANSITIONS
   ===================================== */

@keyframes slideUp {
    from {
        opacity: 0;
        transform: translateY(30px);
    }
    to {
        opacity: 1;
        transform: translateY(0);
    }
}

@keyframes shake {
    0%, 100% { transform: translateX(0); }
    25% { transform: translateX(-5px); }
    75% { transform: translateX(5px); }
}

.tremer {
    animation: shake 0.5s ease;
}

/* =====================================
   ESTADOS DE VALIDAÇÃO
   ===================================== */

.form-group.valido input {
    border-color: #28a745;
    background: color-mix(in srgb, #d4edda 5%, transparent);
}

.form-group.invalido input {
    border-color: #dc3545;
    background: color-mix(in srgb, #f8d7da 5%, transparent);
}

.form-group .feedback {
    display: block;
    margin-top: 6px;
    font-size: 0.85rem;
    font-weight: 500;
}

.form-group.valido .feedback {
    color: #28a745;
}

.form-group.invalido .feedback {
    color: #dc3545;
}

/* Indicador de força da senha */
.indicator-forca-senha {
    margin-top: 8px;
    height: 4px;
    border-radius: 2px;
    background: var(--border-color);
    overflow: hidden;
}

.indicator-forca-senha .forca {
    height: 100%;
    width: 0%;
    transition: all 0.3s ease;
    border-radius: 2px;
}

.indicator-forca-senha .fraca { 
    width: 33%; 
    background: #dc3545; 
}

.indicator-forca-senha .media { 
    width: 66%; 
    background: #ffc107; 
}

.indicator-forca-senha .forte { 
    width: 100%; 
    background: #28a745; 
}

/* =====================================
   RESPONSIVIDADE
   ===================================== */

@media (max-width: 768px) {
    .mensagem-global {
        top: 10px;
        left: 20px;
        right: 20px;
        transform: none;
        min-width: auto;
        padding: 14px 20px;
        font-size: 0.95rem;
    }
    
    .mensagem {
        padding: 14px 18px;
        font-size: 0.95rem;
        flex-direction: column;
        gap: 10px;
        text-align: center;
    }
    
    .mensagem .fechar {
        align-self: flex-end;
        margin-top: -10px;
    }
    
    .security-notice {
        padding: 18px;
        flex-direction: column;
        text-align: center;
        gap: 12px;
    }
    
    .security-notice i {
        font-size: 1.6rem;
    }
    
    .form-informacoes,
    .form-senha,
    .form-foto {
        max-width: 100%;
    }
    
    .form-group input {
        padding: 16px;
        font-size: 16px; /* Previne zoom no iOS */
    }
    
    .campo-grupo {
        grid-template-columns: 1fr;
        gap: 0;
    }
    
    .grupo-botoes {
        flex-direction: column;
    }
    
    .grupo-botoes .btn-primary {
        width: 100%;
    }
}

@media (max-width: 480px) {
    .mensagem-global {
        left: 10px;
        right: 10px;
        padding: 12px 16px;
        font-size: 0.9rem;
    }
    
    .mensagem {
        padding: 12px 16px;
        font-size: 0.9rem;
    }
    
    .security-notice {
        padding: 16px;
    }
    
    .security-notice h4 {
        font-size: 1rem;
    }
    
    .security-notice p {
        font-size: 0.9rem;
    }
    
    .form-group {
        margin-bottom: 20px;
    }
    
    .btn-primary {
        padding: 16px 20px;
        width: 100%;
    }
}

/* =====================================
   ACESSIBILIDADE
   ===================================== */

.form-group input:focus-visible {
    outline: 2px solid var(--accent-primary);
    outline-offset: 2px;
}

.security-notice:focus-within {
    border-color: var(--accent-primary);
    box-shadow: 0 0 0 3px color-mix(in srgb, var(--accent-primary) 20%, transparent);
}

/* Alto contraste */
@media (prefers-contrast: high) {
    .mensagem-global,
    .mensagem {
        border-width: 2px;
        box-shadow: none;
    }
    
    .form-group input {
        border-width: 2px;
    }
    
    .btn-primary {
        border: 2px solid currentColor;
    }
}

/* Redução de movimento */
@media (prefers-reduced-motion: reduce) {
    .mensagem-global,
    .mensagem,
    .form-informacoes,
    .form-senha,
    .form-foto {
        animation: none;
    }
    
    .btn-primary {
        transition: none;
    }
}

/* Estilo para a seção do autor com foto */
.noticia-user-com-foto {
    margin: 30px 0;
    padding: 20px;
    background: var(--bg-secondary);
    border-radius: 12px;
    border-left: 4px solid var(--accent-primary);
}

.autor-info {
    display: flex;
    align-items: center;
    gap: 15px;
}

.autor-foto {
    width: 50px;
    height: 50px;
    border-radius: 50%;
    overflow: hidden;
    flex-shrink: 0;
}

.autor-foto img {
    width: 100%;
    height: 100%;
    object-fit: cover;
}

.autor-foto-padrao {
    width: 100%;
    height: 100%;
    background: var(--accent-primary);
    display: flex;
    align-items: center;
    justify-content: center;
    color: white;
    font-size: 1.2rem;
}

.autor-detalhes {
    display: flex;
    flex-direction: column;
}

.autor-nome {
    font-weight: 700;
    color: var(--text-primary);
    font-size: 1rem;
}

.autor-data {
    font-size: 0.85rem;
    color: var(--text-secondary);
    margin-top: 2px;
}

.ver-noticias {
    text-align: center;
    margin-top: 2rem;
    padding: 1rem 0;
}

.ver-noticias a {
    display: inline-flex;
    align-items: center;
    gap: 0.5rem;
    background: linear-gradient(135deg, var(--accent-primary), #00b4d8);
    color: white;
    padding: 14px 28px;
    border-radius: 50px;
    text-decoration: none;
    font-weight: 600;
    font-size: 1.1rem;
    transition: all 0.3s ease;
    box-shadow: 0 4px 15px var(--shadow-light);
    position: relative;
    overflow: hidden;
    border: 1px solid rgba(255, 255, 255, 0.1);
}

.ver-noticias a::before {
    content: '';
    position: absolute;
    top: 0;
    left: -100%;
    width: 100%;
    height: 100%;
    background: linear-gradient(90deg, transparent, rgba(255, 255, 255, 0.15), transparent);
    transition: left 0.5s ease;
}

.ver-noticias a:hover {
    transform: translateY(-3px);
    box-shadow: 0 8px 25px var(--shadow-light);
    background: linear-gradient(135deg, #00b4d8, var(--accent-primary));
}

.ver-noticias a:hover::before {
    left: 100%;
}

.ver-noticias a:active {
    transform: translateY(-1px);
    box-shadow: 0 4px 15px var(--shadow-light);
}

.ver-noticias i {
    font-size: 1.2rem;
    transition: transform 0.3s ease;
}

.ver-noticias a:hover i {
    transform: rotate(15deg) scale(1.1);
}

/* Modo escuro específico */
[data-theme="dark"] .ver-noticias a {
    background: linear-gradient(135deg, var(--accent-primary), #0096c7);
    box-shadow: 0 4px 20px rgba(0, 0, 0, 0.3);
    border: 1px solid rgba(77, 171, 247, 0.2);
}

[data-theme="dark"] .ver-noticias a:hover {
    background: linear-gradient(135deg, #0096c7, var(--accent-primary));
    box-shadow: 0 8px 30px rgba(0, 0, 0, 0.4);
    border: 1px solid rgba(77, 171, 247, 0.3);
}

[data-theme="dark"] .ver-noticias a::before {
    background: linear-gradient(90deg, transparent, rgba(255, 255, 255, 0.1), transparent);
}

/* Versão alternativa moderna para modo escuro */
.ver-noticias.modern a {
    background: linear-gradient(135deg, var(--accent-primary), #764ba2);
    border: 2px solid transparent;
    background-clip: padding-box;
    position: relative;
}

[data-theme="dark"] .ver-noticias.modern a {
    background: linear-gradient(135deg, var(--accent-primary), #5a3d7a);
}

.ver-noticias.modern a::after {
    content: '';
    position: absolute;
    top: -2px;
    left: -2px;
    right: -2px;
    bottom: -2px;
    background: linear-gradient(135deg, var(--accent-primary), #764ba2, #f093fb, #f5576c);
    border-radius: 50px;
    z-index: -1;
    opacity: 0;
    transition: opacity 0.3s ease;
}

[data-theme="dark"] .ver-noticias.modern a::after {
    background: linear-gradient(135deg, var(--accent-primary), #5a3d7a, #d483e8, #e84560);
}

.ver-noticias.modern a:hover::after {
    opacity: 1;
}

/* Versão suave para modo escuro */
.ver-noticias.soft a {
    background: linear-gradient(135deg, var(--accent-primary), #0096c7);
    border-radius: 20px;
    padding: 12px 32px;
    font-weight: 500;
    letter-spacing: 0.5px;
}

[data-theme="dark"] .ver-noticias.soft a {
    background: linear-gradient(135deg, var(--accent-primary), #0077a3);
}

/* Versão com ícone animado */
.ver-noticias.animated i {
    animation: pulse 2s infinite;
}

@keyframes pulse {
    0% {
        transform: scale(1);
        opacity: 1;
    }
    50% {
        transform: scale(1.1);
        opacity: 0.8;
    }
    100% {
        transform: scale(1);
        opacity: 1;
    }
}

[data-theme="dark"] .ver-noticias.animated i {
    animation: pulseDark 2s infinite;
}

@keyframes pulseDark {
    0% {
        transform: scale(1);
        opacity: 1;
        filter: brightness(1.2);
    }
    50% {
        transform: scale(1.15);
        opacity: 0.9;
        filter: brightness(1.5);
    }
    100% {
        transform: scale(1);
        opacity: 1;
        filter: brightness(1.2);
    }
}

/* Responsividade */
@media (max-width: 768px) {
    .ver-noticias a {
        padding: 12px 24px;
        font-size: 1rem;
    }
    
    .ver-noticias {
        margin-top: 1.5rem;
    }
}

/* Garantir que o texto sempre tenha contraste adequado */
.ver-noticias a {
    color: white !important;
    text-shadow: 0 1px 2px rgba(0, 0, 0, 0.2);
}

[data-theme="dark"] .ver-noticias a {
    text-shadow: 0 1px 3px rgba(0, 0, 0, 0.4);
}

/* =====================================
   PÁGINA DE VERIFICAÇÃO DE EMAIL
   ===================================== */

.verification-container {
    max-width: 800px;
    margin: 2rem auto;
    padding: 2.5rem;
    background: var(--card-bg);
    border-radius: 20px;
    box-shadow: 0 12px 40px var(--shadow-light);
    border: 1px solid var(--border-color);
    text-align: center;
    backdrop-filter: blur(10px);
}

.verification-icon {
    width: 100px;
    height: 100px;
    margin: 0 auto 2rem;
    background: linear-gradient(135deg, var(--accent-primary), var(--accent-secondary));
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    position: relative;
}

.verification-icon i {
    font-size: 2.5rem;
    color: white;
}

.verification-title {
    color: var(--text-primary);
    font-size: 2rem;
    font-weight: 700;
    margin-bottom: 1.5rem;
    line-height: 1.3;
}

.verification-subtitle {
    color: var(--text-secondary);
    font-size: 1.2rem;
    line-height: 1.6;
    margin-bottom: 2rem;
}

.verification-email {
    display: inline-block;
    background: var(--bg-secondary);
    padding: 1rem 2rem;
    border-radius: 14px;
    color: var(--accent-primary);
    font-weight: 600;
    font-size: 1.2rem;
    margin: 1.5rem 0;
    border: 1px solid var(--border-color);
    box-shadow: 0 4px 12px var(--shadow-light);
}

.verification-instructions {
    background: var(--bg-tertiary);
    padding: 1.5rem;
    border-radius: 14px;
    margin: 2rem 0;
    border-left: 4px solid var(--accent-primary);
    display: flex;
    justify-content: space-around;
    gap: 1rem;
}

.instruction-item {
    color: var(--text-secondary);
    line-height: 1.5;
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 0.75rem;
    font-size: 1.1rem;
    flex: 1;
    text-align: center;
}

.instruction-item i {
    width: 40px;
    height: 40px;
    background: var(--accent-primary);
    color: white;
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 1.3rem;
}

.verification-error {
    background: rgba(220, 53, 69, 0.1);
    border: 1px solid rgba(220, 53, 69, 0.2);
    color: #dc3545;
    padding: 1.25rem 1.75rem;
    border-radius: 14px;
    margin: 2rem 0;
    font-weight: 500;
    font-size: 1.1rem;
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 0.75rem;
}

.verification-error i {
    font-size: 1.2rem;
}

.verification-back-link {
    display: inline-flex;
    align-items: center;
    gap: 0.75rem;
    color: var(--accent-primary);
    text-decoration: none;
    font-weight: 600;
    font-size: 1.1rem;
    padding: 1rem 2rem;
    border: 2px solid var(--accent-primary);
    border-radius: 14px;
    transition: all 0.3s ease;
    margin-top: 1.5rem;
}

.verification-back-link:hover {
    background: var(--accent-primary);
    color: white;
    transform: translateY(-2px);
    box-shadow: 0 6px 20px rgba(26, 76, 255, 0.4);
}

.verification-tips {
    margin-top: 2.5rem;
    padding-top: 2rem;
    border-top: 1px solid var(--border-color);
}

.verification-tips h3 {
    color: var(--text-primary);
    font-size: 1.2rem;
    margin-bottom: 1.5rem;
    font-weight: 600;
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 0.75rem;
}

.verification-tips-grid {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 1.5rem;
}

.tip-item {
    color: var(--text-secondary);
    font-size: 1rem;
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 0.75rem;
    text-align: center;
    line-height: 1.5;
}

.tip-item i {
    width: 40px;
    height: 40px;
    background: var(--accent-secondary);
    color: white;
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 1rem;
}

/* Responsividade */
@media (max-width: 768px) {
    .verification-container {
        margin: 1.5rem;
        padding: 2rem;
        max-width: calc(100% - 3rem);
    }
    
    .verification-instructions {
        flex-direction: column;
        gap: 1.5rem;
    }
    
    .verification-tips-grid {
        grid-template-columns: 1fr;
        gap: 1rem;
    }
    
    .verification-icon {
        width: 80px;
        height: 80px;
        margin-bottom: 1.5rem;
    }
    
    .verification-icon i {
        font-size: 2rem;
    }
    
    .verification-title {
        font-size: 1.75rem;
    }
}

@media (max-width: 480px) {
    .verification-container {
        margin: 1rem;
        padding: 1.5rem;
    }
    
    .verification-title {
        font-size: 1.5rem;
    }
}

/* Animações */
@keyframes fadeInUp {
    from {
        opacity: 0;
        transform: translateY(20px);
    }
    to {
        opacity: 1;
        transform: translateY(0);
    }
}

.verification-container {
    animation: fadeInUp 0.6s ease-out;
}

.verification-icon {
    animation: bounceIn 0.8s ease-out;
}

@keyframes bounceIn {
    0% {
        opacity: 0;
        transform: scale(0.3);
    }
    50% {
        opacity: 1;
        transform: scale(1.05);
    }
    70% {
        transform: scale(0.9);
    }
    100% {
        opacity: 1;
        transform: scale(1);
    }
}

/* =====================================
   PÁGINA DE VERIFICAÇÃO - CLASSES ÚNICAS
   ===================================== */

.token-page {
    min-height: 100vh;
    display: flex;
    align-items: center;
    justify-content: center;
    background: var(--bg-primary);
    padding: 2rem;
}

.token-container {
    max-width: 500px;
    width: 100%;
    text-align: center;
    padding: 3rem 2rem;
}

.token-icon {
    font-size: 3rem;
    margin-bottom: 1.5rem;
    color: var(--accent-primary);
}

.token-heading {
    color: var(--text-primary);
    font-size: 1.5rem;
    font-weight: 600;
    margin-bottom: 1rem;
    line-height: 1.4;
}

.token-description {
    color: var(--text-secondary);
    font-size: 1.1rem;
    line-height: 1.6;
    margin-bottom: 2rem;
}

.token-success {
    border-left: 4px solid var(--accent-secondary);
    padding-left: 1rem;
}

.token-error {
    border-left: 4px solid #dc3545;
    padding-left: 1rem;
}

.token-spinner {
    display: inline-block;
    width: 20px;
    height: 20px;
    border: 2px solid var(--border-color);
    border-top: 2px solid var(--accent-primary);
    border-radius: 50%;
    animation: tokenSpin 1s linear infinite;
    margin-right: 0.5rem;
}

@keyframes tokenSpin {
    0% { transform: rotate(0deg); }
    100% { transform: rotate(360deg); }
}

/* Estilos para a seção de limpeza */
.admin-section {
    background: var(--card-bg);
    border: 1px solid var(--border-color);
    border-radius: 8px;
    padding: 20px;
    margin: 20px 0;
    box-shadow: 0 2px 10px var(--shadow-light);
}

.admin-section h3 {
    color: var(--text-primary);
    margin-bottom: 15px;
    font-size: 1.3em;
}

.limpeza-container h4 {
    color: var(--text-primary);
    margin-bottom: 10px;
}

.limpeza-info {
    background: var(--bg-secondary);
    padding: 12px;
    border-radius: 6px;
    margin: 15px 0;
    border-left: 3px solid var(--accent-primary);
}

.limpeza-info p {
    color: var(--text-primary);
    margin: 0;
    font-weight: 500;
}

.btn-limpeza {
    background: var(--accent-primary);
    color: white;
    border: none;
    padding: 10px 20px;
    border-radius: 6px;
    cursor: pointer;
    font-size: 14px;
    transition: background 0.3s;
}

.btn-limpeza:hover:not(:disabled) {
    background: var(--accent-secondary);
}

.btn-limpeza:disabled {
    background: var(--text-secondary);
    cursor: not-allowed;
    opacity: 0.6;
}

.limpeza-resultado {
    background: var(--bg-secondary);
    padding: 12px;
    border-radius: 6px;
    margin-top: 15px;
    color: var(--text-primary);
    border-left: 3px solid var(--accent-secondary);
}