/*==============================================
Wbcom Admin Wrapper Style
==============================================*/

/* Common Variables (as CSS custom properties) */
:root {
    /* Colors */
    --primary-color: #2A32EF;
    --secondary-color: #272B41;
    --success-color: #4fb845;
    --error-color: #FF0000;
    --background-light: #F6F7FE;
    --background-lighter: #FBFBFB;
    --background-input: #F4F5F7;
    --border-color: rgba(200, 197, 218, 0.30);
    --border-color-medium: rgba(200, 197, 218, 0.50);
    --text-dark: #1d2327;
    --text-medium: #4c5261;
    --text-light: #646F89;

    /* Typography */
    --font-size-small: 12px;
    --font-size-normal: 14px;
    --font-size-medium: 15px;
    --font-size-large: 20px;
    --font-size-xlarge: 32px;
    --font-weight-normal: 400;
    --font-weight-medium: 500;
    --font-weight-bold: 600;

    /* Effects */
    --transition-normal: all 0.3s;
    --shadow-normal: 0 15px 36px rgba(32, 53, 85, 0.15);
    --shadow-small: 0 8px 20px rgba(32, 53, 85, 0.25);

    /* Spacing & Layout */
    --border-radius-small: 8px;
    --border-radius-medium: 10px;
    --border-radius-large: 12px;
    --spacing-small: 10px;
    --spacing-normal: 15px;
    --spacing-medium: 20px;
    --spacing-large: 30px;
}

/* ========== Base Styles ========== */
.wbcom-bb-plugins-offer-wrapper {
    margin: 40px 10px -10px;
}

#wb_admin_logo a {
    display: block;
}

#wb_admin_logo a img {
    width: 100%;
}

/* Typography */
.wbcom-admin-title-section h3,
h4.wbcom-support-section {
    margin-top: 0;
    color: var(--primary-color);
    font-size: var(--font-size-large);
    text-transform: capitalize;
}

.wbcom-addons-card-details h2,
.wbcom_help_support_details .wbcom_help_support_inner_details h4,
.wbcom-support-info-wrap .wbcom-support-info-widgets h3 {
    font-size: var(--font-size-large);
    color: #1D2A4F;
    margin: 12px 0;
}

.wbcom-addons-card-details h2 {
    margin: 0;
}

.wbcom-addons-card-details p,
.wbcom_help_support_details .wbcom_help_support_inner_details p,
#wbcom_admin_content_support p,
.wbcom-welcome-description {
    font-size: var(--font-size-medium);
    color: #000;
    margin: 8px 0 3px;
}

.wbcom-welcome-support-info .wbcom-support-inner p,
.wbcom-tab-content p.description {
    font-size: var(--font-size-medium);
    color: var(--text-light);
}

#wbcom-learndash-extension,
#wbcom-themes-list,
#wbcom-free-extension,
.wbcom-addons-image-card {
    display: none;
}

/* ========== Common Containers ========== */
.wbcom-admin-option-wrap,
.wbcom-welcome-support-info,
.wb-plugins-license-tables-wrap,
#wbcom-faq-settings-section,
ul#wbcom_support_list {
    position: relative;
    margin: 20px 0 0;
    padding: 30px;
    box-shadow: none;
    background: var(--background-light);
    font-size: var(--font-size-medium);
    line-height: 2.1em;
    overflow: hidden;
    border-radius: var(--border-radius-large);
    width: auto;
}

.wbcom-settings-section-wrap {
    background: #fff;
    border-radius: var(--border-radius-large);
    padding: 15px 25px 25px;
    border: 1px solid var(--border-color);
    box-shadow: 5px 5px 20px rgba(32, 53, 85, 0.10);
    margin-bottom: 20px;
    overflow: hidden;
    width: auto;
}

.wbcom-settings-section-options-heading {
    border-bottom: 1px solid var(--border-color-medium);
    margin-bottom: 20px;
    padding-bottom: 12px;
    line-height: 1.6;
}

.wbcom-settings-section-options-heading label {
    color: var(--text-dark);
    font-size: var(--font-size-medium);
    font-weight: var(--font-weight-medium);
}

.wbcom-settings-section-options-heading p.description {
    margin: 0;
    padding: 0 !important;
    font-size: var(--font-size-medium);
    color: #000;
}

.wbcom-wrap {
    margin: 30px 10px;
    overflow: hidden;
    border-radius: var(--border-radius-large);
    border: 1px solid #d9d9d9;
}

.wrap .wbcom-plugin-heading {
    display: block !important;
    margin: 0;
    font-size: var(--font-size-xlarge);
    line-height: initial;
    font-weight: 300;
    color: #626369;
    background: var(--background-lighter);
    padding: 16px 20px;
    border-bottom: 1px solid #e8e8e8;
    border-top: 1px solid #e8e8e8;
}

.wbcom-all-addons-plugins-wrap {
    padding: var(--spacing-large);
    background: #fff;
}

ul.wbcom-settings-member-retraction.wbcom-settings-section-options-flex {
    margin: 0;
}

.wbcom-settings-section-options ul.wbcom-settings-member-retraction.wbcom-settings-section-options-flex li {
    width: 33.33%;
}

.wbcom-settings-section-options ul.wbcom-settings-member-retraction li label {
    margin-left: 8px;
    font-weight: 500;
}

.wbcom-settings-section-options ul.wbcom-settings-member-retraction li label.wb-switch {
    margin: 0;
}

