/* Zenith Security Co. - zenith-additions.css, Release 1b, head-css item, set "S" (smallest safe set).
   Linked last in <head> by the theme layout file Magento_Theme/layout/default_head_blocks.xml (see items/head-css/ITEM-SPEC.md).
   This file holds ONLY rules that (a) need no template, CMS, admin or JavaScript change that is not part of the release and
   (b) change nothing a sighted visitor can see. Every other rule of the v3 / v3.2 / v3.3 additions is deliberately not here:
   rules that change the look or the layout need the owner's approval, rules that were lab-tested only together with the CMS /
   admin layers are not safe on their own, and rules already appended to zenithstyle.css by Release 1 are not repeated. */

/* S1 (v3 additions section 1, layout stability): Magento prints "The store will not work correctly when cookies are disabled" at the top of
   every page and hides it with an inline script at the END of <body> (style.display = "none", seen in the live page source). Until that script
   runs the sentence is painted and the whole page jumps up when it disappears. Nothing changes when cookies are on: the script hides the same
   element anyway. When cookies really are off, cookie-status.js turns the element into a modal, which already has to work with the inline
   display:none the script leaves behind; this rule only applies that same state earlier. Verbatim from the v3 file. */
#cookie-status.cookie-status-message { display: none; }

/* S2 (v3.2 batch A11Y, rule V31-A11Y-H1, breakpoint corrected): the home page H1 is display:none on phones and tablets (zenithstyle.css hides
   ".search-bar h1" at max-width 991 px and below), so screen-reader users had no page heading. It is made visually hidden instead: same
   look for sighted visitors (a 1 px clipped box that takes no space), but it stays in the accessibility tree. The v3.2 rule used
   max-width 1023 px, which would also hide the H1 where the theme still shows it (992-1023 px); the theme's own breakpoint, 991 px, is used here.
   Scope: the home page only (body.cms-index-index). */
@media (max-width: 991px) {
    .cms-index-index .wraper.search-bar h1 { display: block !important; position: absolute !important; width: 1px; height: 1px; padding: 0; margin: -1px; overflow: hidden; clip: rect(0, 0, 0, 0); white-space: nowrap; border: 0; }
}

/* S3-BEGIN (v3 additions section 5, the site-wide keyboard focus ring; this is the visible change the owner approved as V8, "dark-blue focus rings for keyboard users").
   The theme removes every outline (live zenithstyle.css ":focus { outline: none }", styles-m.css "*:focus { box-shadow: none; outline: 0 }"). Release 1 adds rings only for the
   trade-form tick boxes and the hero arrows, so every other control - the header links, the form fields and the product-carousel arrows that a11y-enhance.js makes
   reachable by Tab - shows no focus at all. This is the v3 rule, selectors and values unchanged; !important, so its place in the cascade does not matter.
   VISIBLE: keyboard users see a 3 px dark-blue ring with a white halo on the focused control. A mouse click into a text field, select or textarea shows it too (browsers treat
   those as focus-visible); links and buttons clicked with the mouse do not. It was part of the lab additions file in every v33-all run (so it was tested together with F11, F2 and F4).
   To ship without it: build with  node tools/build-additions.js build <out> --without-S3 . */
a:focus-visible, button:focus-visible, input:focus-visible, select:focus-visible, textarea:focus-visible,
summary:focus-visible, [tabindex]:focus-visible { outline: 3px solid #1a3d6d !important; outline-offset: 2px !important; box-shadow: 0 0 0 5px #fff !important; }
/* S3-END */
