/* ==========================================================================
   S3CURITY.NET — Wazuh Dashboard Theme
   File:    s3curity-wazuh.css
   Version: 1.1.0   (see CHANGELOG at end of README)
   Target:  Wazuh dashboard 4.7–4.13 (OpenSearch Dashboards 2.x / EUI v8)
   Base:    REQUIRES OSD dark mode ON (theme:darkMode = true)
   Load:    injected before </head> by nginx sub_filter, or appended to the
            osd-ui-shared-deps dark bundle (install/patch-wazuh-theme.sh)

   EDIT ONLY THE TOKEN BLOCK BELOW to retune palette or type.
   ========================================================================== */

:root {
  /* --- Surfaces ------------------------------------------------------ */
  --s3-bg:          #04070d;
  --s3-bg-grid:     rgba(34, 211, 238, 0.030);
  --s3-panel:       #070d16;
  --s3-panel-2:     #0a1320;
  --s3-panel-3:     #0f1c2b;
  --s3-line:        #14283c;
  --s3-line-soft:   rgba(34, 211, 238, 0.16);

  /* --- Ink ----------------------------------------------------------- */
  --s3-text:        #c8d6e4;   /* body copy, muted like the site         */
  --s3-text-strong: #ffffff;   /* headings                               */
  --s3-dim:         #708398;   /* eyebrows, labels, table headers        */

  /* --- Accents ------------------------------------------------------- */
  --s3-accent:      #22d3ee;   /* primary cyan: headings L2, fills, links */
  --s3-accent-ink:  #04070d;   /* text on filled cyan                    */
  --s3-accent-dim:  rgba(34, 211, 238, 0.12);
  --s3-term:        #00e08a;   /* terminal green: prompts, rules, // sep  */

  /* --- Status -------------------------------------------------------- */
  --s3-ok:          #00e08a;
  --s3-warn:        #f5a524;
  --s3-danger:      #ff3b5c;
  --s3-critical:    #ff1744;

  /* --- Type ---------------------------------------------------------- */
  /* Display: heavy uppercase grotesk (site headings)                    */
  --s3-display: "Archivo", "Inter Tight", "Inter", "Helvetica Neue",
                system-ui, -apple-system, sans-serif;
  /* Body: same grotesk at regular weight                                */
  --s3-body:    "Inter", "Archivo", system-ui, -apple-system, sans-serif;
  /* Utility: mono for labels, data, tables, code                        */
  --s3-mono:    "JetBrains Mono", "IBM Plex Mono", ui-monospace, SFMono-Regular,
                "SF Mono", Menlo, Consolas, "Liberation Mono", monospace;
  --s3-track:   0.10em;        /* uppercase tracking, matches the site   */
  --s3-radius:  0px;
}

/* --------------------------------------------------------------------------
   Optional self-hosted webfonts. Drop .woff2 files in
   /var/www/s3curity-theme/fonts/ ; absent files fall back silently.
   -------------------------------------------------------------------------- */
@font-face { font-family:"JetBrains Mono"; src:url("/s3curity/fonts/JetBrainsMono-Regular.woff2") format("woff2"); font-weight:400; font-display:swap; }
@font-face { font-family:"JetBrains Mono"; src:url("/s3curity/fonts/JetBrainsMono-Medium.woff2")  format("woff2"); font-weight:500; font-display:swap; }
@font-face { font-family:"JetBrains Mono"; src:url("/s3curity/fonts/JetBrainsMono-Bold.woff2")    format("woff2"); font-weight:700; font-display:swap; }
@font-face { font-family:"Inter";          src:url("/s3curity/fonts/Inter-Regular.woff2")         format("woff2"); font-weight:400; font-display:swap; }
@font-face { font-family:"Inter";          src:url("/s3curity/fonts/Inter-SemiBold.woff2")        format("woff2"); font-weight:600; font-display:swap; }
@font-face { font-family:"Archivo";        src:url("/s3curity/fonts/Archivo-Bold.woff2")          format("woff2"); font-weight:700; font-display:swap; }
@font-face { font-family:"Archivo";        src:url("/s3curity/fonts/Archivo-Black.woff2")         format("woff2"); font-weight:900; font-display:swap; }

/* ==========================================================================
   1. GLOBAL CANVAS
   ========================================================================== */