/* ========== Form Elements ========== */
/* Inputs & Selects */
.form-table.wbcom-admin-option-wrap input[type=text],
.form-table.wbcom-admin-option-wrap select,
.wbcom-settings-section-options select,
.wbcom-settings-section-options .selectize-input,
.wbcom-settings-section-options [type="text"],
.wbcom-settings-section-options [type="number"],
.wb-license-form-table td.wb-plugin-license-key input {
    height: 40px;
    border-radius: var(--border-radius-small) !important;
    background-color: var(--background-input);
    border-color: #e2e2e2;
    width: 100%;
    box-shadow: none;
}

.wbcom-settings-section-options .selectize-input {
    height: auto;
    box-shadow: none;
    padding: 0px 10px !important;
}

/* Radio & Checkbox */
.wbcom-settings-section-options input[type=radio] {
    width: 30px;
    height: 30px;
    border: 2px solid #ccc;
    box-shadow: none !important;
    margin: 0 5px 0 0;
}

.wbcom-settings-section-options input[type=radio]:checked::before {
    width: 18px;
    height: 18px;
    margin: 4px;
    background-color: var(--primary-color);
}

.wbcom-admin-option-wrap th {
    width: 250px;
    padding: 20px;
    vertical-align: middle;
}

.form-table.wbcom-admin-option-wrap .form-table td {
    padding: 20px;
}

/* ========== Flexbox Layout ========== */
.wbcom-settings-section-options-flex,
.wbcom_admin_header-wrapper,
ul.wbcom-addons-plugins-links,
.wbcom-bp-addons-plugins-title-section,
.wbcom-addon-plugins-inner-wrapper,
.wbcom-addons-plugins-card,
.wbcom-addons-card-button,
.wbcom-support-info-wrap,
ul#wbcom_support_list,
#wb_admin_header #wb_admin_nav ul li.wb_admin_nav_item a {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
}

.wbcom-settings-section-options-flex,
ul.wbcom-addons-plugins-links,
.wbcom-bp-addons-plugins-title-section,
#wb_admin_header #wb_admin_nav ul li.wb_admin_nav_item a {
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
}

.wbcom-addon-plugins-inner-wrapper,
.wbcom-addons-card-button {
    -ms-flex-wrap: wrap;
    flex-wrap: wrap;
}

.wbcom_admin_header-wrapper,
.wbcom-bp-addons-plugins-title-section,
ul#wbcom_support_list,
.wbcom-support-info-wrap,
.wbcom-addon-plugins-inner-wrapper {
    -webkit-box-pack: justify;
    -ms-flex-pack: justify;
    justify-content: space-between;
}

.wbcom-addons-plugins-card {
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
}

.wbcom-settings-section-options-flex select#my_dashboard_page {
    margin-right: 15px;
}

/* ========== Button Styles ========== */
.wbcom-settings-section-options.wbcom-settings-section-options-flex a.button-secondary,
.wbcom-bp-addons-plugins-title-section a.wbcom-addons-button,
.wbcom_help_support_details .wbcom_help_support_button a.wb_btn.wb_btn_default,
.wbcom-admin-settings-page .wbcom-tab-content .button.button-primary:not(.button-welcome-support),
.wb-license-form-table .wb-license-action .button-secondary,
.wbcom-support-info-wrap .wbcom-support-info-widgets a.button-primary.button-welcome-support {
    background: var(--primary-color);
    color: #fff;
    border-color: var(--primary-color);
    border-radius: var(--border-radius-medium);
    font-size: var(--font-size-medium);
    font-weight: var(--font-weight-medium);
    text-align: center;
    -webkit-transition: var(--transition-normal);
    transition: var(--transition-normal);
    text-decoration: none;
    display: inline-block;
}

.wbcom-settings-section-options.wbcom-settings-section-options-flex a.button-secondary {
    height: 40px;
    line-height: 40px;
    width: 100px;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
}

.wbcom-bp-addons-plugins-title-section {
    margin-bottom: 25px;
}

ul.wbcom-addons-plugins-links li {
    margin: 0 var(--spacing-large) 0 0;
}

.wbcom-bp-addons-plugins-title-section .wbcom-addons-plugins-links li a {
    border: none;
    padding: 0px;
    font-weight: var(--font-weight-medium);
    font-size: var(--font-size-medium);
    background: transparent;
    text-decoration: none;
    color: var(--secondary-color);
}

.wbcom-bp-addons-plugins-title-section .wbcom-addons-plugins-links li a.wbcom-addons-link-active, 
.wbcom-bp-addons-plugins-title-section .wbcom-addons-plugins-links li a:hover {
    color: var(--primary-color);
}

.wbcom-bp-addons-plugins-title-section .wbcom-addons-plugins-links li a:focus {
    box-shadow: none !important;
    outline: none !important;
}

.wbcom-bp-addons-plugins-list.wbcom-bp-free-addon-plugins .wbcom-bp-addons-plugins-title-section {
    background: var(--background-light);
    padding: var(--spacing-normal) var(--spacing-medium);
    border-radius: var(--border-radius-large);
}

.wbcom-bp-addons-plugins-title-section h4.wbcom-plugin-heading {
    border: none;
    padding: 0px;
    font-weight: var(--font-weight-medium);
    font-size: var(--font-size-large);
    background: transparent;
    text-decoration: none;
    color: var(--primary-color);
}

.wbcom-bp-addons-plugins-title-section a.wbcom-addons-button {
    line-height: 1.2;
    padding: 15px 30px;
    box-shadow: var(--shadow-small);
}

.wbcom-admin-settings-page .wbcom-tab-content .button.button-primary:not(.button-welcome-support) {
    line-height: 55px;
    padding: 0 45px;
    border: 0;
    box-shadow: 0px 10px 25px rgba(32, 53, 85, 0.35);
    border-radius: var(--border-radius-large);
}

