/* ===========================================
   Webup Admin - Modern Layout
   =========================================== */

/* Page background and topbar offset */
html, body.wp-admin {
    background: #ffffff !important;
}

body.wp-admin {
    padding-top: 60px !important;
}

/* Elementor specific app bars */
#elementor-home-app-top-bar,
[id*="elementor"][id*="top-bar"],
.e-home-top-bar {
    margin-top: 60px !important;
}

/* ===========================================
   Sidebar - Floating with rounded corners
   =========================================== */
#adminmenuwrap {
    position: fixed;
    top: 18px;
    left: 18px;
    bottom: 18px;
    width: 220px;
    padding-top: 70px;
    background-image: url(./images/wu_logo_white.svg);
    background-size: 160px;
    background-position: center 20px;
    background-repeat: no-repeat;
    background-color: #174F88;
    border-radius: 20px;
    box-shadow: 0 4px 20px rgba(0, 0, 0, 0.5);
    overflow: visible;
    z-index: 9990;
}

/* Hide default admin menu background */
#adminmenuback {
    display: none;
}

#adminmenu {
    width: 100%;
    background: transparent;
}

ul#adminmenu {
    background: transparent;
    margin-top: 10px;
}

#adminmenu .wp-submenu {
    background: #13446e;
    border-radius: 0 12px 12px 0;
    box-shadow: 5px 5px 20px rgba(0, 0, 0, 0.15);
    left: 100%;
    margin-left: 5px;
    clip: auto !important;
    opacity: 0;
    visibility: hidden;
    transition: opacity 0.15s ease, visibility 0.15s ease;
}

/* Show submenu on hover OR when menu is expanded */
#adminmenu li.menu-top:hover > .wp-submenu,
#adminmenu li.opensub > .wp-submenu,
#adminmenu li.wp-has-current-submenu > .wp-submenu,
#adminmenu li.wp-menu-open > .wp-submenu {
    opacity: 1;
    visibility: visible;
}

ul.wp-submenu.wp-submenu-wrap {
    background: #13446e;
}

#adminmenu .wp-has-current-submenu .wp-submenu .wp-submenu-head,
#adminmenu .wp-menu-arrow,
#adminmenu .wp-menu-arrow div,
#adminmenu li.current a.menu-top,
#adminmenu li.wp-has-current-submenu a.wp-has-current-submenu {
    background: rgba(255, 255, 255, 0.2);
}

#adminmenu li.menu-top:hover,
#adminmenu li.opensub > a.menu-top,
#adminmenu li > a.menu-top:focus {
    position: relative;
    background-color: rgba(255, 255, 255, 0.15);
    color: #fff;
}

#adminmenu div.wp-menu-image:before {
    color: rgba(255, 255, 255, 0.9);
}

/* SVG/image icons in menu - force white using filter */
#adminmenu .wp-menu-image img,
#adminmenu .wp-menu-image svg,
#adminmenu .wp-menu-image.svg {
    filter: brightness(0) invert(1) !important;
    opacity: 0.9;
}

#adminmenu li:hover .wp-menu-image img,
#adminmenu li:hover .wp-menu-image svg,
#adminmenu li:hover .wp-menu-image.svg,
#adminmenu li.current .wp-menu-image img,
#adminmenu li.current .wp-menu-image svg,
#adminmenu li.current .wp-menu-image.svg,
#adminmenu li.wp-has-current-submenu .wp-menu-image img,
#adminmenu li.wp-has-current-submenu .wp-menu-image svg,
#adminmenu li.wp-has-current-submenu .wp-menu-image.svg {
    opacity: 1;
}

/* WooCommerce and plugin icons with background-image */
#adminmenu .menu-icon-woocommerce .wp-menu-image,
#adminmenu .toplevel_page_woocommerce .wp-menu-image,
#adminmenu .toplevel_page_wc-admin .wp-menu-image,
#adminmenu [class*="menu-icon-"] .wp-menu-image.svg,
#adminmenu [class*="toplevel_page_"] .wp-menu-image.svg {
    filter: brightness(0) invert(1) !important;
    opacity: 0.9;
}

#adminmenu [class*="menu-icon-"]:hover .wp-menu-image.svg,
#adminmenu [class*="toplevel_page_"]:hover .wp-menu-image.svg,
#adminmenu .menu-icon-woocommerce:hover .wp-menu-image,
#adminmenu .toplevel_page_woocommerce:hover .wp-menu-image,
#adminmenu .menu-icon-woocommerce.wp-has-current-submenu .wp-menu-image,
#adminmenu .toplevel_page_woocommerce.wp-has-current-submenu .wp-menu-image {
    opacity: 1;
}

