/*
 * Identidad visual GigaCloud SOC
 * Primera versión conservadora.
 */

/* Encabezado principal */
.euiHeader {
    background-color: #0A1826 !important;
    border-bottom: 1px solid #24445F !important;
    box-shadow: inset 0 -1px 0 #24445F !important;
}

.euiHeaderSectionItem,
.euiHeaderLogo {
    background-color: transparent !important;
}

/* Navegación lateral */
.euiNavDrawer,
.euiCollapsibleNav,
.euiCollapsibleNav__inner {
    background-color: #0A1826 !important;
    border-color: #24445F !important;
}

/* Fondo interno de las aplicaciones */
.euiPageTemplate,
.euiPageTemplate__main,
.euiPageTemplate__mainContent,
.euiPageBody,
.euiPageContent {
    background-color: #071321 !important;
}

/* Paneles y tarjetas, limitados al área interna */
.euiPageTemplate .euiPanel,
.euiPageTemplate .euiCard,
.euiPageTemplate .euiFlyout,
.euiPageTemplate .euiPopover__panel,
.euiPageTemplate .euiContextMenuPanel {
    background-color: #0D2032 !important;
    border-color: #24445F !important;
}

/* Campos y filtros internos */
.euiPageTemplate .euiFieldText,
.euiPageTemplate .euiFieldPassword,
.euiPageTemplate .euiSelect,
.euiPageTemplate .euiTextArea,
.euiPageTemplate .euiFormControlLayout {
    background-color: #10283D !important;
    border-color: #24445F !important;
    color: #F4F8FB !important;
}

/* Textos */
.euiPageTemplate .euiTitle,
.euiPageTemplate .euiText,
.euiPageTemplate .euiFormLabel,
.euiPageTemplate .euiTableCellContent {
    color: #F4F8FB !important;
}

.euiPageTemplate .euiTextColor--subdued,
.euiPageTemplate .euiFormHelpText {
    color: #B6C7D6 !important;
}

/* Enlaces y elementos seleccionados */
.euiPageTemplate a,
.euiPageTemplate .euiLink,
.euiPageTemplate .euiButtonEmpty,
.euiPageTemplate .euiButtonIcon {
    color: #08B7E8 !important;
}

.euiPageTemplate .euiTab-isSelected {
    color: #08B7E8 !important;
    box-shadow: inset 0 -2px 0 #08B7E8 !important;
}

/* Botones principales */
.euiPageTemplate .euiButton--primary.euiButton--fill {
    background-color: #08B7E8 !important;
    border-color: #08B7E8 !important;
    color: #071321 !important;
}

/* =========================================================
   Interacción GigaCloud SOC: selección, hover y foco
   No modifica colores de gráficas ni niveles de severidad.
   ========================================================= */

:root {
    --gigacloud-cyan: #08B7E8;
    --gigacloud-cyan-soft: rgba(8, 183, 232, 0.12);
    --gigacloud-cyan-border: rgba(8, 183, 232, 0.65);
}

/* Pestañas */
.euiTab {
    transition:
        color 160ms ease,
        background-color 160ms ease,
        box-shadow 160ms ease;
}

.euiTab:hover:not(.euiTab-isDisabled) {
    color: var(--gigacloud-cyan) !important;
    background-color: var(--gigacloud-cyan-soft) !important;
}

.euiTab.euiTab-isSelected,
.euiTab-isSelected {
    color: var(--gigacloud-cyan) !important;
    box-shadow: inset 0 -3px 0 var(--gigacloud-cyan) !important;
    background-color: rgba(8, 183, 232, 0.08) !important;
}

/* Opciones activas en navegación */
.euiListGroupItem,
.euiSideNavItemButton {
    transition:
        color 160ms ease,
        background-color 160ms ease,
        border-color 160ms ease;
}

.euiListGroupItem:hover,
.euiSideNavItemButton:hover {
    color: var(--gigacloud-cyan) !important;
    background-color: var(--gigacloud-cyan-soft) !important;
}

.euiListGroupItem-isActive,
.euiSideNavItemButton-isSelected {
    color: var(--gigacloud-cyan) !important;
    background-color: rgba(8, 183, 232, 0.16) !important;
    border-left: 3px solid var(--gigacloud-cyan) !important;
}

/* Tarjetas clicables */
.euiPageTemplate .euiCard,
.euiPageTemplate .euiPanel.euiPanel--isClickable,
.euiPageTemplate a.euiPanel {
    transition:
        border-color 160ms ease,
        box-shadow 160ms ease,
        transform 160ms ease,
        background-color 160ms ease;
}

.euiPageTemplate .euiCard:hover,
.euiPageTemplate .euiPanel.euiPanel--isClickable:hover,
.euiPageTemplate a.euiPanel:hover {
    border-color: var(--gigacloud-cyan-border) !important;
    box-shadow:
        0 0 0 1px rgba(8, 183, 232, 0.22),
        0 8px 20px rgba(0, 0, 0, 0.22) !important;
    background-color: #10283D !important;
    transform: translateY(-1px);
}

/* Botones e iconos */
.euiButtonEmpty,
.euiButtonIcon {
    transition:
        color 160ms ease,
        background-color 160ms ease,
        box-shadow 160ms ease;
}

.euiButtonEmpty:hover,
.euiButtonIcon:hover {
    color: var(--gigacloud-cyan) !important;
    background-color: var(--gigacloud-cyan-soft) !important;
}

/* Botón principal */
.euiButton--primary.euiButton--fill:hover {
    background-color: #27C5F1 !important;
    border-color: #27C5F1 !important;
    box-shadow: 0 0 14px rgba(8, 183, 232, 0.35) !important;
}

/* Foco visible por teclado */
.euiPageTemplate a:focus-visible,
.euiPageTemplate button:focus-visible,
.euiPageTemplate input:focus-visible,
.euiPageTemplate select:focus-visible {
    outline: 2px solid var(--gigacloud-cyan) !important;
    outline-offset: 2px !important;
}