.wbcom_help_support_details .wbcom_help_support_button a.wb_btn.wb_btn_default {
    line-height: 30px;
    padding: 10px 15px;
    max-width: 150px;
    width: 100%;
    margin-top: 15px;
    border-radius: var(--border-radius-large);
}

.wbcom-support-info-wrap .wbcom-support-info-widgets a.button-primary.button-welcome-support {
    line-height: 30px;
    padding: 10px 20px;
    max-width: 190px;
    width: 100%;
    border-radius: var(--border-radius-large);
}

/* Addon card buttons */
.wbcom-addons-card-button a.wbcom-addons-button {
    line-height: 1.3;
    font-size: var(--font-size-medium);
    font-weight: var(--font-weight-medium);
    padding: 13px 30px;
    border-radius: var(--border-radius-medium);
    background-color: rgba(62, 98, 245, .2);
    color: var(--primary-color);
    display: inline-block;
    text-decoration: none;
    text-align: center;
    margin-right: 10px;
    margin-top: 10px;
    -webkit-transition: var(--transition-normal);
    transition: var(--transition-normal);
}

.wbcom-addons-card-button a.wbcom-addons-button.wbcom-purchase {
    background-color: rgba(255, 64, 140, .2);
    color: #ff4040;
}

/* Button hover states */
.wbcom-settings-section-options.wbcom-settings-section-options-flex a.button-secondary:hover,
.wbcom-bp-addons-plugins-title-section a.wbcom-addons-button:hover,
.wbcom_help_support_details .wbcom_help_support_button a.wb_btn.wb_btn_default:hover,
.wbcom-admin-settings-page .wbcom-tab-content .button.button-primary:not(.button-welcome-support):hover,
.wb-license-form-table .wb-license-action .button-secondary:hover,
.wbcom-support-info-wrap .wbcom-support-info-widgets a.button-primary.button-welcome-support:hover,
.wbcom-addons-card-button a.wbcom-addons-button:hover {
    background: var(--secondary-color);
    color: #fff;
    border-color: var(--secondary-color);
}

.wbcom-addons-card-button a.wbcom-addons-button.wbcom-purchase:hover {
    background-color: #ff4040;
    color: #fff;
}

/* ========== Header & Navigation ========== */
div#wb_admin_plugin_name {
    font-size: var(--font-size-large);
    font-weight: var(--font-weight-bold);
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    color: #000;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
}

div#wb_admin_plugin_name span {
    font-size: var(--font-size-small);
    margin-left: 30px;
    background: var(--primary-color);
    color: #fff;
    padding: 1px 15px;
    line-height: 25px;
    border-radius: 100px;
    display: inline-block;
}

.wbcom_admin_header-wrapper {
    background: #E1E6F4;
    position: relative;
    border-radius: 12px 12px 0 0;
    padding: 25px 30px;
}

#wb_admin_header:after {
    visibility: hidden;
    display: none;
    font-size: 0;
    content: " ";
    clear: both;
    height: 0;
}

#wb_admin_header #wb_admin_logo {
    display: inline-block;
    float: left;
    margin-bottom: 0;
}

#wb_admin_header #wb_admin_logo img {
    margin: 28px 20px;
    width: 160px;
}

#wb_admin_header #wb_admin_logo .wb_admin_right,
#wb_admin_header #wb_admin_nav {
    float: right;
}

/* Admin Nav Menu */
#wb_admin_header #wb_admin_nav ul {
    display: inline-block;
    margin: 0;
    padding: 0;
    text-align: center;
    font-size: 0;
}

#wb_admin_header #wb_admin_nav ul li.wb_admin_nav_item {
    display: inline-block;
    margin: 0;
    font-size: 0;
    border-radius: 0;
    position: relative;
    vertical-align: bottom;
}

#wb_admin_header #wb_admin_nav ul li.wb_admin_nav_item a {
    font-size: var(--font-size-medium);
    padding-left: 30px;
    color: #222222;
    -webkit-transition: all .2s ease-out;
    transition: all .2s ease-out;
    text-decoration: none;
}

#wb_admin_header #wb_admin_nav ul li.wb_admin_nav_item a:focus {
    outline: none;
    box-shadow: none;
}

#wb_admin_header #wb_admin_nav ul li.wb_admin_nav_item a:hover,
#wb_admin_header #wb_admin_nav ul li.wb_admin_nav_item.is_active a {
    color: var(--primary-color);
    box-shadow: none;
}

#wb_admin_header #wb_admin_nav ul li.wb_admin_nav_item a i {
    font-size: 1em;
    margin-right: 8px;
}

#wb_admin_header #wb_admin_nav ul li.wb_admin_nav_item a svg {
    margin-right: 8px;
}

#wb_admin_header #wb_admin_nav ul li.wb_admin_nav_item a h4 {
    font-size: 1em;
    font-weight: var(--font-weight-medium);
    margin: 0 0;
}

/* Settings Page Layout */
.wbcom-admin-settings-page {
    background: #fff;
    padding: 30px 30px 35px;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    overflow: hidden;
}

.wbcom-tabs-section {
    background: #E1E6F4;
    border-radius: var(--border-radius-large);
    overflow: hidden;
    width: 18%;
    padding: 1%;
}

.wbcom-admin-settings-page .nav-tab-wrapper,
.wrap .wbcom-admin-settings-page h2.nav-tab-wrapper,
.wbcom-admin-settings-page h1.nav-tab-wrapper {
    padding-top: 0;
    padding-bottom: 100px;
    margin: 0;
    border-bottom: 0;
}