#adminmenu a:hover div.wp-menu-image:before,
#adminmenu li.wp-has-current-submenu div.wp-menu-image:before {
    color: #fff;
}

#adminmenu a {
    color: rgba(255, 255, 255, 0.9);
}

#adminmenu a:hover,
#adminmenu .wp-submenu a:hover {
    color: #fff;
}

/* Collapse button */
#collapse-menu {
    border-top: 1px solid rgba(255, 255, 255, 0.15);
}

#collapse-menu #collapse-button {
    color: rgba(255, 255, 255, 0.8);
}

/* ===========================================
   Admin Bar - Clean and minimal
   =========================================== */
#wpadminbar {
    left: 250px;
    right: 15px;
    top: 15px;
    width: auto;
    background: #fff;
    border: 1px solid rgba(0, 0, 0, 0.05);
    border-radius: 12px;
}

#wpadminbar .ab-item,
#wpadminbar a.ab-item,
#wpadminbar > #wp-toolbar span.ab-label,
#wpadminbar > #wp-toolbar span.noticon {
    color: #333;
}

#wpadminbar .ab-icon:before,
#wpadminbar .ab-item:before {
    color: #174F88;
}

#wpadminbar:not(.mobile) .ab-top-menu > li:hover > .ab-item,
#wpadminbar:not(.mobile) .ab-top-menu > li > .ab-item:focus {
    background: #f5f5f5;
    color: #174F88;
}

#wpadminbar #wp-admin-bar-wp-logo > .ab-item .ab-icon:before {
    color: #174F88;
}

/* ===========================================
   Content Area
   =========================================== */
:root {
    --webup-topbar-offset: 65px;
}

#wpcontent {
    margin-left: 250px;
    padding-left: 0;
}

#wpbody {
    padding: var(--webup-topbar-offset) 15px 15px 0;
}

#wpbody-content {
    background: none !important;
    padding-top: 10px;
}

/* Ensure all admin content clears the topbar */
#wpbody-content > *:first-child {
    margin-top: 0;
}

.wrap {
    background: #fff;
    padding: 25px 30px;
    border-radius: 12px;
    margin-right: 15px;
    margin-top: 0 !important;
    border: 1px solid rgba(0, 0, 0, 0.05);
}

/* Page titles */
.wrap h1,
.wrap h2 {
    padding-top: 0;
}

/* ===========================================
   Welcome Panel - Hidden (use dashboard widgets instead)
   =========================================== */
#welcome-panel {
    display: none;
}

/* ===========================================
   Dashboard Widgets
   =========================================== */
#dashboard-widgets .postbox {
    border-radius: 12px;
    border: 1px solid #e5e7eb;
    box-shadow: none;
    background: #fff;
}

#dashboard-widgets .postbox .postbox-header {
    border-radius: 12px 12px 0 0;
    border-bottom: 1px solid #e5e7eb;
}

/* All postboxes/metaboxes */
.postbox {
    border-radius: 12px;
    border: 1px solid #e5e7eb;
}

/* ===========================================
   Footer
   =========================================== */
#wpfooter {
    margin-left: 250px;
    padding: 15px 30px;
}

/* ===========================================
   Collapsed Menu State
   =========================================== */
.folded #adminmenuwrap {
    width: 60px;
    background-size: 35px;
    background-position: center 15px;
    padding-top: 55px;
}

.folded #adminmenu {
    margin-left: 0;
}

.folded #adminmenu li.menu-top {
    text-align: center;
}

.folded #adminmenu .wp-menu-name {
    display: none;
}

.folded #adminmenu div.wp-menu-image {
    width: 100%;
    margin: 0;
    text-align: center;
}

.folded #adminmenu a.menu-top {
    display: flex;
    justify-content: center;
    align-items: center;
    height: 44px;
}

.folded #wpadminbar {
    left: 90px;
}

.folded #wpcontent,
.folded #wpfooter {
    margin-left: 90px;
}

.folded #wpbody {
    padding-left: 0;
}

/* ===========================================
   Responsive - Smaller screens
   =========================================== */
@media screen and (max-width: 960px) {
    #adminmenuwrap {
        top: 0;
        left: 0;
        bottom: 0;
        border-radius: 0;
        box-shadow: 5px 0 20px rgba(0, 0, 0, 0.1);
    }

    #wpadminbar {
        left: 0;
        right: 0;
        top: 0;
        border-radius: 0;
    }

    #wpbody {
        padding: 20px 15px 15px 15px;
    }

    .wrap {
        margin-right: 0;
    }
}

