/* cm-a11y 20260916. Keyboard focus is visible on dark and light backgrounds. */
a:focus-visible, button:focus-visible, input:focus-visible, select:focus-visible, textarea:focus-visible,
.notification[data-cm-feedback]:focus { outline: 3px solid #0876db !important; outline-offset: 3px !important; box-shadow: 0 0 0 2px #fff !important; }
.cm-menu-parent { position: relative; }
.cm-menu-parent > a { padding-inline-end: 30px !important; } /* JS repeats this inline: theme per-item rules use higher-specificity !important */
.cm-menu-parent > a::after, .cm-menu-parent > a > .open-menu { display: none !important; }
/* Porto draws its nested-level arrow in a::before; our toggle replaces it. */
.porto-narrow-sub-menu li.cm-menu-parent > a::before { display:none !important; }
/* Toggle: borderless 24x24 hit area, vertically centred on the link (JS sets exact top/colour; 50% is the fallback). */
.cm-menu-parent > .cm-submenu-toggle { position:absolute; inset-inline-end:3px; top:50%; transform:translateY(-50%); z-index:5; display:flex; align-items:center; justify-content:center; width:24px; min-width:24px; height:24px; min-height:24px; margin:0; padding:0; border:0 !important; border-radius:4px; background:transparent !important; box-shadow:none; color:inherit; font-size:0 !important; line-height:1; cursor:pointer; }
.cm-menu-parent > .cm-submenu-toggle.cm-placed { transform:none; }
.cm-menu-parent > .cm-submenu-toggle::before { content:""; display:block; width:7px; height:7px; border-right:2px solid currentColor; border-bottom:2px solid currentColor; transform:translateY(-2px) rotate(45deg); transition:transform .15s; }
.cm-menu-parent > .cm-submenu-toggle[aria-expanded="true"]::before { transform:translateY(2px) rotate(225deg); }
.cm-menu-open > .dropdown-menu, .cm-menu-open > .popup, .cm-menu-open > .sub-menu, .cm-menu-open > .collapse { display:block !important; visibility:visible !important; opacity:1 !important; pointer-events:auto !important; }
.cm-menu-closed > .dropdown-menu, .cm-menu-closed > .popup, .cm-menu-closed > .sub-menu, .cm-menu-closed > .collapse { display:none !important; }
.notification[data-cm-feedback] .notification-close { min-width:32px; min-height:32px; }
.cm-sr-only { position:absolute !important; width:1px !important; height:1px !important; padding:0 !important; margin:-1px !important; overflow:hidden !important; clip:rect(0,0,0,0) !important; white-space:nowrap !important; border:0 !important; }
/* Porto hides popups at top:-3000px and shows them only on :hover — mirror that for keyboard. */
.mega-menu > li.cm-menu-open > .popup, .mega-menu > li.menu-item:focus-within > .popup { top:100% !important; }
.mega-menu li.cm-menu-open > .sub-menu, .mega-menu li:focus-within > .sub-menu { display:block !important; visibility:visible !important; opacity:1 !important; }
/* Porto keeps the popup and its links shifted up 5px (translate3d) until :hover; mirror the hover end state. */
.mega-menu > li.cm-menu-open .popup, .mega-menu > li.menu-item:focus-within .popup,
.mega-menu > li.cm-menu-open li.menu-item > a, .mega-menu > li.menu-item:focus-within li.menu-item > a { transform:translate3d(0,0,0) !important; }
/* cm-a11y-ddcontrast: Journal3 header sets main-menu dropdown links to #fff while the scheme background is #fff (white on white). */
.desktop-main-menu-wrapper .main-menu-item.multi-level.dropdown .j-dropdown > .j-menu { background:#1c2024 !important; }
.desktop-main-menu-wrapper .main-menu-item.multi-level.dropdown .j-dropdown > .j-menu > li > a,
.desktop-main-menu-wrapper .main-menu-item.multi-level.dropdown .j-dropdown > .j-menu > li > a > .links-text { color:#fff !important; }
.desktop-main-menu-wrapper .main-menu-item.multi-level.dropdown .j-dropdown > .j-menu > li:hover > a,
.desktop-main-menu-wrapper .main-menu-item.multi-level.dropdown .j-dropdown > .j-menu > li > a:focus-visible { background:#f0f0f0 !important; color:#1a1a1a !important; }
.desktop-main-menu-wrapper .main-menu-item.multi-level.dropdown .j-dropdown > .j-menu > li:hover > a > .links-text,
.desktop-main-menu-wrapper .main-menu-item.multi-level.dropdown .j-dropdown > .j-menu > li > a:focus-visible > .links-text { color:#1a1a1a !important; }
.desktop-main-menu-wrapper .main-menu-item.multi-level.dropdown > .j-dropdown::before { border-bottom-color:#1c2024 !important; }

/* Porto mobile accordion arrow is made focusable by JS: give it the same visible focus ring. */
.accordion-menu li > .arrow[role="button"]:focus-visible { outline:3px solid #0876db !important; outline-offset:-3px !important; }