.wbcom-admin-settings-page h2 {
    margin: 0;
}

.wbcom-admin-settings-page .nav-tab-wrapper ul {
    margin: 0;
    padding: 0;
    list-style: none;
}

.wbcom-admin-settings-page .nav-tab-wrapper ul li {
    margin: 0 0 2px;
}

/* Tabs */
.wbcom-admin-settings-page .nav-tab-wrapper .nav-tab {
    float: none;
    display: block;
    border: 0;
    margin: 0;
    padding: 13px 20px;
    font-size: var(--font-size-medium);
    font-weight: var(--font-weight-medium);
    line-height: 25px;
    white-space: normal;
    background: transparent;
    color: #041137;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
    text-decoration: none;
    border-radius: var(--border-radius-medium);
    -webkit-transition: all .2s ease-out;
    transition: all .2s ease-out;
    box-shadow: none;
    outline: none;
    border: none;
}

.wbcom-admin-settings-page .nav-tab-wrapper .nav-tab-active,
.wbcom-admin-settings-page .nav-tab-wrapper .nav-tab:hover,
.wbcom-admin-settings-page .nav-tab-active:focus,
.wbcom-admin-settings-page .nav-tab-active:focus:active,
.wbcom-admin-settings-page .nav-tab-active:hover {
    color: var(--primary-color);
    background: #ffffff;
    box-shadow: 0px 12px 30px rgba(53, 66, 134, 0.12);
    -webkit-transition: all .3s ease-in;
    transition: all .3s ease-in;
    border-radius: var(--border-radius-medium);
    outline: none;
    border: none;
}

.wbcom-admin-settings-page .wbcom-tab-content {
    width: 81%;
    background: #fff;
    padding-left: 30px;
}

.wbcom-tab-content select,
.wbcom-tab-content select option {
    width: 100%;
    display: inline-block;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
    vertical-align: middle;
}

.wbcom-tab-content p.description {
    color: #49505a;
    font-size: var(--font-size-normal);
    line-height: 18px;
    display: block;
    padding-top: 3px;
}

/* Nav Tab Icons */
.nav-tab-wrapper ul li a.nav-tab:before {
    content: "\f229";
    font-family: dashicons;
    display: inline-block !important;
    line-height: normal;
    font-weight: var(--font-weight-normal);
    font-style: normal;
    speak: never;
    text-decoration: inherit;
    text-transform: none;
    text-rendering: auto;
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
    width: 20px;
    height: 20px;
    font-size: var(--font-size-large);
    vertical-align: top;
    text-align: center;
    -webkit-transition: color 0.1s ease-in;
    transition: color 0.1s ease-in;
    margin-right: 8px;
}

.nav-tab-wrapper ul li:first-child a.nav-tab:before {
    content: "\f102";
}

/* ========== Content Cards ========== */
.wbcom-addons-plugins-card {
    background: var(--background-lighter);
    border-radius: var(--border-radius-medium);
    box-shadow: 0 10px 25px rgba(173, 180, 210, 0.20);
    padding: 1.2%;
    border: 1px solid rgba(200, 197, 218, 0.35);
    margin-bottom: 25px;
    width: 29.7%;
}

.wbcom-addons-card-details p {
    margin: 8px 0 3px;
    font-size: var(--font-size-medium);
    color: var(--text-medium);
    overflow: hidden;
    text-overflow: ellipsis;
    display: -webkit-box;
    -webkit-line-clamp: 3;
    line-clamp: 3;
    -webkit-box-orient: vertical;
}

/* Support Boxes */
.wbcom_help_support_box {
    -ms-flex-item-align: start;
    align-self: flex-start;
    width: 100%;
    max-width: 48%;
    background: #fff;
    border-radius: var(--border-radius-large);
    padding: 30px;
    margin: 0 1%;
    border: 1px solid var(--border-color-medium);
    box-shadow: var(--shadow-normal);
}

.wbcom_help_support_icon_wrapper i.fa {
    font-size: 40px;
    color: var(--primary-color);
}

.wbcom-welcome-support-info .wbcom-support-inner p {
    height: 95px;
    margin-bottom: 20px;
    overflow: hidden;
    text-overflow: ellipsis;
    display: -webkit-box;
    -webkit-line-clamp: 4;
    line-clamp: 4;
    -webkit-box-orient: vertical;
}

.wbcom-support-info-wrap {
    margin: 40px -15px 10px;
}

.wbcom-support-info-wrap .wbcom-support-info-widgets {
    -ms-flex-item-align: start;
    align-self: flex-start;
    width: 100%;
    max-width: 325px;
    background: #fff;
    border-radius: var(--border-radius-large);
    padding: 30px;
    margin: 0 15px;
    border: 1px solid var(--border-color-medium);
    box-shadow: var(--shadow-normal);
}

/* Welcome Page */
.wbcom-welcome-title {
    font-size: var(--font-size-large);
    font-weight: var(--font-weight-bold);
    margin: 0;
    padding: 0px 0 4px 0;
    line-height: 1.3;
}

.wbcom-welcome-description {
    margin: 0 0 30px;
}

.wbcom-welcome-main-wrapper {
    position: relative;
    font-size: var(--font-size-medium);
}

.wbcom-welcome-support-info h3 {
    margin: 1.25em 0 .6em;
    margin-top: 0;
    font-size: var(--font-size-large);
    line-height: 1.5;
    color: var(--primary-color);
}