@media screen and (max-width: 782px) {
    #wpadminbar {
        position: fixed;
    }

    #adminmenuwrap {
        display: none;
    }

    .wp-responsive-open #adminmenuwrap {
        display: block;
        width: 190px;
        z-index: 100001;
    }

    #wpcontent,
    #wpfooter {
        margin-left: 0;
    }

    #wpbody {
        padding-top: 60px;
    }

    .wrap {
        margin: 10px;
        padding: 15px;
    }
}

/* ===========================================
   PHP Error margin fix
   =========================================== */
.php-error #adminmenuwrap {
    margin-top: 0;
}

/* ===========================================
   WooCommerce Admin Bar Fix
   =========================================== */
.woocommerce-layout__header,
.woocommerce-admin-header,
.woocommerce-embed-page .woocommerce-layout__header {
    position: relative !important;
    top: auto !important;
    left: auto !important;
    right: auto !important;
    margin-left: 0 !important;
    margin-right: 15px !important;
    border-radius: 12px !important;
}

/* WooCommerce Activity Panel Fix */
.woocommerce-layout__activity-panel-wrapper {
    position: fixed !important;
    right: 0 !important;
    top: 60px !important;
    z-index: 9999 !important;
    height: calc(100vh - 60px) !important;
    background: transparent !important;
    pointer-events: none !important;
}

/* When panel is open, allow interaction */
.woocommerce-layout__activity-panel-wrapper.is-open,
.woocommerce-layout__activity-panel-wrapper:has(.is-open) {
    pointer-events: auto !important;
    background: rgba(0, 0, 0, 0.3) !important;
}

/* The actual panel content */
.woocommerce-layout__activity-panel {
    pointer-events: auto !important;
}

/* Hide the gray overlay/background when panel is closed */
.woocommerce-layout__activity-panel-wrapper:not(.is-open) {
    background: transparent !important;
    width: auto !important;
}

/* Prevent horizontal scroll on WooCommerce pages */
.woocommerce-layout {
    overflow-x: hidden !important;
}

body.woocommerce-admin-page {
    overflow-x: hidden !important;
}

/* ===========================================
   Elementor Admin Bar Fix
   =========================================== */
#e-admin-top-bar-root {
    position: relative !important;
    top: auto !important;
    left: auto !important;
    right: auto !important;
    width: auto !important;
    margin-left: 0 !important;
    margin-right: 15px !important;
    border-radius: 12px !important;
}

/* ===========================================
   Various Fixes
   =========================================== */

/* Notices */
.notice,
div.updated,
div.error {
    margin: 15px 0;
    border-radius: 10px;
}

/* Buttons */
.wp-core-ui .button-primary {
    background: #174F88;
    border-color: #174F88;
    border-radius: 8px;
}

.wp-core-ui .button-primary:hover {
    background: #0f3a5c;
    border-color: #0f3a5c;
}

/* Form tables in settings */
.form-table {
    margin-top: 15px;
}

/* Scrollbar in sidebar */
#adminmenuwrap::-webkit-scrollbar {
    width: 6px;
}

#adminmenuwrap::-webkit-scrollbar-track {
    background: transparent;
}

#adminmenuwrap::-webkit-scrollbar-thumb {
    background: rgba(255, 255, 255, 0.3);
    border-radius: 6px;
}

#adminmenuwrap::-webkit-scrollbar-thumb:hover {
    background: rgba(255, 255, 255, 0.5);
}

/* ===========================================
   Dark Mode (class-based toggle)
   =========================================== */
html.webup-dark-mode,
body.webup-dark-mode,
body.webup-dark-mode.wp-admin {
    background: #1a1a1a !important;
}

/* Sidebar - dark color */
.webup-dark-mode #adminmenuwrap {
    background-color: #2a2a2a;
    box-shadow: 0 4px 20px rgba(0, 0, 0, 0.4);
}

.webup-dark-mode #adminmenu .wp-submenu,
.webup-dark-mode ul.wp-submenu.wp-submenu-wrap {
    background: #333;
    box-shadow: 5px 5px 20px rgba(0, 0, 0, 0.4);
}