html, body, #osd-body, .app-wrapper, .application,
.euiPage, .euiPageBody, .euiPageTemplate, .osdBody {
  background-color: var(--s3-bg) !important;
  color: var(--s3-text);
}

body {
  font-family: var(--s3-body) !important;
  font-size: 13px;
  -webkit-font-smoothing: antialiased;
}

/* Ambient technical grid. Static, no motion. */
body::before {
  content: "";
  position: fixed;
  inset: 0;
  pointer-events: none;
  z-index: 0;
  background-image:
    linear-gradient(var(--s3-bg-grid) 1px, transparent 1px),
    linear-gradient(90deg, var(--s3-bg-grid) 1px, transparent 1px);
  background-size: 44px 44px, 44px 44px;
  mask-image: radial-gradient(ellipse at 50% 0%, #000 0%, transparent 80%);
  -webkit-mask-image: radial-gradient(ellipse at 50% 0%, #000 0%, transparent 80%);
}

#osd-body, .app-wrapper, .euiOverlayMask, .euiHeader { position: relative; z-index: 1; }

::selection { background: var(--s3-accent); color: var(--s3-accent-ink); }

* { scrollbar-color: var(--s3-line) transparent; scrollbar-width: thin; }
*::-webkit-scrollbar { width: 10px; height: 10px; }
*::-webkit-scrollbar-track { background: var(--s3-bg); }
*::-webkit-scrollbar-thumb { background: var(--s3-line); border: 2px solid var(--s3-bg); }
*::-webkit-scrollbar-thumb:hover { background: var(--s3-accent-dim); }

/* Square corners everywhere. */
.euiPanel, .euiCard, .euiButton, .euiButtonEmpty, .euiButtonIcon, .euiBadge,
.euiFieldText, .euiFieldNumber, .euiFieldSearch, .euiSelect, .euiTextArea,
.euiComboBox__inputWrap, .euiPopover__panel, .euiModal, .euiFlyout,
.euiToast, .euiCallOut, .euiFormControlLayout__childrenWrapper,
.euiCodeBlock, .euiTableRowCell, .euiFilterGroup, .euiFilterButton,
.euiSuggestItem, .euiContextMenuPanel, .euiTab, .euiAccordion {
  border-radius: var(--s3-radius) !important;
}

/* ==========================================================================
   2. TYPOGRAPHY
   ========================================================================== */

.euiTitle, .euiText h1, .euiText h2, .euiText h3, .euiText h4,
h1, h2, h3, h4 {
  font-family: var(--s3-display) !important;
  color: var(--s3-text-strong);
  font-weight: 700;
  letter-spacing: -0.005em;
  text-transform: uppercase;
}

.euiTitle--large, .euiTitle--medium { line-height: 1.08; }

/* Cyan second-tone on smaller titles, mirroring the site's two-line headings. */
.euiTitle--small, .euiTitle--extraSmall { color: var(--s3-accent) !important; }

/* Green eyebrow rule under page headers — the site's // separator colour. */
.euiPageHeader .euiTitle--large::after,
.euiPageHeader .euiTitle--medium::after {
  content: "";
  display: block;
  width: 64px;
  height: 2px;
  margin-top: 12px;
  background: linear-gradient(90deg, var(--s3-accent) 0%, var(--s3-term) 100%);
}

.euiTextColor--subdued, .euiFormHelpText, .euiFormLabel, .euiDescriptionList__title {
  font-family: var(--s3-mono) !important;
  color: var(--s3-dim) !important;
  text-transform: uppercase;
  letter-spacing: var(--s3-track);
  font-size: 10.5px;
}

a, .euiLink, .euiLink.euiLink--primary { color: var(--s3-accent) !important; text-decoration: none; }
a:hover, .euiLink:hover { text-decoration: underline; text-underline-offset: 3px; }

code, pre, .euiCodeBlock, .euiCode {
  font-family: var(--s3-mono) !important;
  background: #050a12 !important;
  border: 1px solid var(--s3-line);
  color: var(--s3-term);
}

/* ==========================================================================
   3. HEADER / CHROME  — the site's status ticker bar
   ========================================================================== */

.euiHeader, .euiHeader--dark, .headerGlobalNav, .euiHeader.euiHeader--fixed {
  background: #050a12 !important;
  border-bottom: 1px solid var(--s3-line) !important;
  box-shadow: none !important;
}

.euiHeader.euiHeader--fixed::before, .headerGlobalNav::before {
  content: "";
  position: absolute;
  top: 0; left: 0; right: 0;
  height: 2px;
  background: linear-gradient(90deg,
    var(--s3-accent) 0%, var(--s3-term) 30%, rgba(34,211,238,0.20) 62%, transparent 88%);
}

.euiHeaderSectionItemButton, .euiHeaderLink, .euiHeaderLogo__text {
  color: var(--s3-text) !important;
  font-family: var(--s3-mono) !important;
  text-transform: uppercase;
  letter-spacing: var(--s3-track);
  font-size: 11.5px;
}
.euiHeaderSectionItemButton:hover, .euiHeaderLink:hover { background: var(--s3-accent-dim) !important; }
.euiHeaderSectionItemButton__notification--dot { background: var(--s3-term) !important; }

.euiBreadcrumb, .euiBreadcrumb__content, .euiHeaderBreadcrumbs {
  font-family: var(--s3-mono) !important;
  font-size: 10.5px;
  text-transform: uppercase;
  letter-spacing: var(--s3-track);
  color: var(--s3-dim) !important;
}
.euiBreadcrumb:last-of-type .euiBreadcrumb__content { color: var(--s3-accent) !important; }
.euiBreadcrumbSeparator { background: var(--s3-line) !important; }

/* ==========================================================================
   4. NAVIGATION
   ========================================================================== */

.euiCollapsibleNav, .euiCollapsibleNav__body, .euiFlyout.euiCollapsibleNav {
  background: #050a12 !important;
  border-right: 1px solid var(--s3-line) !important;
}

.euiCollapsibleNavGroup__title, .euiCollapsibleNavGroup__heading,
.euiSideNavItem--root > .euiSideNavItemButton .euiSideNavItemButton__label {
  font-family: var(--s3-mono) !important;
  text-transform: uppercase !important;
  letter-spacing: var(--s3-track);
  font-size: 10.5px !important;
  color: var(--s3-dim) !important;
}

.euiListGroupItem__button, .euiSideNavItemButton, .euiSideNavItem a {
  font-family: var(--s3-mono) !important;
  font-size: 12px;
  color: var(--s3-text) !important;
  border-left: 2px solid transparent;
  border-radius: 0 !important;
}
.euiListGroupItem__button:hover, .euiSideNavItemButton:hover {
  background: var(--s3-accent-dim) !important;
  border-left-color: var(--s3-accent);
}
.euiListGroupItem-isActive .euiListGroupItem__button,
.euiSideNavItemButton-isSelected,
.euiSideNavItem--emphasized > .euiSideNavItemButton {
  background: var(--s3-panel-3) !important;
  border-left-color: var(--s3-accent) !important;
  color: var(--s3-accent) !important;
}

.wz-menu, .wz-menu-wrapper, .wz-menu-nav, [class^="wz-menu"] {
  background: #050a12 !important;
  border-color: var(--s3-line) !important;
}
.wz-menu-button, .wz-menu-item {
  font-family: var(--s3-mono) !important;
  text-transform: uppercase;
  letter-spacing: var(--s3-track);
}

/* ==========================================================================
   5. PANELS — corner brackets (top-left + bottom-right) and ||| tick marks
   Brackets are drawn as background gradients so ::before/::after stay free.
   ========================================================================== */

.euiPanel, .euiCard, .euiSplitPanel__inner, .euiAccordion__childWrapper {
  background-color: var(--s3-panel) !important;
  border: 1px solid var(--s3-line) !important;
  box-shadow: none !important;
}

.euiPanel--hasShadow, .euiPanel.euiPanel--hasShadow {
  box-shadow: 0 0 0 1px var(--s3-line), 0 14px 36px rgba(0, 0, 0, 0.6) !important;
}

.euiPageBody > .euiPanel,
.euiFlexItem > .euiPanel,
.euiPanel.euiPanel--paddingLarge,
.euiPanel.euiPanel--paddingMedium,
.euiCard {
  position: relative;
  background-image:
    linear-gradient(var(--s3-accent), var(--s3-accent)),
    linear-gradient(var(--s3-accent), var(--s3-accent)),
    linear-gradient(var(--s3-accent), var(--s3-accent)),
    linear-gradient(var(--s3-accent), var(--s3-accent));
  background-repeat: no-repeat;
  background-size: 14px 2px, 2px 14px, 14px 2px, 2px 14px;
  background-position: left top, left top, right bottom, right bottom;
}

/* Nested panels must not repeat the bracket motif. */
.euiPanel .euiPanel,
.euiPanel .euiCard,
.euiSplitPanel__inner .euiPanel { background-image: none !important; }

/* The ||| tick marks in the card's top-right corner. */
.euiPanel.euiPanel--paddingLarge::after,
.euiPanel.euiPanel--paddingMedium::after,
.euiCard::after {
  content: "|||";
  position: absolute;
  top: 10px; right: 14px;
  font-family: var(--s3-mono);
  font-size: 11px;
  letter-spacing: 0.22em;
  color: var(--s3-dim);
  opacity: 0.55;
  pointer-events: none;
}
.euiPanel .euiPanel::after, .euiPanel .euiCard::after { content: none; }

.euiPopover__panel, .euiContextMenuPanel, .euiModal, .euiFlyout, .euiSuggestItem {
  background-color: var(--s3-panel-2) !important;
  border: 1px solid var(--s3-line) !important;
  box-shadow: 0 18px 48px rgba(0, 0, 0, 0.65) !important;
}
.euiPopover__panelArrow::before, .euiPopover__panelArrow::after { border-color: transparent !important; }
.euiOverlayMask { background: rgba(4, 7, 13, 0.80) !important; }
.euiHorizontalRule { background-color: var(--s3-line) !important; }

/* ==========================================================================
   6. TABLES
   ========================================================================== */

.euiTable, .euiBasicTable, .euiDataGrid, .euiDataGrid__content {
  background: transparent !important;
  font-family: var(--s3-mono) !important;
  font-size: 12px;
}

.euiTableHeaderCell, .euiDataGridHeaderCell {
  background: #050a12 !important;
  border-bottom: 1px solid var(--s3-line-soft) !important;
  color: var(--s3-dim) !important;
  text-transform: uppercase;
  letter-spacing: var(--s3-track);
  font-size: 10px !important;
  font-weight: 500 !important;
}
.euiTableHeaderCell .euiTableCellContent__text { font-weight: 500 !important; }

.euiTableRow, .euiDataGridRow { background: transparent !important; }
.euiTableRow:nth-child(even) { background: rgba(255, 255, 255, 0.012) !important; }
.euiTableRow:hover, .euiTableRow.euiTableRow-isClickable:hover, .euiDataGridRow:hover {
  background: var(--s3-panel-3) !important;
  box-shadow: inset 2px 0 0 var(--s3-accent);
}
.euiTableRowCell, .euiDataGridRowCell {
  border-bottom: 1px solid rgba(20, 40, 60, 0.55) !important;
  color: var(--s3-text) !important;
}
.euiTableRow-isExpandedRow > .euiTableRowCell { background: #050a12 !important; }
.euiPagination .euiPaginationButton-isActive {
  color: var(--s3-accent) !important;
  box-shadow: inset 0 -2px 0 var(--s3-accent);
}

/* ==========================================================================
   7. CONTROLS
   ========================================================================== */

.euiButton, .euiButtonEmpty, .euiFilterButton, .euiSuperUpdateButton {
  font-family: var(--s3-mono) !important;
  text-transform: uppercase;
  letter-spacing: var(--s3-track);
  font-size: 11px !important;
  font-weight: 500 !important;
  transition: background 120ms ease, box-shadow 120ms ease, color 120ms ease;
}

.euiButton:not(.euiButton--fill) {
  background: transparent !important;
  border: 1px solid #33465c !important;
  color: var(--s3-text-strong) !important;
}
.euiButton:not(.euiButton--fill):hover {
  border-color: var(--s3-accent) !important;
  color: var(--s3-accent) !important;
  background: var(--s3-accent-dim) !important;
}

.euiButton--fill, .euiButton.euiButton--primary.euiButton--fill, .euiSuperUpdateButton {
  background: var(--s3-accent) !important;
  border-color: var(--s3-accent) !important;
  color: var(--s3-accent-ink) !important;
  font-weight: 700 !important;
  box-shadow: none !important;
}
.euiButton--fill:hover { filter: brightness(1.10); }
.euiButton--danger.euiButton--fill {
  background: var(--s3-danger) !important;
  border-color: var(--s3-danger) !important;
  color: #fff !important;
}
.euiButtonEmpty { color: var(--s3-accent) !important; }
.euiButtonIcon { color: var(--s3-dim) !important; }
.euiButtonIcon:hover { color: var(--s3-accent) !important; background: var(--s3-accent-dim) !important; }

.euiFieldText, .euiFieldNumber, .euiFieldSearch, .euiSelect, .euiTextArea,
.euiComboBox__inputWrap, .euiFormControlLayout__childrenWrapper,
.euiDatePicker, .euiSuperDatePicker__prettyFormat {
  background-color: #050a12 !important;
  background-image: none !important;
  border: 1px solid var(--s3-line) !important;
  color: var(--s3-text) !important;
  font-family: var(--s3-mono) !important;
  box-shadow: none !important;
}
.euiFieldText:focus, .euiFieldSearch:focus, .euiTextArea:focus,
.euiComboBox-isOpen .euiComboBox__inputWrap {
  border-color: var(--s3-accent) !important;
  box-shadow: 0 0 0 1px var(--s3-accent), 0 0 18px rgba(34, 211, 238, 0.18) !important;
}
input::placeholder, textarea::placeholder { color: #4e6073 !important; }

/* Query bar as a terminal prompt — green caret, like the site's hero line. */
.globalQueryBar, .osdQueryBar, .globalFilterBar {
  background: transparent !important;
  border-bottom: 1px solid var(--s3-line);
}
.osdQueryBar { position: relative; }
.osdQueryBar .euiFieldText { padding-left: 30px !important; }
.osdQueryBar::before {
  content: ">";
  position: absolute;
  left: 13px; top: 50%;
  transform: translateY(-52%);
  color: var(--s3-term);
  font-family: var(--s3-mono);
  font-size: 14px;
  z-index: 3;
  pointer-events: none;
}

.euiFilterGroup, .euiFilterButton, .globalFilterItem {
  background: var(--s3-panel-2) !important;
  border: 1px solid var(--s3-line) !important;
  color: var(--s3-text) !important;
}
.globalFilterItem-isDisabled { opacity: 0.45; }

.euiTabs { border-bottom: 1px solid var(--s3-line) !important; }
.euiTab {
  font-family: var(--s3-mono) !important;
  text-transform: uppercase;
  letter-spacing: var(--s3-track);
  font-size: 11px !important;
  color: var(--s3-dim) !important;
}
.euiTab:hover { color: var(--s3-text-strong) !important; }
.euiTab-isSelected, .euiTab.euiTab-isSelected .euiTab__content {
  color: var(--s3-accent) !important;
  box-shadow: inset 0 -2px 0 var(--s3-accent) !important;
}

.euiCheckbox__input:checked + .euiCheckbox__square,
.euiRadio__input:checked + .euiRadio__circle,
.euiSwitch__button[aria-checked="true"] .euiSwitch__body {
  background-color: var(--s3-accent) !important;
  border-color: var(--s3-accent) !important;
}

*:focus-visible { outline: 2px solid var(--s3-accent) !important; outline-offset: 1px; }

/* ==========================================================================
   8. STATUS + STATS — mono label, big value, green underline (site stat cards)
   ========================================================================== */

.euiBadge {
  font-family: var(--s3-mono) !important;
  text-transform: uppercase;
  letter-spacing: var(--s3-track);
  font-size: 10px !important;
  border: 1px solid currentColor;
  background: transparent !important;
}
.euiBadge.euiBadge--hollow { background: var(--s3-panel-2) !important; }

.euiCallOut { background: var(--s3-panel-2) !important; border-left: 3px solid var(--s3-accent) !important; }
.euiCallOut--warning { border-left-color: var(--s3-warn) !important; }
.euiCallOut--danger  { border-left-color: var(--s3-danger) !important; }
.euiCallOut--success { border-left-color: var(--s3-ok) !important; }

.euiToast { background: var(--s3-panel-2) !important; border-left: 3px solid var(--s3-accent) !important; }
.euiToast--danger  { border-left-color: var(--s3-danger) !important; }
.euiToast--warning { border-left-color: var(--s3-warn) !important; }
.euiToast--success { border-left-color: var(--s3-ok) !important; }

.wz-severity-critical, .euiBadge--danger  { color: var(--s3-critical) !important; }
.wz-severity-high,     .euiBadge--warning { color: var(--s3-warn) !important; }
.wz-severity-medium                        { color: #ffd166 !important; }
.wz-severity-low,      .euiBadge--success  { color: var(--s3-ok) !important; }

.euiStat { position: relative; }
.euiStat__title {
  font-family: var(--s3-display) !important;
  font-weight: 700 !important;
  color: var(--s3-accent) !important;
  letter-spacing: -0.01em;
}
.euiStat__description {
  font-family: var(--s3-mono) !important;
  text-transform: uppercase;
  letter-spacing: var(--s3-track);
  font-size: 10px !important;
  color: var(--s3-dim) !important;
}
.euiStat::after {
  content: "";
  display: block;
  height: 2px;
  width: 72px;
  margin-top: 10px;
  background: linear-gradient(90deg, var(--s3-term) 0%, rgba(0, 224, 138, 0) 100%);
}

.euiLoadingSpinner { border-color: var(--s3-line) !important; border-top-color: var(--s3-accent) !important; }
.euiProgress__data, .euiProgress { background-color: var(--s3-line) !important; }
.euiProgress__toggle, .euiProgress--primary::-webkit-progress-value { background-color: var(--s3-accent) !important; }

/* ==========================================================================
   9. VISUALIZATIONS
   ========================================================================== */

.echChart, .echChartBackground, .visualization, .visChart, .visEditor { background: transparent !important; }
.echLegendItem__label, .visLegend__valueTitle, .echLegend {
  font-family: var(--s3-mono) !important;
  font-size: 10.5px !important;
  color: var(--s3-dim) !important;
  text-transform: uppercase;
  letter-spacing: var(--s3-track);
}
.echGridLine, .echAxis line, .echAxis path { stroke: var(--s3-line) !important; }
.echTooltip, .echTooltip__header {
  background: var(--s3-panel-2) !important;
  border: 1px solid var(--s3-line-soft) !important;
  font-family: var(--s3-mono) !important;
  color: var(--s3-text) !important;
}

.dshLayout--viewing .euiPanel, .dshDashboardGrid__item .embPanel {
  background: var(--s3-panel) !important;
  border: 1px solid var(--s3-line) !important;
}
.embPanel__title, .embPanel__titleText {
  font-family: var(--s3-mono) !important;
  text-transform: uppercase;
  letter-spacing: var(--s3-track);
  font-size: 10.5px !important;
  color: var(--s3-dim) !important;
}

.dscTable, .dscDocTable, .dscSidebar, .dscFieldList {
  background: transparent !important;
  font-family: var(--s3-mono) !important;
}
.dscSidebar__item:hover { background: var(--s3-accent-dim) !important; }

/* ==========================================================================
   10. LOGIN PAGE
   ========================================================================== */

.login-wrapper, body.login-body {
  background: radial-gradient(1200px 620px at 50% -10%, #08192a 0%, var(--s3-bg) 62%) !important;
}
.login-wrapper .euiPanel {
  background: var(--s3-panel) !important;
  border: 1px solid var(--s3-line) !important;
  box-shadow: 0 0 0 1px rgba(34, 211, 238, 0.08), 0 30px 80px rgba(0, 0, 0, 0.7) !important;
}
.login-header, .login-title {
  font-family: var(--s3-display) !important;
  text-transform: uppercase;
  color: var(--s3-text-strong) !important;
}
.login-wrapper .euiPanel::after {
  content: "> SYSTEMS ONLINE // AUTHORIZED ACCESS ONLY";
  display: block;
  position: static;
  margin-top: 18px;
  font-family: var(--s3-mono);
  font-size: 10px;
  letter-spacing: 0.14em;
  color: var(--s3-term);
  opacity: 0.8;
  text-align: center;
}

/* ==========================================================================
   11. MISC
   ========================================================================== */

.homWelcome, .homHome, .osdWelcomeView, .homDataAdd { background: var(--s3-bg) !important; }

.euiPanel[style*="background-color: rgb(255, 255, 255)"],
[style*="background: #FFF"], [style*="background: #ffffff"] {
  background-color: var(--s3-panel) !important;
}

@media (prefers-reduced-motion: reduce) {
  *, *::before, *::after {
    animation-duration: 0.001ms !important;
    transition-duration: 0.001ms !important;
  }
}

@media (max-width: 768px) {
  body::before { display: none; }
  .euiPanel, .euiCard { background-image: none !important; }
  .euiPanel::after, .euiCard::after { content: none !important; }
}

@media print {
  body::before { display: none; }
  html, body { background: #fff !important; color: #000 !important; }
}