.wbcom-welcome-support-info hr {
    display: none;
}

.wbcom-welcome-support-info .dashicons {
    vertical-align: middle;
    margin: 0 0 15px;
    height: 40px;
    color: var(--primary-color);
    font-size: 40px;
    display: block;
    width: 40px;
}

.wbcom-welcome-support-info p {
    font-size: var(--font-size-medium);
    color: #333333;
    margin-top: 0;
}

/* ========== License Tables ========== */
.wbcom-license-support-wrapp {
    border-radius: var(--border-radius-large);
    overflow: hidden;
    border: 1px solid #e2e2e2;
}

.wb-license-form-table {
    margin: 0;
    border: none;
}

.wb-license-form-table thead,
.wb-license-form-table tfoot {
    background: #fff;
    border: none;
}

.wb-license-form-table tr td:first-child {
    padding-left: 20px;
}

.wb-license-form-table tr td:last-child {
    padding-right: 20px;
    text-align: right;
}

.wb-license-form-table thead th,
.wb-license-form-table tfoot th {
    padding: 20px 10px;
    font-size: var(--font-size-medium);
}

.wb-license-form-table thead th:first-child,
.wb-license-form-table tfoot th:first-child {
    padding-left: 20px;
}

.wb-license-form-table td.wb-plugin-name,
.wb-license-form-table th.wb-product-th {
    width: 20%;
}

.wb-license-form-table td.wb-plugin-version,
.wb-license-form-table th.wb-version-th {
    width: 10%;
}

.wb-license-form-table td.wb-plugin-license-key,
.wb-license-form-table th.wb-key-th {
    width: 30%;
}

.wb-license-form-table td.wb-license-status,
.wb-license-form-table th.wb-status-th {
    width: 10%;
}

.wb-license-form-table td.wb-license-action,
.wb-license-form-table th.wb-action-th {
    width: 15%;
}

.wb-license-form-table .submit {
    margin: 0;
    padding: 0;
    text-align: right;
}

.wb-license-form-table td.wb-plugin-name {
    font-weight: var(--font-weight-bold);
}

.wb-license-form-table td.wb-plugin-version {
    color: var(--primary-color);
    font-weight: var(--font-weight-medium);
}

.wb-license-form-table td.wb-license-status {
    color: var(--error-color);
    font-weight: var(--font-weight-medium);
    position: relative;
}

.wb-license-form-table td.wb-license-status:before {
    content: "\f335";
    font-family: 'dashicons';
    margin-right: 5px;
    position: relative;
    font-size: 24px;
    vertical-align: middle;
    top: -1px;
}

.wb-license-form-table td.wb-license-status.active {
    color: #00c749;
    font-weight: var(--font-weight-medium);
}

.wb-license-form-table td.wb-license-status.active:before {
    content: "\f147";
}

.wb-license-form-table .button {
    font-size: var(--font-size-normal);
    text-shadow: none;
    font-weight: var(--font-weight-bold);
    border: 0;
    box-shadow: none;
}

.wb-license-form-table .wb-license-action .button-secondary {
    width: 100%;
    line-height: 30px;
    font-size: var(--font-size-medium);
    padding: 8px 15px;
    border-radius: var(--border-radius-large);
}

.mobile-license-headings {
    display: none;
}

.wbcom-license-support-wrapp form[method="post"] {
    border-bottom: 1px solid #e2e2e2;
}

/* ========== Switch & Toggle Controls ========== */
.wb-switch {
    display: inline-block;
    border: none !important;
    position: relative;
    line-height: 0;
    height: 32px;
    width: 70px;
    min-width: 70px;
    box-shadow: none;
}

.wb-switch input {
    display: none;
}

.wb-slider {
    position: absolute;
    cursor: pointer;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    border-radius: var(--border-radius-small);
    background: #ed6f6f;
    -webkit-transition: .4s;
    transition: .4s;
}

.wb-slider:before {
    content: "";
    bottom: 4px;
    position: absolute;
    top: 6px;
    left: 6px !important;
    width: 24px;
    height: 20px;
    background-color: #fff;
    border-radius: 6px;
    -webkit-transition: all .3s;
    transition: all .3s;
    box-shadow: 0px 0px 8px rgba(0, 0, 0, 0.35);
}

.wb-switch input:checked+.wb-slider {
    background-color: var(--success-color);
}

.wb-switch input:checked+.wb-slider:before {
    -webkit-transform: translateX(33px);
    -ms-transform: translateX(33px);
    transform: translateX(33px);
    background-color: #ffffff;
    margin: 0 !important;
    padding: 0 !important;
}

.wbcom-admin-option-wrap .form-table input[type=checkbox] {
    border: none !important;
    border-radius: var(--border-radius-small);
    background: #ed6f6f;
    position: relative;
    line-height: 0;
    height: 32px;
    width: 70px;
    min-width: 70px;
    box-shadow: none;
}

.wbcom-admin-option-wrap .form-table input[type=checkbox]:before {
    content: "";
    bottom: 4px;
    position: absolute;
    top: 6px;
    left: 6px !important;
    width: 24px;
    height: 20px;
    background-color: #fff;
    border-radius: 6px;
    -webkit-transition: all .3s;
    transition: all .3s;
    box-shadow: 0px 0px 8px rgba(0, 0, 0, 0.35);
}

.wbcom-admin-option-wrap .form-table input[type=checkbox]:checked {
    background-color: var(--success-color);
}

.wbcom-admin-option-wrap .form-table input[type=checkbox]:checked::before {
    -webkit-transform: translateX(33px);
    -ms-transform: translateX(33px);
    transform: translateX(33px);
    background-color: #ffffff;
    margin: 0 !important;
    padding: 0 !important;
}

