/* Eve WebTools — harmonisation layer for the site home page.
   Load it LAST on /index.html, after styles.css (ships as /harmonised.css).
   The home page is four module tiles and the legal notice, so the layer is small.
   The consent bar is styled by /lib/ewt-analytics.js, not here. */

:root {
    --textColor2: #6b6b6b;                 /* quiet text: was #474747 */
    --btnTextColourNormal: #6b6b6b;
    --btnTextColourHover: #9e9e9e;
    --btnTextColourSelected: #d2d2d2;
    --btnMark: inset 0 -2px 0 #d2d2d2;
}

/* ============================================================ 1. module tiles */
/* whole-card hover: the module mark and name brighten together, as today (module marks are left as they are) */
.appWrappers { transition: color .15s linear, fill .15s linear; }

/* ============================================================ 2. legal notice: quiet text, no px */
#LegalNotice { font-size: 1em; color: var(--textColor2); padding: 0 16px 8px; box-sizing: border-box; width: 100%; }
#prelegnot { font-size: 0.7857em; }
#legnot { font-size: 0.7143em !important; line-height: 1.35; }
/* short windows: the notice follows the tiles instead of sitting on top of them */
@media (max-height: 860px) {
    #mainPrime-contentWrapper { justify-content: flex-start; }
    #appList { margin: auto 0; padding: 16px 0; flex-shrink: 0; }
    #LegalNotice { position: static; flex-shrink: 0; }
}

/* ============================================================ 3. keyboard focus */
a:focus-visible, button:focus-visible, [tabindex]:focus-visible { outline: 1px solid #d2d2d2; outline-offset: 2px; }

/* ============================================================ 4. motion */
@media (prefers-reduced-motion: reduce) { * { animation: none !important; transition: none !important; } }

/* ============================================================ scrollbars: one dark bar, 10px, thumb #313131 -> #6b6b6b -> #9e9e9e */
*::-webkit-scrollbar { width: 10px !important; height: 10px !important; }
*::-webkit-scrollbar-track, *::-webkit-scrollbar-corner { background: transparent !important; }
*::-webkit-scrollbar-button { display: none !important; }
*::-webkit-scrollbar-thumb { background-color: #313131 !important; border: 2px solid transparent !important; background-clip: padding-box !important; border-radius: 0 !important; min-height: 28px; }
*::-webkit-scrollbar-thumb:hover { background-color: #6b6b6b !important; }
*::-webkit-scrollbar-thumb:active { background-color: #9e9e9e !important; }
textarea::-webkit-scrollbar { width: 6px !important; height: 6px !important; }
textarea::-webkit-scrollbar-thumb { border-width: 1px !important; }
/* Chromium ignores the rules above on any element that sets scrollbar-color, so clear it there; Firefox has no ::-webkit-scrollbar and takes the standard properties */
@supports selector(::-webkit-scrollbar) { * { scrollbar-color: auto !important; } }
@supports not selector(::-webkit-scrollbar) { * { scrollbar-width: thin; scrollbar-color: #313131 transparent !important; } }