.webup-dark-mode #adminmenu .wp-has-current-submenu .wp-submenu .wp-submenu-head,
.webup-dark-mode #adminmenu .wp-menu-arrow,
.webup-dark-mode #adminmenu .wp-menu-arrow div,
.webup-dark-mode #adminmenu li.current a.menu-top,
.webup-dark-mode #adminmenu li.wp-has-current-submenu a.wp-has-current-submenu {
    background: rgba(255, 255, 255, 0.1);
}

.webup-dark-mode #adminmenu li.menu-top:hover,
.webup-dark-mode #adminmenu li.opensub > a.menu-top,
.webup-dark-mode #adminmenu li > a.menu-top:focus {
    background-color: rgba(255, 255, 255, 0.08);
}

/* Admin Bar - Dark Mode */
.webup-dark-mode #wpadminbar {
    background: #252525;
    border-color: rgba(255, 255, 255, 0.08);
}

.webup-dark-mode #wpadminbar .ab-item,
.webup-dark-mode #wpadminbar a.ab-item,
.webup-dark-mode #wpadminbar > #wp-toolbar span.ab-label,
.webup-dark-mode #wpadminbar > #wp-toolbar span.noticon {
    color: #e0e0e0;
}

.webup-dark-mode #wpadminbar:not(.mobile) .ab-top-menu > li:hover > .ab-item,
.webup-dark-mode #wpadminbar:not(.mobile) .ab-top-menu > li > .ab-item:focus {
    background: #333;
    color: #174F88;
}

.webup-dark-mode #wpadminbar .ab-sub-wrapper,
.webup-dark-mode #wpadminbar ul#wp-admin-bar-root-default > li .ab-sub-wrapper {
    background: #252525;
}

.webup-dark-mode #wpadminbar .ab-submenu .ab-item {
    color: #e0e0e0;
}

/* Content Area - Dark Mode */
.webup-dark-mode .wrap {
    background: #252525;
    border-color: rgba(255, 255, 255, 0.08);
    color: #e0e0e0;
}

.webup-dark-mode .wrap h1,
.webup-dark-mode .wrap h2,
.webup-dark-mode .wrap h3 {
    color: #fff;
}

/* Dashboard Widgets - Dark Mode */
.webup-dark-mode #dashboard-widgets .postbox,
.webup-dark-mode .postbox {
    background: #252525;
    border-color: rgba(255, 255, 255, 0.08);
    color: #e0e0e0;
}

.webup-dark-mode #dashboard-widgets .postbox .postbox-header,
.webup-dark-mode .postbox .postbox-header {
    border-bottom-color: rgba(255, 255, 255, 0.08);
    background: #2a2a2a;
}

.webup-dark-mode .postbox .postbox-header h2,
.webup-dark-mode .postbox .hndle {
    color: #fff;
}

/* Tables - Dark Mode */
.webup-dark-mode .wp-list-table {
    background: #252525;
    color: #e0e0e0;
}

.webup-dark-mode .wp-list-table thead th,
.webup-dark-mode .wp-list-table tfoot th {
    background: #2a2a2a;
    color: #e0e0e0;
}

.webup-dark-mode .wp-list-table tbody tr {
    background: #252525;
}

.webup-dark-mode .wp-list-table tbody tr:hover {
    background: #2f2f2f;
}

.webup-dark-mode .wp-list-table td,
.webup-dark-mode .wp-list-table th {
    border-color: rgba(255, 255, 255, 0.08);
}

.webup-dark-mode .striped > tbody > :nth-child(odd),
.webup-dark-mode ul.striped > :nth-child(odd),
.webup-dark-mode .alternate {
    background: #2a2a2a;
}

/* Forms - Dark Mode */
.webup-dark-mode input[type="text"],
.webup-dark-mode input[type="password"],
.webup-dark-mode input[type="email"],
.webup-dark-mode input[type="url"],
.webup-dark-mode input[type="number"],
.webup-dark-mode input[type="search"],
.webup-dark-mode input[type="tel"],
.webup-dark-mode textarea,
.webup-dark-mode select {
    background: #333;
    border-color: rgba(255, 255, 255, 0.15);
    color: #e0e0e0;
}

.webup-dark-mode input[type="text"]:focus,
.webup-dark-mode input[type="password"]:focus,
.webup-dark-mode input[type="email"]:focus,
.webup-dark-mode input[type="url"]:focus,
.webup-dark-mode input[type="number"]:focus,
.webup-dark-mode input[type="search"]:focus,
.webup-dark-mode input[type="tel"]:focus,
.webup-dark-mode textarea:focus,
.webup-dark-mode select:focus {
    background: #3a3a3a;
    border-color: #174F88;
    box-shadow: 0 0 0 1px #174F88;
}