.wbcom-admin-option-wrap .form-table input[type=checkbox]:after,
.wbcom-admin-option-wrap .form-table input[type=checkbox]:checked::after,
.wb-slider.wb-round::after {
    content: "OFF";
    color: #fff;
    font-size: var(--font-size-small);
    font-weight: var(--font-weight-medium);
    position: absolute;
    top: 16px;
    right: 11px;
}

.wbcom-admin-option-wrap .form-table input[type=checkbox]:checked::after,
.wb-switch input:checked+.wb-slider::after {
    content: "ON";
    right: unset;
    left: 10px;
}

/* ========== FAQ Section ========== */
#wbcom-faq-settings-section {
    padding: 20px 30px;
}

.wbcom-faq-section-row {
    -ms-flex-item-align: start;
    align-self: flex-start;
    width: auto;
    background: #fff;
    border-radius: var(--border-radius-medium);
    padding: 12px 25px;
    padding-right: 40px;
    margin: 12px 0;
    border: 1px solid var(--border-color-medium);
    box-shadow: var(--shadow-normal);
    -webkit-transition: all 0.6s ease 0s;
    transition: all 0.6s ease 0s;
    position: relative;
}

button.wbcom-faq-accordion {
    border: medium none;
    color: #333;
    cursor: pointer;
    font-size: var(--font-size-medium);
    font-weight: var(--font-weight-medium);
    outline: medium none;
    text-align: left;
    padding: 0;
    background-color: transparent;
    -webkit-transition: all 0.4s ease 0s;
    transition: all 0.4s ease 0s;
    width: 100%;
}

button.wb-ads-accordion.active,
button.wb-ads-accordion:hover {
    color: var(--primary-color);
}

div.wbcom-faq-panel {
    padding: 0;
    max-height: 0;
    overflow: hidden;
    -webkit-transition: max-height 0.2s ease-out;
    transition: max-height 0.2s ease-out;
    margin: 0px;
}

button.wbcom-faq-accordion::after {
    color: hsl(0, 0%, 47%);
    content: "+";
    float: right;
    font-size: 22px;
    font-weight: bold;
    margin-left: 5px;
    right: 15px;
    position: absolute;
    top: 10px;
}

button.wbcom-faq-accordion.active::after {
    content: "−";
}

.wbcom-faq-admin-row {
    clear: both;
}

div.wbcom-faq-panel p {
    font-size: var(--font-size-medium);
    margin: 5px 0 0;
}

/* ========== Miscellaneous Styles ========== */
.selectize-control.multi .selectize-input div.item {
    border-radius: 5px;
    background: #ffffff;
    border: 1px solid #d0d0d0;
}

.selectize-control.plugin-remove_button [data-value] .remove {
    color: red !important;
}

.selectize-input.items.not-full.has-options.input-active.dropdown-active {
    border-radius: var(--border-radius-small);
}

/* ========== Mobile Menu Toggle ========== */
.wb-responsive-menu {
    margin: 0;
    height: 50px;
    display: none;
    color: var(--text-dark);
    cursor: pointer;
    padding: 0 20px;
    font-size: var(--font-size-medium);
    overflow: hidden;
    line-height: 50px;
    font-weight: var(--font-weight-medium);
}

.wb-toggle-icon {
    float: right;
    display: none;
    cursor: pointer;
    padding: 10px 2px;
    margin: 14px 0 0 0;
    position: relative;
    -webkit-tap-highlight-color: transparent;
    -webkit-user-select: none;
    -ms-user-select: none;
    user-select: none;
}

.wb-toggle-icon .wb-icon-bars {
    width: 25px;
    height: 3px;
    display: none;
    position: relative;
    background: var(--text-dark);
    -webkit-transition: background .2s ease-out;
    transition: background .2s ease-out;
}

.wb-toggle-icon .wb-icon-bars:before,
.wb-toggle-icon .wb-icon-bars:after {
    background: var(--text-dark);
    content: '';
    display: block;
    height: 100%;
    position: absolute;
    width: 100%;
    -webkit-transition-duration: 0.3s, 0.3s;
    transition-duration: 0.3s, 0.3s;
    -webkit-transition-delay: 0.3s, 0s;
    transition-delay: 0.3s, 0s;
}

.wb-toggle-icon .wb-icon-bars:before {
    top: -8px;
    -webkit-transition-property: top, -webkit-transform;
    transition-property: top, transform;
}

.wb-toggle-icon .wb-icon-bars:after {
    bottom: -8px;
    -webkit-transition-property: bottom, -webkit-transform;
    transition-property: bottom, transform;
}

.wb-toggle-btn {
    display: none !important;
}

.wb-toggle-btn:checked~.wb-toggle-icon .wb-icon-bars {
    background: transparent;
}

.wb-toggle-btn:checked~.wb-toggle-icon .wb-icon-bars:before {
    top: 0;
    position: relative;
    -webkit-transform: rotate(45deg);
    -ms-transform: rotate(45deg);
    transform: rotate(45deg);
}

.wb-toggle-btn:checked~.wb-toggle-icon .wb-icon-bars:after {
    bottom: 0;
    -webkit-transform: rotate(-45deg);
    -ms-transform: rotate(-45deg);
    transform: rotate(-45deg);
}

.wb-toggle-btn:checked~.wb-toggle-icon .wb-icon-bars:before,
.wb-toggle-btn:checked~.wb-toggle-icon .wb-icon-bars:after {
    -webkit-transition-delay: 0s, 0.3s;
    transition-delay: 0s, 0.3s;
}

