9B534B8686E580E0E01768F00155B461

at path：ROOT / wp-content / themes / oceanwp / sass / a11y.scss

run：R W Run

base

DIR

2026-07-10 16:52:18

R W Run

components

DIR

2026-07-10 16:52:18

R W Run

edd

DIR

2026-07-10 16:52:18

R W Run

learndash

DIR

2026-07-10 16:52:18

R W Run

llms

DIR

2026-07-10 16:52:18

R W Run

woo

DIR

2026-07-10 16:52:18

R W Run

_config.scss

2.51 KB

2023-09-06 12:38:32

R W Run

_layout.scss

9.96 KB

2026-05-20 12:50:00

R W Run

_mixins.scss

3.31 KB

2023-09-06 12:38:32

R W Run

a11y.scss

27.32 KB

2026-07-01 12:41:12

R W Run

blog-post-headers.scss

32.2 KB

2023-11-07 11:31:00

R W Run

edd.scss

204 By

2023-09-06 12:38:32

R W Run

gutenberg-editor.scss

3.38 KB

2026-06-29 21:46:40

R W Run

hover-style.scss

10.12 KB

2023-05-23 11:21:48

R W Run

learndash.scss

202 By

2023-09-06 12:38:32

R W Run

llms.scss

188 By

2023-09-06 12:38:32

R W Run

style.scss

2.11 KB

2026-07-01 12:41:12

R W Run

stylesheet.scss

5.46 KB

2023-09-06 12:38:32

R W Run

wishlist.scss

1.45 KB

2023-09-06 12:38:32

R W Run

woo-floating-bar.scss

4.3 KB

2026-06-29 21:46:40

R W Run

woo-mini-cart.scss

6.06 KB

2023-09-06 12:38:32

R W Run

woo-multistep-checkout.scss

4.95 KB

2025-01-27 17:04:16

R W Run

woo-quick-view.scss

6.17 KB

2023-09-06 12:38:32

R W Run

woocommerce.scss

368 By

2023-09-06 12:38:32

R W Run

error_log

📄a11y.scss

// Configuration
@import "config";

// Mixins
@import "mixins";

// Focus-visible helpers.
// Keep :focus as the fallback for browsers that do not understand :focus-visible.
// Modern browsers suppress the ring for pointer/click focus through :focus:not(:focus-visible).
@mixin owp-focus-ring($offset: var(--owp-focus-outline-offset, 2px)) {
    outline: var(--owp-focus-outline-width, 2px) solid var(--owp-focus-outline-color, currentColor);
    outline-offset: $offset;
}

@mixin owp-focus-visible-only($offset: var(--owp-focus-outline-offset, 2px)) {
    &:focus {
        @include owp-focus-ring($offset);
        }

&:focus:not(:focus-visible) {
        outline: none;
    }

&:focus-visible {
        @include owp-focus-ring($offset);
    }
}

@mixin owp-form-focus-ring() {
    border-color: var(--owp-form-focus-border-color, var(--owp-input-border-color, var(--owp-focus-outline-color, currentColor)));
    outline: var(--owp-form-focus-outline-width, 0) solid transparent;
    box-shadow: 0 0 0 4px rgba(0, 122, 153, 0.18);
    box-shadow: 0 0 0 4px color-mix(
        in srgb,
        var(--owp-focus-outline-color, currentColor) 18%,
        transparent
    );
}