/* Buttons - Dark Mode */
.webup-dark-mode .wp-core-ui .button {
    background: #333;
    border-color: rgba(255, 255, 255, 0.15);
    color: #e0e0e0;
}

.webup-dark-mode .wp-core-ui .button:hover {
    background: #404040;
    border-color: rgba(255, 255, 255, 0.2);
    color: #fff;
}

/* Notices - Dark Mode */
.webup-dark-mode .notice,
.webup-dark-mode div.updated,
.webup-dark-mode div.error {
    background: #2a2a2a;
    border-color: rgba(255, 255, 255, 0.1);
    color: #e0e0e0;
}

.webup-dark-mode .notice-success {
    border-left-color: #46b450;
}

.webup-dark-mode .notice-warning {
    border-left-color: #ffb900;
}

.webup-dark-mode .notice-error {
    border-left-color: #dc3232;
}

.webup-dark-mode .notice-info {
    border-left-color: #174F88;
}

/* Links - Dark Mode */
.webup-dark-mode a {
    color: #5a8fc4;
}

.webup-dark-mode a:hover {
    color: #7aaad9;
}

/* Footer - Dark Mode */
.webup-dark-mode #wpfooter {
    color: #888;
}

.webup-dark-mode #wpfooter a {
    color: #5a8fc4;
}

/* Nav tabs - Dark Mode */
.webup-dark-mode .nav-tab-wrapper,
.webup-dark-mode .wrap .nav-tab-wrapper {
    border-bottom-color: rgba(255, 255, 255, 0.08);
}

.webup-dark-mode .nav-tab {
    background: #2a2a2a;
    border-color: rgba(255, 255, 255, 0.08);
    color: #e0e0e0;
}

.webup-dark-mode .nav-tab:hover {
    background: #333;
    color: #fff;
}

.webup-dark-mode .nav-tab-active,
.webup-dark-mode .nav-tab-active:hover {
    background: #252525;
    border-bottom-color: #252525;
    color: #fff;
}

/* Cards - Dark Mode */
.webup-dark-mode .card {
    background: #252525;
    border-color: rgba(255, 255, 255, 0.08);
}

/* Media uploader - Dark Mode */
.webup-dark-mode .media-modal-content {
    background: #252525;
}

.webup-dark-mode .media-frame-title h1 {
    color: #fff;
}

/* Settings pages - Dark Mode */
.webup-dark-mode .form-table th {
    color: #e0e0e0;
}

.webup-dark-mode .description {
    color: #999;
}

/* Subsubsub filter links - Dark Mode */
.webup-dark-mode .subsubsub a {
    color: #5a8fc4;
}

.webup-dark-mode .subsubsub a:hover {
    color: #7aaad9;
}

/* Row actions - Dark Mode */
.webup-dark-mode .row-actions span a {
    color: #5a8fc4;
}

.webup-dark-mode .row-actions span a:hover {
    color: #7aaad9;
}

/* Inline edit - Dark Mode */
.webup-dark-mode .inline-edit-row {
    background: #2a2a2a;
}

/* Screen options & help - Dark Mode */
.webup-dark-mode #screen-meta {
    background: #252525;
    border-color: rgba(255, 255, 255, 0.08);
}

.webup-dark-mode #screen-meta-links .screen-meta-toggle {
    background: #252525;
    border-color: rgba(255, 255, 255, 0.08);
}

.webup-dark-mode #screen-meta-links button {
    color: #5a8fc4;
}

/* Code/pre elements - Dark Mode */
.webup-dark-mode code,
.webup-dark-mode pre {
    background: #333;
    color: #e0e0e0;
}

/* Pagination - Dark Mode */
.webup-dark-mode .tablenav .tablenav-pages a,
.webup-dark-mode .tablenav .tablenav-pages .current {
    background: #333;
    border-color: rgba(255, 255, 255, 0.15);
    color: #e0e0e0;
}

.webup-dark-mode .tablenav .tablenav-pages a:hover {
    background: #404040;
    color: #fff;
}

/* Dark mode toggle button */
#wp-admin-bar-webup-darkmode-toggle .ab-item {
    cursor: pointer;
}