/* ========== Media Queries ========== */
@media screen and (max-width: 1199px) {
    .wbcom-demo-title ul li {
        width: 100%;
    }
}

@media screen and (max-width: 1189px) {

    /* Nav and Toggle */
    .nav-tab-wrapper>ul {
        display: none;
    }

    .wb-responsive-menu,
    .wb-toggle-icon,
    .wb-toggle-icon .wb-icon-bars {
        display: block;
    }

    .wbcom-admin-settings-page .nav-tab-wrapper .nav-tab {
        float: none;
    }

    /* Header Nav */
    #wb_admin_header #wb_admin_nav ul {
        display: -webkit-box;
        display: -ms-flexbox;
        display: flex;
        -webkit-box-align: center;
        -ms-flex-align: center;
        align-items: center;
        -ms-flex-wrap: wrap;
        flex-wrap: wrap;
        -webkit-box-pack: justify;
        -ms-flex-pack: justify;
        justify-content: space-between;
    }

    #wb_admin_header #wb_admin_nav ul li.wb_admin_nav_item a i {
        display: none;
    }

    #wb_admin_header #wb_admin_nav ul li.wb_admin_nav_item a {
        font-size: var(--font-size-small);
        border: 0;
        min-width: inherit;
        padding: 5px;
        line-height: 1;
    }

    /* Settings Pages */
    .wbcom-admin-settings-page {
        padding: var(--spacing-medium);
    }

    .wbcom-admin-option-wrap {
        padding: var(--spacing-small) var(--spacing-medium) var(--spacing-medium);
    }

    .wbcom-tabs-section {
        border-radius: var(--border-radius-medium);
        width: auto;
        padding: 0;
        margin: var(--spacing-small) 5px 0;
    }

    .nav-tab-wrapper ul.wbcom-show-mobile-menu {
        display: block;
        padding: 0 var(--spacing-normal) var(--spacing-normal);
    }

    .wbcom-admin-settings-page .wbcom-tab-content {
        width: auto;
        padding: var(--spacing-medium) 5px;
    }

    .wbcom-welcome-support-info {
        padding: 18px;
    }

    .wbcom-welcome-support-info p,
    .wbcom-welcome-description {
        font-size: var(--font-size-normal);
    }

    .wbcom-support-info-wrap {
        display: block;
    }

    .wbcom-support-info-wrap .wbcom-support-info-widgets {
        width: auto;
        max-width: 100%;
        padding: var(--spacing-medium);
        margin: var(--spacing-normal);
    }

    .form-table th[scope="row"],
    .form-table th[scope="row"] {
        padding-bottom: 0 !important;
    }

    .wbcom-welcome-support-info .wbcom-support-inner p {
        height: auto;
    }

    /* Theme Page */
    .wbcom-bp-addons-plugins-title-section {
        display: block;
    }

    ul.wbcom-addons-plugins-links {
        margin: 0;
        -webkit-box-pack: justify;
        -ms-flex-pack: justify;
        justify-content: space-between;
    }

    .wbcom-bp-addons-plugins-title-section .wbcom-addons-plugins-links li a {
        font-size: var(--font-size-normal);
    }

    .wbcom-bp-addons-plugins-title-section a.wbcom-addons-button {
        display: inline-block;
        margin-top: 15px;
    }

    .wbcom-addons-card-button a.wbcom-addons-button {
        margin-top: 10px;
    }

    .wbcom-bp-addons-plugins-list.wbcom-bp-free-addon-plugins .wbcom-bp-addons-plugins-title-section {
        display: -webkit-box;
        display: -ms-flexbox;
        display: flex;
    }

    .wbcom-bp-addons-plugins-list.wbcom-bp-free-addon-plugins .wbcom-bp-addons-plugins-title-section a.wbcom-addons-button {
        margin: 0;
    }

    .wbcom_help_support_box {
        margin: var(--spacing-medium) 0;
    }

    ul#wbcom_support_list {
        padding: 0px var(--spacing-normal);
    }

    .wb-plugins-license-tables-wrap {
        padding: var(--spacing-normal);
    }

    .wbcom-admin-settings-page {
        display: block;
        width: 95%;
        padding: 2.5%;
    }

    .wbcom-all-addons-plugins-wrap {
        padding: var(--spacing-medium);
    }

    #wb_admin_header #wb_admin_logo .wb_admin_right,
    #wb_admin_header #wb_admin_nav {
        float: none;
    }

    .wbcom-admin-settings-page .nav-tab-wrapper,
    .wrap .wbcom-admin-settings-page h2.nav-tab-wrapper,
    .wbcom-admin-settings-page h1.nav-tab-wrapper {
        width: 100%;
        padding-bottom: 0;
    }

    .wbcom-admin-settings-page .wbcom-tab-content .button.button-primary {
        float: none;
    }

    .reign-importer-section {
        padding: 16px 0;
    }

    .wbcom_admin_tab_content {
        padding: 16px var(--spacing-normal);
    }

    .wbcom-demo-content-wrap .wbcom-demo-importer .container {
        display: block;
    }

    .wbcom-demo-title {
        width: auto;
        padding: var(--spacing-normal);
        display: block;
    }

    .wbcom-demo-content-wrap {
        padding: 16px var(--spacing-normal);
    }

    .wbcom_single_box {
        margin: var(--spacing-normal) 0;
    }

    /* Layout Adjustments */
    .wbcom-addon-plugins-inner-wrapper,
    ul#wbcom_support_list {
        display: block;
    }

    .wbcom-addons-plugins-card,
    .wbcom_help_support_box,
    #wbcom-free-extension .wbcom-addons-plugins-card {
        width: auto;
        display: block;
        max-width: 100%;
        padding: 4%;
    }

    ul.wbcom-addons-plugins-links li {
        margin: 0 0 0 var(--spacing-small);
    }

    /* UI Mobile View Updates */
    .wbcom-bb-plugins-offer-wrapper {
        margin: var(--spacing-normal) 5px;
    }

    .wbcom-wrap {
        margin: var(--spacing-small) 5px;
    }

    .wbcom_admin_header-wrapper {
        display: block;
        padding: var(--spacing-normal);
    }

    div#wb_admin_plugin_name {
        font-size: var(--font-size-medium);
        -ms-flex-wrap: wrap;
        flex-wrap: wrap;
        -webkit-box-pack: justify;
        -ms-flex-pack: justify;
        justify-content: space-between;
    }

    div#wb_admin_plugin_name span {
        margin: var(--spacing-small) 0;
        padding: 1px var(--spacing-normal);
    }
}