body input[type="button"],
body input[type="reset"],
body input[type="submit"],
body button[type="submit"],
body .theme-button,
body .button,
body div.wpforms-container-full .wpforms-form input[type="submit"],
body div.wpforms-container-full .wpforms-form button[type="submit"],
body div.wpforms-container-full .wpforms-form .wpforms-page-button,
body.woocommerce-cart .wp-element-button,
body.woocommerce-checkout .wp-element-button,
body .wp-block-button__link {
    background-color: var(--owp-button-bg-color, #{$color-5});
    color: var(--owp-button-text-color, #ffffff);
    font-size: var(--owp-button-font-size, 12px);
    font-weight: var(--owp-button-font-weight, 600);
    text-transform: var(--owp-button-text-transform, uppercase);
    padding: var(--owp-button-padding-top, 14px)
        var(--owp-button-padding-right, 20px)
        var(--owp-button-padding-bottom, 14px)
        var(--owp-button-padding-left, 20px);
    letter-spacing: var(--owp-button-letter-spacing, 0.1em);
    line-height: var(--owp-button-line-height, 1);
}

body input[type="button"]:hover,
body input[type="reset"]:hover,
body input[type="submit"]:hover,
body button[type="submit"]:hover,
body input[type="button"]:active,
body input[type="reset"]:active,
body input[type="submit"]:active,
body button[type="submit"]:active,
body input[type="button"]:focus,
body input[type="reset"]:focus,
body input[type="submit"]:focus,
body button[type="submit"]:focus,
body .theme-button:hover,
body .theme-button:focus,
body .button:hover,
body .button:focus,
body div.wpforms-container-full .wpforms-form input[type="submit"]:hover,
body div.wpforms-container-full .wpforms-form input[type="submit"]:active,
body div.wpforms-container-full .wpforms-form button[type="submit"]:hover,
body div.wpforms-container-full .wpforms-form button[type="submit"]:active,
body div.wpforms-container-full .wpforms-form .wpforms-page-button:hover,
body div.wpforms-container-full .wpforms-form .wpforms-page-button:active,
body.woocommerce-cart .wp-element-button:hover,
body.woocommerce-checkout .wp-element-button:hover,
body .wp-block-button__link:hover,
body .wp-block-button__link:focus {
    background-color: var(--owp-button-bg-color-hover, #0b7cac);
    color: var(--owp-button-text-color-hover, #ffffff);
    @include transition( all .3s ease );
}

body :where(
    a[href],
    area[href],
    button:not([disabled]),
    input:not([type="hidden"]):not([disabled]),
    select:not([disabled]),
    textarea:not([disabled]),
    summary,
    iframe,
    [tabindex]:not([tabindex="-1"]),
    [role="button"],
    [role="link"],
    [role="menuitem"],
    [role="tab"],
    [contenteditable="true"]
) {
    @include owp-focus-visible-only;
}

body :where(
    input[type="button"]:not([disabled]),
    input[type="reset"]:not([disabled]),
    input[type="submit"]:not([disabled]),
    button[type="submit"]:not([disabled]),
    .theme-button,
    .button,
    div.wpforms-container-full .wpforms-form input[type="submit"],
    div.wpforms-container-full .wpforms-form button[type="submit"],
    div.wpforms-container-full .wpforms-form .wpforms-page-button,
    .wp-block-button__link,
    .wp-element-button
):focus-visible {
    outline-color: var(
        --owp-button-focus-outline-color,
        var(--owp-primary-color, currentColor)
    );
}

@media (forced-colors: active) {
    body :where(
        a[href],
        area[href],
        button:not([disabled]),
        input:not([type="hidden"]):not([disabled]),
        select:not([disabled]),
        textarea:not([disabled]),
        summary,
        iframe,
        [tabindex]:not([tabindex="-1"]),
        [role="button"],
        [role="link"],
        [role="menuitem"],
        [role="tab"],
        [contenteditable="true"]
    ):focus-visible {
        outline-color: Highlight;
    }
}

form :where(
    input:not([type]),
    input[type="text"],
    input[type="password"],
    input[type="email"],
    input[type="url"],
    input[type="date"],
    input[type="month"],
    input[type="time"],
    input[type="datetime"],
    input[type="datetime-local"],
    input[type="week"],
    input[type="number"],
    input[type="search"],
    input[type="tel"],
    input[type="color"],
    select,
    textarea
) {
    &:focus {
        @include owp-form-focus-ring;
    }

&:focus:not(:focus-visible) {
        box-shadow: none;
    }

&:focus-visible {
        @include owp-form-focus-ring;
    }

&:focus-within {
        border: 2px solid var(--owp-input-border-color);
        box-shadow: 0 0 0 4px color-mix(
            in srgb,
            var(--owp-focus-outline-color) 18%,
            transparent
        );
    }
}

.sidebar-container.widget-area {
    a {
        color: var(--owp-widget-link-color, var(--owp-link-color, #333333));
        text-decoration: var(--owp-widget-link-text-decoration, underline) 0.1em;
        text-underline-offset: var(--owp-widget-link-underline-offset, 0.2em);

&:hover {
            color: var(--owp-widget-link-color-hover, var(--owp-link-color-hover, #{$color-5}));
            text-decoration: none;
            @include transition( all .3s ease );
        }

&:focus-visible {
            outline: var(--owp-focus-outline-width) solid var(--owp-focus-outline-color, currentColor);
            text-decoration: none;
            outline-offset: var(--owp-focus-outline-offset);
        }
    }
}

.header-search-visible-label,
.medium-header-search-visible-label,
.vertical-header-search-visible-label,
.mobile-fs-search-visible-label,
#icon-searchform-overlay form .mobile-overlay-search-visible-label,
.oceanwp-mobile-menu-search-visible-label,
.mobile-dropdown-search-visible-label {
    color: var(--owp-search-form-label-color, inherit);
    font-size: var(--owp-search-form-label-font-size, inherit);
}

.comment-form-visible-label {
    color: var(--owp-comment-form-label-color, inherit);
    font-size: var(--owp-comment-form-label-font-size, inherit);
}

.comment-form-visible-label span {
    color: var(--owp-comment-form-label-required-mark-color, inherit);
}

.oceanwp-social-menu {

ul li a {
        position: relative;
    }

.header-social-menu-external-mark {

--owp-social-external-mark-padding: calc(var(--owp-social-external-mark-size) * 0.25);

position: absolute;
        inset-block-start: var(--owp-social-external-mark-offset-y);
        inset-inline-end: var(--owp-social-external-mark-offset-x);

width: var(--owp-social-external-mark-size);
        height: var(--owp-social-external-mark-size);
        padding: var(--owp-social-external-mark-padding);

display: block;
        box-sizing: content-box;

color: var(--owp-social-external-mark-color);
        fill: currentColor;
        background-color: var(--owp-social-external-mark-bg);
        border-radius: 50%;

line-height: 1;
        pointer-events: none;
        z-index: 1;
    }
}

#top-bar-social {

ul li a {
        position: relative;
    }
    
    .top-bar-social-menu-external-mark {

--owp-topbar-social-external-mark-padding: calc(var(--owp-topbar-social-external-mark-size) * 0.25);

position: absolute;
        inset-block-start: var(--owp-topbar-social-external-mark-offset-y);
        inset-inline-end: var(--owp-topbar-social-external-mark-offset-x);

width: var(--owp-topbar-social-external-mark-size);
        height: var(--owp-topbar-social-external-mark-size);
        padding: var(--owp-topbar-social-external-mark-padding);

display: block;
        box-sizing: content-box;

color: var(--owp-topbar-social-external-mark-color);
        fill: currentColor;
        background-color: var(--owp-topbar-social-external-mark-bg);
        border-radius: 50%;

line-height: 1;
        pointer-events: none;
        z-index: 1;
    }
}

.custom-header-media.ocean-accessible-header-media {
    position: relative;
	width: 100%;
	overflow: hidden;
	background: #000;
    height: var(--owp-header-media-height, 600px);

img,
	video,
	iframe {
		position: absolute;
		top: 50%;
		left: 50%;
		min-width: 100%;
		min-height: 100%;
		width: auto;
		height: auto;
		transform: translate(-50%, -50%);
		object-fit: cover;
        display: block;
	}

img {
		object-position: var(--owp-header-media-image-position, 'initial');
		object-fit: var(--owp-header-media-image-size, fill);
	}

// overlay (shared for both video + image)
	&::before {
		content: "";
		position: absolute;
		inset: 0;
		z-index: 1;
        background-color: var(--owp-header-media-overlay-color, rgba(0, 0, 0, 0.3));
	}

.wp-custom-header-video-button {
        position: absolute;
		top: 20px;
		right: 20px;
		width: 44px;
		height: 44px;
		display: flex;
		align-items: center;
		justify-content: center;
		border-radius: 2px;
		cursor: pointer;
		z-index: 5;
		transition: all 0.2s ease-in-out;
        background-color: var(--owp-header-media-button-bg-color, rgba(0, 0, 0, 0.5));
        color: var(--owp-header-media-button-icon-color, rgba(255, 255, 255, 0.8));
        border: 1px solid var(--owp-header-media-button-border-color, rgba(255, 255, 255, 0.6));

svg,
		i {
			width: 18px;
			height: 18px;
			fill: currentColor;
			color: inherit;
		}

&:hover {
			outline: none;
            @include transition( all .3s ease );
		}

&:hover {
            background-color: var(--owp-header-media-button-bg-color-hover, rgba(0, 0, 0, 0.75));
            color: var(--owp-header-media-button-icon-color-hover, #ffffff);
            border-color: var(--owp-header-media-button-border-color-hover, rgba(255, 255, 255, 0.9));
            @include transition( all .3s ease );
        }

&:focus-visible {
            outline: var(--owp-focus-outline-width) solid var(--owp-focus-outline-color, currentColor);
            outline-offset: var(--owp-focus-outline-offset);
            background-color: var(--owp-header-media-button-bg-color-focus, rgba(0, 0, 0, 0.75));
            color: var(--owp-header-media-button-icon-color-focus, #ffffff);
            border-color: var(--owp-header-media-button-border-color-focus, rgba(255, 255, 255, 0.9));
            @include transition( all .3s ease );
        }
    }
}

body.admin-bar {

.custom-header-media.ocean-accessible-header-media {

.wp-custom-header-video-button {
			top: 52px;
		}
	}
}

// Sidr close button
button.sidr-class-toggle-sidr-close {
    display: block;
    background-color: $color-8;
    color: $color-2;
    font-size: 13px;
    font-weight: 600;
    line-height: 1;
    padding: 20px;
    letter-spacing: 0.6px;
    text-transform: uppercase;
    width: 100%;
    text-align: left;
    border:0;

&:hover {
        background-color: $color-8;
    }

i {
        display: inline-block;
        padding-right: 8px;
        margin: 0;
        width: auto;
        height: auto;
        line-height: 1;
        vertical-align: bottom;
    }

.owp-icon {
        margin-right: 8px;
    }
}

form.sidr-class-mobile-searchform {
    margin-top: 15px;

button[type="submit"] {
        border: 0;
        margin-top: 0;

// Mobile fullscreen search
label.mobile-fs-search-visible-label {
    position: absolute;
    top: -15px;
    transform: translateX(50px);
}

// Site tagline
#site-header.top-header {
    #site-logo #site-description {
        p {
            color: #929292;
            font-size: 12px;
            line-height: 20px;
            letter-spacing: 2px;
            text-transform: uppercase;
            margin: 0;
        }
    }
}

// Medium header
#site-header.medium-header {
    #medium-searchform {
        label.medium-header-search-visible-label {
            top: -32px;
            left: 0;
        }
    }
}

// Vertical header
#site-header.vertical-header {

#vertical-searchform form {
        label.vertical-header-search-visible-label {
            left: 0;
            top: -15px;
        }
    }

.vertical-toggle {
        background-color: transparent;

&:hover {
            background-color: transparent;
        }
    }

#site-navigation-wrap {

.dropdown-menu {

li {

> button.menu-link.dropdown-toggle {
                    display: flex;
                    position: relative;
                    justify-content: space-between;
                    align-items: center;
                    width: 100%;
                    line-height: 1;
                    padding: 17px 30px;
                    text-align: left;
                    color: $color-11;
                    background: transparent;
                    border: 0;
                    border-color: transparent;
                    border-radius: 0;
                    box-shadow: none;
                    cursor: pointer;
                    font: inherit;
                    letter-spacing: 0.6px;
                    text-transform: none;

&:hover,
                    &:active,
                    &:focus {
                        background: transparent;
                        border-color: transparent;
                        box-shadow: none;
                    }

.nav-arrow {
                        display: flex;
                        padding-left: 6px;
                        line-height: 1;
                        pointer-events: none;
                    }
                }
            }

> li {

> button.menu-link.dropdown-toggle {

&:hover,
                    &:focus-visible {
                        color: var(--owp-primary-color-hover, #{$color-5});
                    }
                }
            }

ul {

li {

> button.menu-link.dropdown-toggle {
                        font-size: 12px;
                        font-weight: 400;
                        line-height: 1;
                        text-transform: capitalize;

&:hover,
                        &:focus-visible {
                            color: $color-11;
                            background-color: $color-8;
                        }
                    }
                }
            }
        }

.oceanwp-has-accessible-toggle {

> .dropdown-toggle {
                padding: 17px 30px;

.nav-arrow {
					display: flex;
				}
			}
		}
	}
}

// Full-screen header
#site-header.full_screen-header {
    .menu-bar {
        background-color: transparent;
        border: 0;

&:hover {
            background-color: transparent;
        }

&:focus-visible {
            outline: var(--owp-focus-outline-width) solid var(--owp-focus-outline-color, currentColor);
            outline-offset: var(--owp-focus-outline-offset);
        }

}
}

#mobile-fullscreen {
    button.close {
        position: absolute;
        top: 14px;
        right: 14px;
        background-color: transparent;
        border: 0;

&:hover {
            background-color: transparent;
        }

&:focus-visible {
            outline: var(--owp-focus-outline-width) solid var(--owp-focus-outline-color, currentColor);
            outline-offset: var(--owp-focus-outline-offset);
        }

.close-icon-wrap {
            display: inline-block;
            position: relative;
            width: 40px;
            height: 40px;
            line-height: 33px;
            @include transition(opacity 0.15s linear);

&:hover {
                opacity: 0.7;
            }
        }

.close-icon-inner,
        .close-icon-inner::after {
            display: inline-block;
            width: 40px;
            height: 3px;
            background-color: #fff;
            border-radius: 3px;
        }

.close-icon-inner {
            @include transform(rotate(45deg));
        }

.close-icon-inner::after {
            content: "";
            display: block;
            @include transform(rotate(-90deg));
        }
    }

ul.sub-menu {

li {

> a,
			> .oceanwp-sub-menu-toggle {
				min-height: 26px;
				height: 26px;
				line-height: 26px;
			}
		}

ul.sub-menu {

li {

> a,
				> .oceanwp-sub-menu-toggle {
					min-height: 26px;
					height: 26px;
					line-height: 26px;
				}
			}
		}
	}

.oceanwp-sub-menu-toggle::before,
	.oceanwp-sub-menu-toggle::after {
		content: none !important;
		display: none !important;
	}
}

#site-navigation-wrap {
    .dropdown-menu {
        > li {

button.dropdown-toggle {
                font-size: 13px;
                color: $color-11;
                letter-spacing: 0.6px;

&:hover {
                    color: var(--owp-primary-color, #{$color-5});
                }
            }

> button.site-search-toggle {
                display: block;
                font-size: 13px;
                line-height: 74px;
                color: $color-11;
                padding: 0 15px;
                letter-spacing: 0;
                background-color: transparent;
                border: 0;
                cursor: pointer;

&:hover {
                    color: var(--owp-primary-color, #{$color-5});
                }

.oceanwp-mobile-menu-icon {
    & > button {
        font-size: 13px;
        line-height: 74px;
        color: #555;
        padding-left: 15px;
        letter-spacing: 0.6px;
        cursor: pointer;
        background: transparent;
        border: 0;

&:first-child {
            padding-left: 0;
        }

&:hover {
            color: var(--owp-primary-color, #{$color-5});
            background-color: transparent;
        }

&:focus-visible {
            outline: var(--owp-focus-outline-width) solid var(--owp-focus-outline-color, currentColor);
            outline-offset: var(--owp-focus-outline-offset);
        }

&.mobile-menu {
            .oceanwp-text,
            .oceanwp-close-text {
                padding-left: 6px;
            }

.oceanwp-close-text,
            &.opened .oceanwp-text {
                display: none;
            }

&.opened .oceanwp-close-text {
                display: inline-block;
            }
        }
    }
}

#searchform-overlay,
#icon-searchform-overlay {
    .search-overlay-close {
        line-height: 40px;
		border: 0;

#searchform-header-replace {
    .header-search-visible-label {
        position: absolute;
        top: 0;
    }
}

#searchform-header-replace-close {
    background: transparent;
    border: 0;

&:focus-visible {
        outline: var(--owp-focus-outline-width) solid var(--owp-focus-outline-color, currentColor);
        outline-offset: var(--owp-focus-outline-offset);
    }
}

#mobile-dropdown {
    #mobile-menu-search {
        padding-top: 10px;

.oceanwp-mobile-menu-search-visible-label {
            display: block;
            margin-bottom: 6px;
        }

button[type="submit"] {
            &:focus-visible {
                outline: var(--owp-focus-outline-width) solid var(--owp-focus-outline-color, currentColor);
                outline-offset: var(--owp-focus-outline-offset);
            }
        }
       
    }
}

button.dropdown-toggle,
.oceanwp-sub-menu-toggle {
    display: flex;
    position: relative;
    justify-content: space-between;
    align-items: center;
    padding: 12px 40px;
    text-align: left;
    background: rgba(0, 0, 0, 0);
    width: 100%;
}

button.dropdown-toggle,
.oceanwp-sub-menu-toggle {

&:focus-visible {
        outline: var(--owp-focus-outline-width) solid var(--owp-focus-outline-color, currentColor);
        outline-offset: var(--owp-focus-outline-offset);
    }
}

#mobile-dropdown {

ul {

li {

> button.menu-link.dropdown-toggle,
            > button.oceanwp-sub-menu-toggle-icon {
                color: #555;
                background: transparent;
                border: 0;
                border-radius: 0;
                box-shadow: none;
                cursor: pointer;
                font: inherit;
                letter-spacing: inherit;
                text-transform: none;

&:hover,
                &:active,
                &:focus {
                    background: transparent;
                    border-color: transparent;
                    box-shadow: none;
                }

&:hover,
                &:focus-visible {
                    color: var(--owp-primary-color-hover, #{$color-5});
                }
            }

> button.menu-link.dropdown-toggle {
                display: flex;
                position: relative;
                justify-content: space-between;
                align-items: center;
                width: 100%;
                padding: 12px 40px;
                text-align: left;
            }

&.active,
            &.open-sub {

> button.menu-link.dropdown-toggle,
                > button.oceanwp-sub-menu-toggle-icon {
                    color: var(--owp-primary-color-hover, #{$color-5});
                    background: transparent;
                    border-color: transparent;
                    box-shadow: none;
                }
            }
        }
    }
}

[data-oceanwp-submenu-toggle] {

&:focus-visible {
        outline: var(--owp-focus-outline-width) solid var(--owp-focus-outline-color, currentColor);
        outline-offset: var(--owp-focus-outline-offset);
    }
}

.oceanwp-sub-menu-toggle .nav-arrow {
    pointer-events: none;
}

.oceanwp-has-submenu-toggle,
.oceanwp-has-accessible-toggle {
    position: relative;

> .oceanwp-sub-menu-toggle-icon {
        position: absolute;
        top: 0;
        right: 0;
        width: 48px;
        height: 48px;
        display: flex;
        align-items: center;
        justify-content: center;
        padding: 0;
        margin: 0;
        background: transparent;
        border: 0;
        cursor: pointer;
        z-index: 2;

.nav-arrow {
            transition: transform .25s ease;
        }
    }

> .oceanwp-sub-menu-toggle-icon + .sub-menu {
        clear: both;
    }
}

/* Rotate top-level submenu arrows */
.oceanwp-has-submenu-toggle,
.oceanwp-has-accessible-toggle {

&.active,
    &.open-sub {

> .oceanwp-sub-menu-toggle-icon .nav-arrow,
        > .menu-link.oceanwp-sub-menu-toggle-parent .nav-arrow {
            transition: transform .5s ease;
            transform: rotate(180deg);
        }
    }
}

/* Rotate nested submenu arrows */
.sub-menu {

.oceanwp-has-accessible-toggle {

&.active,
        &.open-sub {

> .oceanwp-sub-menu-toggle-icon .nav-arrow {
                transition: transform .25s ease;
                transform: rotate(90deg);
            }
        }
    }
}

#mobile-fullscreen,
#full-screen-menu {

li {

> button.menu-link {
            display: block;
            color: $color-1;
            background: transparent;
            border: 0;
            border-color: transparent;
            border-radius: 0;
            box-shadow: none;
            cursor: pointer;
            letter-spacing: 2px;
            text-transform: uppercase;
            padding: 12px 0;
            text-align: center;

&:hover,
            &:active,
            &:focus {
                background: transparent;
                border-color: transparent;
                box-shadow: none;
            }

&:hover,
            &:focus-visible {
                color: $color-4;
            }

.nav-arrow {
                position: absolute;
                top: 25%;
                right: 0;
                display: flex;
                align-items: center;
                justify-content: center;
                padding: 0;
                margin: 0;
                background: rgba(0, 0, 0, 0);
                border: 0;
                cursor: pointer;
                z-index: 2;
            }
        }

button.dropdown-toggle {
            padding-left: 0;
        }

> .menu-link .nav-arrow,
        > .oceanwp-sub-menu-toggle-icon .nav-arrow {
            display: inline-block;
            width: 26px;
            padding-left: 0;
            text-align: center;
            color: #ffffff;
            font-size: 18px;

&::before {
                content: "+";
            }
        }

&.open-sub {

> .menu-link .nav-arrow,
            > .oceanwp-sub-menu-toggle-icon .nav-arrow {

&::before {
                    content: "-";
                }
            }
        }
    }

.oceanwp-has-submenu-toggle,
    .oceanwp-has-accessible-toggle {

&.active,
        &.open-sub {

> .oceanwp-sub-menu-toggle-icon .nav-arrow,
            > .menu-link.oceanwp-sub-menu-toggle-parent .nav-arrow {
                transform: none;
            }
        }
    }

.sub-menu {

.oceanwp-has-accessible-toggle {

&.active,
            &.open-sub {

> .oceanwp-sub-menu-toggle-icon .nav-arrow {
                    transform: none;
                }
            }
        }
    }
}

#full-screen-menu {

li {

> button.menu-link {
            font-size: 24px;
            line-height: 1.2;

.nav-arrow {
                width: 48px;
                height: auto;
            }
        }
    }
}

#mobile-fullscreen {

li {

> button.menu-link {
            font-size: 15px;
            line-height: 1.2;
            width: 100%;

&::before {
                display: none;
            }
        }
    }
}

.comment-respond .logged-in-as a {
	color: var(--owp-link-color, #333333);
	text-decoration: underline 0.1em;
	text-underline-offset: 0.2em;
}

.comment-respond .logged-in-as a:hover,
.comment-respond .logged-in-as a:focus-visible {
	color: var(--owp-link-color-hover, #{$color-5});
    text-decoration: none;
    @include transition( all .3s ease );
}