/* WooCommerce header - Dark Mode */
.webup-dark-mode .woocommerce-layout__header,
.webup-dark-mode .woocommerce-admin-header,
.webup-dark-mode .woocommerce-layout__header-wrapper,
.webup-dark-mode .woocommerce-layout__header-heading,
.webup-dark-mode .woocommerce-embed-page .woocommerce-layout__header {
    background: #252525 !important;
    background-color: #252525 !important;
    border-color: rgba(255, 255, 255, 0.08) !important;
    color: #e0e0e0 !important;
}

.webup-dark-mode .woocommerce-layout__header *,
.webup-dark-mode .woocommerce-admin-header *,
.webup-dark-mode .woocommerce-layout__header-wrapper *,
.webup-dark-mode .woocommerce-layout__header-breadcrumbs *,
.webup-dark-mode .woocommerce-layout__header h1,
.webup-dark-mode .woocommerce-layout__header span,
.webup-dark-mode .woocommerce-layout__header a {
    color: #e0e0e0 !important;
    background-color: transparent !important;
}

.webup-dark-mode .woocommerce-layout__header a:hover,
.webup-dark-mode .woocommerce-admin-header a:hover {
    color: #fff !important;
}

/* WooCommerce admin content - Dark Mode */
.webup-dark-mode .woocommerce-layout__primary,
.webup-dark-mode .woocommerce-profile-wizard,
.webup-dark-mode .woocommerce-admin-page .wrap {
    background: #1a1a1a !important;
}

.webup-dark-mode .woocommerce-card,
.webup-dark-mode .woocommerce-table,
.webup-dark-mode .woocommerce-summary {
    background: #252525 !important;
    border-color: rgba(255, 255, 255, 0.08) !important;
    color: #e0e0e0 !important;
}

/* WooCommerce SVG icons - Dark Mode */
.webup-dark-mode .woocommerce-layout__header svg,
.webup-dark-mode .woocommerce-layout__header img,
.webup-dark-mode .woocommerce-admin-header svg,
.webup-dark-mode .woocommerce-admin-header img {
    filter: brightness(0) invert(1) !important;
}

/* Elementor admin bar - Dark Mode */
.webup-dark-mode #e-admin-top-bar-root {
    background: #252525 !important;
    border-color: rgba(255, 255, 255, 0.08) !important;
}

.webup-dark-mode #e-admin-top-bar-root *,
.webup-dark-mode .e-admin-top-bar__main-area *,
.webup-dark-mode .e-admin-top-bar__secondary-area * {
    color: #e0e0e0 !important;
}

.webup-dark-mode #e-admin-top-bar-root svg {
    filter: brightness(0) invert(1) !important;
}

/* Lighter blue for icons/links in dark mode for better readability */
.webup-dark-mode #wpadminbar .ab-icon:before,
.webup-dark-mode #wpadminbar .ab-item:before {
    color: #6ba3d6 !important;
}

.webup-dark-mode #wpadminbar #wp-admin-bar-wp-logo > .ab-item .ab-icon:before {
    color: #6ba3d6 !important;
}

.webup-dark-mode a {
    color: #6ba3d6;
}

.webup-dark-mode a:hover {
    color: #8fc1eb;
}

/* WooCommerce Settings Page - Dark Mode */
.webup-dark-mode.woocommerce_page_wc-settings #mainform,
.webup-dark-mode .woocommerce_page_wc-settings #mainform {
    background: #252525 !important;
    color: #e0e0e0 !important;
    padding: 20px;
    border-radius: 12px;
}

.webup-dark-mode.woocommerce_page_wc-settings #mainform h2,
.webup-dark-mode.woocommerce_page_wc-settings #mainform h3,
.webup-dark-mode.woocommerce_page_wc-settings #mainform label,
.webup-dark-mode .woocommerce_page_wc-settings #mainform h2,
.webup-dark-mode .woocommerce_page_wc-settings #mainform h3,
.webup-dark-mode .woocommerce_page_wc-settings #mainform label {
    color: #e0e0e0 !important;
}

.webup-dark-mode.woocommerce_page_wc-settings .nav-tab-wrapper,
.webup-dark-mode .woocommerce_page_wc-settings .nav-tab-wrapper {
    background: transparent;
}

.webup-dark-mode.woocommerce_page_wc-settings .nav-tab,
.webup-dark-mode .woocommerce_page_wc-settings .nav-tab {
    background: #333;
    border-color: rgba(255, 255, 255, 0.08);
    color: #e0e0e0;
}

.webup-dark-mode.woocommerce_page_wc-settings .nav-tab-active,
.webup-dark-mode .woocommerce_page_wc-settings .nav-tab-active {
    background: #252525;
    border-bottom-color: #252525;
    color: #fff;
}