@media screen and (min-width: 1190px) and (max-width: 1335px) {

    div#wb_admin_plugin_name,
    .wbcom-admin-title-section h3,
    h4.wbcom-support-section {
        font-size: var(--font-size-medium);
    }

    #wb_admin_header #wb_admin_nav ul li.wb_admin_nav_item a {
        font-size: var(--font-size-normal);
        padding-left: var(--spacing-normal);
    }

    .wbcom-bb-plugins-offer-wrapper {
        margin: var(--spacing-medium) 5px -10px;
    }

    .wbcom-wrap {
        margin: var(--spacing-medium) 5px;
    }

    .wbcom-welcome-description,
    .wbcom-welcome-support-info p {
        font-size: var(--font-size-medium);
    }

    .wbcom-welcome-support-info .wbcom-support-inner p {
        height: auto;
    }
}

@media screen and (min-width: 591px) and (max-width: 1189px) {

    .wbcom-addon-plugins-inner-wrapper,
    ul#wbcom_support_list,
    .wbcom-bp-addons-plugins-title-section {
        display: -webkit-box;
        display: -ms-flexbox;
        display: flex;
    }

    .wbcom-addons-plugins-card,
    .wbcom_help_support_box,
    #wbcom-free-extension .wbcom-addons-plugins-card {
        max-width: 44%;
        padding: var(--spacing-normal);
    }
}

@media screen and (max-width: 767px) {

    #wb_admin_header #wb_admin_logo,
    #wb_admin_header #wb_admin_logo .wb_admin_right,
    #wb_admin_header #wb_admin_nav {
        float: none;
    }

    #wb_admin_header #wb_admin_nav ul li.wb_admin_nav_item a {
        min-width: inherit;
        padding: 5px;
    }

    .wbcom-tab-content .bpolls-support-setting {
        float: none;
        width: 100%;
    }

    .wbcom-settings-section-options ul.wbcom-settings-member-retraction.wbcom-settings-section-options-flex li {
        width: 100%;
    }

    .wbcom-settings-section-options-flex select#my_dashboard_page {
        max-width: 100%;
        margin: 0 0 var(--spacing-normal);
    }
}

/* License Table Responsive Styles */
@media (max-width: 782px) {
    .wb-license-form-table>tbody>tr:nth-of-type(odd) {
        background-color: transparent;
    }

    /* Force table to not be like tables anymore */
    .wb-license-form-table table,
    .wb-license-form-table thead,
    .wb-license-form-table tbody,
    .wb-license-form-table th,
    .wb-license-form-table td,
    .wb-license-form-table tr {
        display: block;
    }

    /* Hide table headers (but not display: none;, for accessibility) */
    .wb-license-form-table thead tr {
        position: absolute;
    }

    .wb-license-form-table td {
        /* Behave like a "row" */
        border: none;
        position: relative;
        padding-left: 35% !important;
        white-space: normal;
        text-align: left;
    }

    .wb-license-form-table td:before {
        position: absolute;
        top: 8px;
        left: 10px;
        width: 28%;
        padding-right: var(--spacing-small);
        white-space: nowrap;
        text-align: left;
        font-weight: bold;
        content: attr(data-title);
    }

    td.wb-license-action {
        text-align: left !important;
    }

    .wbcom-license-support-wrapp form[method="post"] {
        border-bottom: 1px solid #ddd;
        background: #fff;
    }

    .wb-license-form-table tfoot {
        display: none;
    }

    .wb-license-form-table td.wb-plugin-name,
    .wb-license-form-table th.wb-product-th,
    .wb-license-form-table td.wb-plugin-version,
    .wb-license-form-table th.wb-version-th,
    .wb-license-form-table td.wb-plugin-license-key,
    .wb-license-form-table th.wb-key-th,
    .wb-license-form-table td.wb-license-status,
    .wb-license-form-table th.wb-status-th,
    .wb-license-form-table td.wb-license-action,
    .wb-license-form-table th.wb-action-th {
        width: auto;
        padding: var(--spacing-normal) var(--spacing-medium);
    }

    .wb-license-form-table thead th {
        padding: var(--spacing-normal) var(--spacing-medium);
    }

    .wb-license-form-table thead .wb-key-th {
        padding-bottom: 40px;
    }

    .wb-license-form-table .wb-license-action .button-secondary {
        max-width: 160px;
    }

    .wb-plugins-license-tables-wrap .mobile-license-headings {
        display: block;
    }

    .desktop-license-headings {
        display: none;
    }
}