/*Write your custom style or CSS code here*/
/* --- Identidade Aplichost para Kohost --- */

/* 1. Mudar o fundo principal (Hero Section) do Azul para o nosso Preto/Azul Escuro Premium */
.hero-section, 
.header-area,
.custom-header {
    background-color: #030508 !important;
    background-image: none !important; /* Removemos padrões que possam interferir com o look limpo */
}

/* 2. Mudar a cor principal (Primary Color) para o Verde Néon da Aplichost */
:root {
    --primary-color: #00e676;
    --primary-color-hover: #00c853; /* Um tom ligeiramente mais escuro para o hover */
    --secondary-color: #2979ff; /* O azul de contraste que usámos na monitorização */
}

/* Forçar a cor verde nos botões principais */
.btn-primary, 
.button-primary,
.bg-primary {
    background-color: var(--primary-color) !important;
    border-color: var(--primary-color) !important;
    color: #030508 !important; /* Texto escuro no botão verde para máxima leitura */
    box-shadow: 0 4px 15px rgba(0, 230, 118, 0.4) !important; /* Efeito de brilho / neon */
}
.btn-primary:hover, 
.button-primary:hover {
    background-color: var(--primary-color-hover) !important;
    border-color: var(--primary-color-hover) !important;
}

/* 3. Ajustar os Links e Textos de Destaque */
a, 
.text-primary {
    color: var(--primary-color) !important;
}
a:hover {
    color: var(--primary-color-hover) !important;
}

/* 4. Barra de Navegação (Menu Superior) */
.navbar-main,
#header {
    background-color: #0b111a !important; /* A mesma cor do nosso "Cartão" de monitorização */
    border-bottom: 1px solid rgba(255, 255, 255, 0.05) !important;
}
.navbar-main .nav-link,
#header .nav-item a {
    color: #ffffff !important;
}
.navbar-main .nav-link:hover,
#header .nav-item a:hover {
    color: var(--primary-color) !important;
}

/* 5. Ícones dos atalhos (Announcements, Network Status, etc) - Imagem sshot-35 */
.shortcut-box .icon {
    color: var(--primary-color) !important;
}