:root { --wffn-primary: #0073aa; --wffn-primary-alter: #135e96; --wffn-tertiary:#EBF2F6; --wffn-text:#353030; --wffn-desc:#82838E; --wffn-border:1px solid rgb(222, 223, 234); --wffn-border-color:rgb(222, 223, 234); --wffn-border-radius:6px; --wffn-light-bg:#e5e5e5; --wffn-error:#D72D1D; --wffn-boxer: #EBF2F6; --brand-color: #09B29C; --brand-color-light: #DCF2ED; } #wpwrap { background-color: #fff; } /** * Global header style */ .bwfan_header { background: #fff; box-sizing: border-box; border-bottom: 1px solid #fff; padding: 0; width: 100%; z-index: 9980; /* box-shadow: 0 0 10px 0 #c8c8c8; */ } .bwfan_ml_12 { margin-left: 12px; } .bwfan_header * { box-sizing: border-box !important; } .bwfan_header > div { width: 100%; padding: 0 24px; background: #fff; display: flex; align-items: center; height: 60px; } .bwfan_header > .bwfan_page_header { font-weight: 500; font-size: 24px; line-height: 32px; height: auto; margin: 24px 0 0; color: var(--wffn-text); } .bwfan_header > .bwfan_page_header div { line-height: 1.3; } .bwfan_header > .bwfan_page_header .bwfan_page_title { line-height: 40px; } .bwfan_header > .bwfan_page_header .bwfan_page_title + .wffn-ellipsis-menu { margin-top: -5px; } .bwfan_header > .bwfan_page_header .bwf-header-right-content { width: 100%; text-align: right; } .bwfan_header > .bwfan_header_l2 { height: 50px; margin: 16px 24px 0; width: calc(100% - 48px); padding: 0; background: transparent; align-items: center; border-bottom: 1px solid #DEDFEA; } .bwfan_header > .bwfan_header_l2.bwfan_header_l_back { height: auto; align-items: center; border: none; margin-bottom: 10px; display: block; } .bwfan_header > .bwfan_header_l2.bwfan_header_l_back::after { clear: both; content: ""; display: table; } .bwfan_header > .bwfan_header_l2.bwfan_header_l_back .bwfan_header_r { display: block; clear: both; padding-top: 20px; border-bottom: 1px solid #dedfea; } .bwfan_header a { text-decoration: none; box-shadow: none; outline: none; } .bwfan_header .bwfan_header_l1 { box-shadow: 0 1px 6px rgba(0, 0, 0, 0.1); position: relative; z-index: 9981; } .bwfan_header .bwfan_header_backlink { height: auto; margin: 24px 0 0; } .bwfan_header .bwfan_header_backlink .bwfan_backlink { display: inline-flex; gap: 24px; cursor: pointer; align-items: center; color: #353030; } .bwfan_header .bwfan_header_backlink .bwfan_backlink svg { margin: 0; } .bwfan_header .bwfan_header_backlink .bwfan_backlink:hover svg path, .bwfan_header .bwfan_header_backlink .bwfan_backlink:hover { fill: #0073aa; color: #0073aa; } /* .bwfan_header > .bwfan_page_header .bwfan_page_title:before { content: attr(data-prefix); } */ /* .bwfan_header .bwfan_header_backlink: */ .bwfan_header .bwfan_header_l1 div, .bwfan_header .bwfan_header_l2 div { display: flex; align-items: center; } .bwfan_header .bwfan_header_l2 .bwfan_head_mr { margin-left: 15px; } .bwfan_header .bwfan_header_l2 .bwfan_header_l > span { display: inline-flex; align-items: center; } .bwfan_header .bwfan_header_l { float: left; margin: auto 0; } .bwfan_header .bwfan_header_r { margin-left: auto; gap:16px; } .bwfan_header .bwfan_header_l1 .bwfan_navigation { height: 60px; line-height: 60px; } .bwfan_header .bwfan_header_l2 .bwfan_navigation { height: auto; } .bwfan_header .bwfan_header_l1 .bwfan_navigation.bwf-header-right-wrap { display: flex; align-items: center; gap: 24px; } .bwfan_header_l1 .bwfan_navigation:not(.bwf-header-right-wrap) > span { margin: 0 18px; } .bwfan_header_l1 .bwfan_navigation > span.bwf-hover-submenu-php { display: flex; flex-direction: row; gap: 5px; align-items: center; justify-content: center; position: relative; } .bwfan_header_l1 .bwfan_navigation > span.bwf-hover-submenu-php .bwf-hover-suheader-menu { display: none; z-index: 999999; position: absolute; top: 50px; left: 0; background-color: #fff; min-width: 180px; padding: 0; box-shadow: 1px 1px 11px 4px #dedfea; border-radius: 5px; -moz-border-radius: 5px; -webkit-border-radius: 5px; } .bwfan_header_l1 .bwfan_navigation > span.bwf-hover-submenu-php .bwf-hover-suheader-menu > a{ height: auto; min-height: 40px; line-height: 40px; display: block; border-bottom: 1px solid #DEDFEA; padding: 0 15px; } .bwfan_header_l1 .bwfan_navigation > span.bwf-hover-submenu-php .bwf-hover-suheader-menu > a:hover{ background: #EBF2F6 } .bwfan_header_l1 .bwfan_navigation > span.bwf-hover-submenu-php:hover .bwf-hover-suheader-menu{ display: block; } .bwfan_header_l1 .bwfan_navigation span.bwf-hover-submenu > span { font-size: 14px; } .bwfan_header_r .bwfan_navigation > span:last-child { margin-right: 0; } .bwfan_header .bwfan_navigation a { display: flex; align-items: center; position: relative; gap: 4px; padding: 0; color: #353030; text-transform: capitalize; font-size: 13px; font-weight: 500; white-space: nowrap; cursor: pointer; } /* .bwfan_header .bwfan_navigation a img, .bwfan_header .bwfan_navigation a svg { max-height: 16px; width: 30px; } */ .bwfan_header_l2 .bwfan_navigation a { font-size: 13px; margin: 0 16px; padding: 0; height: auto; border-radius: 0; background: #fff; text-transform: capitalize; position: relative; transition: 0.3s; color: #82838e; /* border-bottom: 3px solid #fff; */ } .bwfan_header_l2 .bwfan_navigation span:first-child a { margin: 0 16px 0 0; } .bwfan_header_l2 .bwfan_navigation a.bwf-pro-not-active { padding: 0 14px; } .bwfan_header_l2 .bwfan_navigation a.bwf-pro-not-active svg { width: 20px; } .bwfan_header .bwfan_header_l2 .bwfan_navigation a.bwfan_navigation_active:after, .bwfan_header .bwfan_header_l2 .bwfan_navigation a:hover:after { content: ""; width: 100%; position: absolute; height: 2px; background: var(--wffn-primary); bottom: -1px; } .bwfan_header .bwfan_navigation a:hover, .bwfan_header .bwfan_navigation a.bwfan_navigation_active, .bwfan_header .bwfan_navigation a.bwf-pro-not-active:hover span { color: #0073aa; /* border-bottom-color: #0073aa; */ } .bwfan_header .bwfan_navigation a:hover svg, .bwfan_header .bwfan_navigation a.bwfan_navigation_active:hover svg { fill: #0073aa; } /* .bwfan_header .bwfan_header_l2 .bwfan_navigation a:hover, .bwfan_header .bwfan_header_l2 .bwfan_navigation a.bwfan_navigation_active { color: #353030; } */ .bwfan_header_l2 .bwfan_header_l1 .bwfan_navigation a:hover:after, .bwfan_header_l2 .bwfan_header_l1 .bwfan_navigation a.bwfan_navigation_active:after { background-color: #f1f3f4; border: none; } .bwfan_header .bwf-breadcrumb-svg-icon { display: flex; position: relative; margin-right: 10px; } .bwfan_header .bwf-breadcrumb-svg-icon img { margin-right: 15px; height: 24px; } .bwfan_header .bwfan-tgl + .bwfan-tgl-btn-small { width: 2.1em; height: 1.2em; } .bwfan_header .bwfan_header_l2 .bwfan_header_l2_back > svg { margin: 0 6px; } .bwfan_header.bwfan-php .bwfan_header_l2 .bwfan_header_l2_back::after { content: "\f345"; font-family: 'dashicons'; color: #0073aa; padding-left: 8px; font-size: 14px; } .bwfan_header .bwfan_header_l2 .bwfan_header_l2_back a { display: block; position: relative; padding: 0; text-transform: capitalize; color: #0073aa; font-size: 13px; font-weight: 400; } .bwfan_header .bwfan_header_l2 #bwfan_automation_name { margin-right: 20px; color: #353030; } .bwfan_header .bwfan_header_l2 .bwfan_header_r:empty { display: none; } .bwfan_status .bwfan_btn_spin:after { border: 2px solid red; } .bwfan_header a.bwf-link-setting { display: flex; margin-right: 24px; } .bwf-header-ellipses-wrap .menu-item-title { font-weight: 500; color: #353030; } .bwf-header-ellipses-wrap .menu-item-desc { margin-top: 5px; } .bwf-header-ellipses-wrap .bwf-ellipsis-menu__toggle { padding: 0; min-width: auto; } .bwf-header-ellipses-wrap .bwf-ellipsis--alter-alter.show-menu .bwf-ellipsis-menu__toggle, .bwf-header-ellipses-wrap .bwf-ellipsis-menu__toggle.is-opened { color: #fff !important; background-color: #fff; } .bwf-header-ellipses-wrap .bwf-ellipsis-menu__toggle:focus, .bwf-header-ellipses-wrap .bwf-ellipsis-menu__toggle:active { color: #0073aa; box-shadow: none; border: 0; border-radius: 50%; } .bwf-header-ellipses-wrap .bwf-ellipsis-menu__toggle .dashicons, .bwf-header-ellipses-wrap .bwf-ellipsis-menu__toggle svg { margin: 0; color: var(--wffn-text); font-size: 25px; width: 25px; height: 25px; } .bwf-header-ellipses-wrap .bwf-ellipsis-menu__toggle.is-opened svg path { fill: #fff; } .bwf-header-ellipses-wrap .bwf-ellipsis-menu__content { /* padding: 15px 15px; min-width: 390px; */ } .bwf-header-ellipses-wrap .bwf-ellipsis-menu__content .bwf-ellipsis-menu__item { padding: 12px 16px; text-transform: none; } .bwf-header-ellipses-wrap .bwf-ellipsis-menu__content .bwf-ellipsis-menu__item:last-child { border-top: 1px solid #f1f1f1; } .bwf-header-ellipses-wrap .bwf-ellipsis-menu__content .bwf-ellipsis-menu__item .dashicons { color: #a5a3a3; } .bwf-header-ellipses-wrap .bwf-ellipsis-menu__content .bwf-ellipsis-menu__item:hover { background-color: #EBF2F6; } .bwf-header-ellipses-wrap .bwf-ellipsis-menu__content .bwf-ellipsis-menu__item:hover .dashicons { color: #0073aa; } .bwf-header-ellipses-wrap .bwf-ellipsis-menu__content .bwf-ellipsis-menu__item svg { width: auto; max-height: inherit; } .bwfan_header_l1 .bwf-header-ellipses-wrap .components-popover { display: block; line-height: 1.3; } .bwfan_header_l1 .bwf-header-ellipses-wrap .components-popover .components-popover__content { display: block; } .bwfan_header_l1 .bwf-header-ellipses-wrap .components-popover .components-popover__content .bwf-ellipsis-menu__content { display: block; line-height: 1.3; } .bwf-header-ellipses-wrap .bwf-ellipsis--alter-alter:not(.show-menu) .components-popover { display: none; } .bwf-header-ellipses-wrap .bwf-ellipsis--alter-alter .bwf-ellipsis-menu__toggle { padding: 0; width: 24px; height: 36px; border: none; transform: unset; cursor: pointer; border-radius: 50%; background: #fff; } .bwfan_header .bwf-ellipsis-menu .bwf-ellipsis-menu__toggle { display: flex; align-items: center; justify-content: center; width: 36px; min-width: 36px; height: 36px; } .bwfan_header .bwf-ellipsis-menu .bwf-ellipsis-menu__toggle.is-opened { background-color: var(--wffn-primary); border-radius: 8px; } .bwf-header-ellipses-wrap .bwf-ellipsis--alter-alter.show-menu .bwf-ellipsis-menu__toggle { background: #0073aa; border-radius: 8px; } .bwf-header-ellipses-wrap .bwf-ellipsis--alter-alter.show-menu .bwf-ellipsis-menu__toggle path { fill: #fff; } .bwf-header-ellipses-wrap .bwf-ellipsis--alter-alter.show-menu .components-popover { position: absolute; right: 38px; top: 60px; width: 300px; z-index: 9999; } .bwf-ellipsis-menu__popover .components-popover__content { padding: 0; border: none; /* margin-right: -15px !important; */ /* margin-top: -10px !important; */ box-shadow: 0 3px 12px 1px rgba(58, 34, 114, 0.15); background-color: #fff; } .bwf-ellipsis-menu__popover.is-from-top .components-popover__content { margin-top: -10px !important; } .components-popover[data-x-axis=right] .components-popover__content { left: -15px !important; } .components-popover .components-popover__content { height: auto; overflow-y: auto; min-width: 220px; } .bwfan_header .components-popover .components-popover__content { min-width: 300px; } .bwfan_header .components-popover.bwf-tooltip .components-popover__content { min-width: max-content; } .bwf-header-ellipses-wrap * { box-sizing: border-box; outline: none; box-shadow: none; } .bwf-ellipsis-menu__popover .bwf-ellipsis-menu__content { width: 100%; } .bwf-ellipsis-menu__popover .bwf-ellipsis-menu__content * { font-size: 13px; } .bwf-ellipsis-menu__popover .bwf-ellipsis-menu__item { cursor: pointer; color: #757575 } .bwf-ellipsis-menu__popover .bwf-ellipsis-menu__item:hover { background: #f5f6fa; } .bwf-header-ellipses-wrap .bwf-ellipsis-menu__content .bwf-ellipsis-menu__item:hover svg { fill: #0073aa; } .bwf-header-ellipses-wrap .bwf-ellipsis-menu__content .bwf-ellipsis-menu__item .components-flex__item { margin-right: 28px; } body .bwf_display_block { display: block !important; } .bwf-header-ellipses-wrap .menu-item-desc { margin-top: 5px; } .bwf-header-ellipses-wrap .bwf-ellipsis-menu__content a { text-decoration: none; color: #757575 !important; } .bwf-header-ellipses-wrap .bwf-ellipsis-menu__content a:after { content: unset !important; } /** //above style same as autonami */ /** =========================================================Funnel Need Extra Style======================================= */ .bwfan_header > .bwfan_header_l2 { min-height: 36px; height: auto; } .bwfan_header .bwfan_header_l { flex-wrap: wrap; } .bwfan_header .bwfan_header_l2 .bwfan_header_l .bwfan_header_l2_wrap { height: 30px; } .bwfan_header .bwfan_header_l2 .bwfan_header_l .bwfan_header_l2_wrap .bwf-flex, .bwfan_header .bwfan_header_l2 .bwfan_header_l .bwfan_header_l2_wrap .bwf_breadcrumb { margin: 0 0 15px 0; } .bwfan_header .bwfan_header_l2 .bwfan_navigation { flex-basis: 100%; } .bwfan_header .bwfan_navigation span a span.bwf-l2-nav-count-span { margin: 0 0 0 8px; padding: 0 8px; height: 20px; border-radius: 10px; background-color: #EBF2F6; color: #0073aa; font-size: 11px; line-height: 20px; text-align: center; font-weight: 500; } .bwfan_header .bwfan_navigation span a.bwfan_navigation_active span.bwf-l2-nav-count-span { background-color: #0073aa; color: #fff; } .bwfan_header .bwfan_header_l2.bwfan_header_l2_single { height: auto; align-items: center; border: none; margin-bottom: 10px; display: block; min-height: auto; } .bwfan_header .bwfan_header_l2.bwfan_header_l2_single:after { clear: both; content: ""; display: table; } .bwfan_header .bwfan_header_l2.bwfan_header_l2_single .bwfan_header_l2_wrap { height:auto; } .bwfan_header .notice { width: auto; height: auto; margin: 20px 24px 0 !important; } .bwfan_header > .bwfan_header_l2.bwfan_header_alter { display: flex; justify-content: space-between; } /** ===================================//Funnel Need Extra Style============================================ */ .bwf_breadcrumb > span, .wfacp_fixed_header .wfacp_head_ml > span { display: inline-block; position: relative; padding-right: 30px; margin: 0; font-size: 13px; line-height: 1; font-weight: 400; color:var( --wffn-primary ); } .bwf_breadcrumb > span a, .wfacp_fixed_header .wfacp_head_ml > span a { text-decoration: none; color:var( --wffn-primary ); } .bwf_breadcrumb > span:not(:last-of-type)::after, .wfacp_fixed_header .wfacp_head_ml > span:not(:last-of-type)::after { content: "\f345"; font-family: dashicons; position: absolute; right: 7px; top: 1px; font-size: 14px; line-height: 1; font-weight: 600; color: var( --wffn-text ) } .bwfan_header .bwf_breadcrumb .dashicons { color:var(--wffn-primary); } .bwf_breadcrumb > span:last-of-type, .wfacp_fixed_header .wfacp_head_ml > span:last-of-type{ padding-right: 8px; color: var(--wffn-text); } .bwf_breadcrumb .wf_funnel_card_switch, .bwf_breadcrumb .bwf_before_bre { order: 3; margin-left: auto; } .bwf_breadcrumb .bwf_after_bre { order: 2; } .wrap > .woofunnels_dashboard_tab_content { margin: 0px 0px 0px 20px; } /** //Global header style */ /** Zero State Card Style*/ .wffn_empty_card_wrap { position: relative; background-color: #fff; width: 100%; padding: 3em; box-sizing: border-box; border: var(--wffn-border); border-radius: var(--wffn-border-radius); } .wffn_empty_card_wrap .wffn_empty_card_container { box-sizing: border-box; display: flex; width: 100%; align-items: center; justify-content: space-between; } .wffn_empty_card_wrap .wffn_empty_card_container .wffn_card_item { box-sizing: border-box; max-width: 100%; } .wffn_empty_card_wrap .wffn_empty_card_container .wffn_card_item:not(:last-child) { margin-right: 10px; } .wffn_empty_card_wrap .wffn_empty_card_container .wffn_card_item.item_block { box-sizing: border-box; max-width: 100%; flex: 1; } .wffn_empty_card_wrap .wffn_empty_card_container .wffn_card_item .card_title { font-size: 2em; margin: 0 0 0.6em; line-height: 1.3; font-weight: 500; } .wffn_empty_card_wrap .wffn_empty_card_container .wffn_card_item .card_description { color: var(--wffn-desc); font-size: 17px; margin:20px 0 30px; } .wffn_empty_card_wrap .wffn_empty_card_container .wffn_card_item .card_description p { font-size: 17px; } .wffn_empty_card_wrap .wffn_empty_card_container .wffn_card_item .card_action { margin-top: 20px; } svg#wffn_sending_character .cls-1{fill:#f4f6f9;} svg#wffn_sending_character .cls-2{fill:none;stroke:#333;} svg#wffn_sending_character .cls-2, svg#wffn_sending_character .cls-4{stroke-linecap:round;stroke-linejoin:round;stroke-width:7px;} svg#wffn_sending_character .cls-3{fill:#333;} svg#wffn_sending_character .cls-4{fill:#9ed5f0;stroke:#9ed5f0;} .wffn_heading_wrap { display:flex; justify-content: space-between; } .wffn_heading_wrap .wffn_main_heading{ font-size: 23px; line-height: 1.3; font-weight: 400; margin: 0; padding: 0; margin-right: 5px; color: #444; } /** Zero State Card Style*/ .wf_funnel_card_switch{display:inline-flex;align-items:center;margin-right:10px;position:relative;height:26px;font-size:17px} .bwfan_header .wf_funnel_card_switch{margin:0px} .wf_funnel_switch{position:relative;display:block;width:28px;height:15px;margin:0;top:0} .wf_funnel_slider{position:absolute;cursor:pointer;top:0;left:0;right:0;bottom:0;border-radius:34px;-webkit-transition:.4s;transition:.4s;background-color:#fc7626} input:checked + .wf_funnel_slider:before{-webkit-transform:translateX(13px);-ms-transform:translateX(13px);transform:translateX(13px)} input:checked + .wf_funnel_slider:before{-webkit-transform:translateX(12px);-ms-transform:translateX(12px);transform:translateX(12px)} .wf_funnel_slider:before{border-radius:50%;position:absolute;content:"";height:11px;width:11px;top:2px;left:2px;background-color:#fff;-webkit-transition:.4s;transition:.4s;box-shadow:0 0 0 1px rgba(0,0,0,0.1),0 4px 0 rgba(0,0,0,0.08)} .wf_funnel_switch input{opacity:0;width:0;height:0} input:checked + .wf_funnel_slider{background-color:#6dbe45} .woofunnels_licenses_wrapper .woofunnels_plugins_wrap .wp-filter { display:none } .woofunnels_licenses_wrapper .woofunnels_plugins_wrap div#col-container.about-wrap { margin-top: 0px; } .woofunnels_licenses_wrapper .woofunnels_dashboard_tab_content#licenses .woofunnels_plugins_wrap .about-wrap { margin-top: -30px; } /** Template Preview Modal Content */ .wffn_template_preview_overlay .wffn_template_preview_modal { width: 100%; height: 100%; max-width: 100%; max-height: 100%; box-sizing: border-box; animation: unset; top: 0; border-radius: 0; } .wffn_template_preview_overlay .wffn_template_preview_modal * { box-sizing: border-box; } .wffn_template_preview_overlay .wffn_template_preview_modal .components-modal__content { padding: 0px; } .wffn_template_preview_overlay .wffn_template_preview_modal .components-modal__header { display: none; } .wffn_template_preview_wrap .wffn_template_preview_header { background-color: #fff; height: 65px; display: flex; align-items: center; padding: 0 25px; box-shadow: 0px 1px 6px rgb(0 0 0 / 10%); position: relative; z-index: 10; } .wffn_template_preview_wrap .wffn_template_preview_content:before, .wffn_template_preview_wrap .wffn_template_preview_content:after { /* content: ""; display: table; clear: both; */ } .wffn_template_preview_wrap .wffn_template_preview_content { position: relative; display: grid; grid-template-columns: auto 1fr; grid-template-areas: 'sidebar preview'; z-index: 9; } .wffn_template_preview_wrap .wffn_template_preview_header .wffn_template_nav { display: flex; align-items: center; } .wffn_template_preview_wrap .wffn_template_preview_header .wffn_template_nav .wffn_template_nav_btn { background-color: #fff; box-shadow: 0 5px 13px 0 rgba(90, 98, 102, 0.06); border-radius: 50%; padding: 10px; color: #5a6266; } .wffn_template_preview_wrap .wffn_template_preview_header .wffn_template_nav .wffn_template_nav_text { color: var(--wffn-primary); margin: 0 15px; } .wffn_template_preview_wrap .wffn_template_preview_header .wffn_template_viewport { flex: 1; text-align: center; } .wffn_template_preview_wrap .wffn_template_preview_header .wffn_template_viewport .wffn_viewport_icons { margin: 0 5px; padding: 8px 8px 10px; cursor: pointer; border: 2px solid transparent; border-radius: 8px; } .wffn_template_preview_wrap .wffn_template_preview_header .wffn_template_viewport .wffn_viewport_icons:hover { border-color: var(--wffn-primary); } .wffn_template_preview_wrap .wffn_template_preview_header .wffn_template_viewport .wffn_viewport_icons.active { border: 2px solid var(--wffn-primary); color: var(--wffn-primary); } .wffn_template_preview_wrap .wffn_template_preview_header .wffn_template_preview_close { background-color: #fff; margin-left: 30px; padding: 3px 0px; } .wffn_template_preview_wrap .wffn_template_preview_header .wffn-import-template-btn { font-size: 16px; line-height: 20px; text-align: center; display: inline-block; padding: 12px 24px; height: 44px; font-weight: 500; border-radius: 8px; background: var(--brand-color); border-color: var(--brand-color); box-shadow: unset; min-width: 201px; transform: translateY(-1px); } .wffn_template_preview_wrap .wffn_template_preview_header .wffn-import-template-btn:focus, .wffn_template_preview_wrap .wffn_template_preview_header .wffn-import-template-btn:active, .wffn_template_preview_wrap .wffn_template_preview_header .wffn-import-template-btn:disabled { background-color: var(--brand-color) !important; } .wffn_template_preview_wrap .wffn_template_preview_header .wffn-import-template-btn:hover{ background: var(--brand-color); } .wffn_template_preview_wrap .wffn_template_preview_content ::-webkit-scrollbar-track { background: #d8d8d8; } .wffn_template_preview_wrap .wffn_template_preview_content ::-webkit-scrollbar-thumb { background: #666; } .wffn_template_preview_wrap .wffn_template_preview_content ::-webkit-scrollbar { width: 6px; height: 5px; } .wffn_template_preview_wrap .wffn_template_preview_content ::-webkit-scrollbar-thumb:hover { background: #555; } .wffn_template_preview_wrap .wffn_template_preview_content .wffn_template_preview_inner { width: 100%; grid-area: preview; } .wffn_template_preview_wrap .wffn_template_preview_content .wffn_template_preview_inner.wffn_funnel_preview { background-color: #fff; display: flex; flex-direction: column; height: calc(100vh - 66px); } .wffn_template_preview_wrap .wffn_template_preview_content .wffn_template_preview_inner .wffn_template_preview_frame iframe { display: block; /* min-height: calc(100vh - 66px); */ margin: auto; z-index: 101; position: relative; background-color: #fff; } .wffn_template_preview_wrap .wffn_template_preview_content .wffn_template_preview_inner .wffn_template_preview_frame.tablet iframe { max-width: 768px; } .wffn_template_preview_wrap .wffn_template_preview_content .wffn_template_preview_inner .wffn_template_preview_frame.mobile iframe { max-width: 480px; } .wffn_template_preview_wrap .wffn_template_preview_content .wffn_template_preview_inner .wffn-web-preview.is-loading, .wffn_template_preview_wrap .wffn_template_preview_content .wffn_template_preview_inner .woocommerce-web-preview.is-loading { /* min-height: calc(100vh - 66px); */ background: #fff; } .wffn_template_preview_wrap .wffn_template_preview_content .wffn_template_preview_inner .wffn_template_filer { flex-basis: 36px; position: relative; z-index: 12; box-shadow: 0px 1px 6px rgb(0 0 0 / 10%); } .wffn_template_preview_wrap .wffn_template_preview_content .wffn_template_preview_sidebar { grid-area: sidebar; background-color: #fff; height: calc(100vh - 66px); padding: 24px 16px 0; box-shadow: 0 13px 20px 0 rgb(0 0 0 / 5%); overflow-y: auto; border-right: 1px solid #cfcfcf; scroll-behavior: smooth; } .wffn_template_preview_wrap .wffn_template_preview_content .wffn_template_preview_sidebar .wffn_template_page_options { display: flex; align-items: center; text-align: center; flex-direction: column; color: #3c434a; scroll-margin: 20px; cursor: pointer; } .wffn_template_preview_wrap .wffn_template_preview_content .wffn_template_preview_sidebar .wffn_template_page_options .wffn_preview_thumbnail, .wffn_template_preview_wrap .wffn_template_preview_content .wffn_template_preview_sidebar .wffn_template_page_options .wffn_preview_thumbnail .bwf-image-loader { height: 200px; width: 188px; box-shadow: 0 0 0 1px #e4e4e4; border-radius: 8px; overflow: hidden; } .wffn_template_preview_wrap .wffn_template_preview_content .wffn_template_preview_sidebar .wffn_template_page_options img { width: 100%; } .wffn_template_preview_wrap .wffn_template_preview_content .wffn_template_preview_sidebar .wffn_template_page_options input { margin-right: 10px; } .wffn_template_preview_wrap .wffn_template_preview_content .wffn_template_preview_sidebar .wffn_template_page_options .wffn_template_name { font-weight: 500; font-size: 13px; line-height: 16px; margin: 12px 0 24px 0; min-width: 150px; color: #000000; display: inline-flex; justify-content: center; gap: 8px; } .wffn_template_preview_wrap .wffn_template_preview_content .wffn_template_preview_sidebar .wffn_template_page_options.active_preview .wffn_template_name { color: #007cba; } .wffn_template_preview_wrap .wffn_template_preview_content .wffn_template_preview_sidebar .wffn_template_page_options:hover .wffn_preview_thumbnail, .wffn_template_preview_wrap .wffn_template_preview_content .wffn_template_preview_sidebar .wffn_template_page_options.active_preview .wffn_preview_thumbnail{ box-shadow: 0 0 0 2px #007cba; } .wffn_template_preview_wrap .wffn_template_preview_content .wffn_template_preview_sidebar .wffn_page_counts { background-color: rgba(47, 161, 218, 0.91); padding: 6px 10px; border-radius: 50%; margin-left: 10px; line-height: 1; font-size: 12px; } .wffn_template_preview_wrap .wffn_template_preview_content .wffn_template_preview_inner .wffn_global_loader { background-color: #fff; border-right: 1px solid #cfcfcf; } /** //Template Preview Modal Content */ .dashicons.dashicons-lock { color:var(--wffn-primary); cursor: pointer; } #wffn-contacts .wffn-funnel-common { background-color: #fff; } /** Zero State Style */ .bwf-zero-state { max-width: 600px; margin: 72px auto 0; text-align: center; } .bwf-zero-state .bwf-zero-sec { justify-content: center; } .bwf-zero-state .bwf-zero-sec > .components-flex { border: 1px solid #DEDFEA; border-radius: 8px; -moz-border-radius: 8px; -webkit-border-radius: 8px; padding: 16px; position: relative; cursor: pointer; min-height: 85px; max-width: 300px; } .bwf-zero-state .bwf-zero-sec > .components-flex .bwf-zero-sec-action-head { font-size: 15px; font-size: 0.9375rem; line-height: 1.2; color: #353030; margin-bottom: 5px; } .bwf-zero-state .bwf-zero-sec > .components-flex .bwf-zero-sec-action-subhead { font-size: 12px; font-size: 0.75rem; line-height: 1.2; color: #82838e; } .bwf-zero-state .bwf-zero-sec > .components-flex .bwf-zero-sec-lock { position: absolute; right: 8px; top: 8px; } .bwf-zero-state .bwf-zero-sec > .components-flex:hover { border-color: #0073aa; box-shadow: 0 1px 16px rgba(0, 0, 0, 0.15); } body .bwf-pb-gap { padding-bottom: 24px; } body .bwf-h2 { font-size: 1.375rem; font-weight: 500; line-height: 1.5; } body .bwf-pb-gap { padding-bottom: 24px; } body .bwf-h4-1 { font-size: 15px; font-size: 0.9375rem; line-height: 1.5; font-weight: 400; color: #353030; } body .bwf-pb-10 { padding-bottom: 10px; } /** //Zero State Style */ .wffn_pro_template { justify-content: center; display: grid; } .bwf-ab-tag { border-style: solid; border-width: 0px 0px 36px 36px; height: 0px; position: absolute; top: -2px; left: -2px; width: 0px; -ms-transform: rotate(360deg); -o-transform: rotate(360deg); -webkit-transform: rotate( 360deg); transform: rotate(360deg); border-color: transparent transparent transparent #5cb85c; } .bwf-ab--text { color: #fff; font-size: 10px; position: relative; left: -33px; letter-spacing: 0.5px; top: 7px; white-space: nowrap; -ms-transform: rotate(30deg); -o-transform: rotate(360deg); -webkit-transform: rotate( 30deg); transform: rotate( 320deg); } .bwfan-tag-rounded { display: inline-flex; align-items: center; gap: 6px; padding: 2px 12px; line-height: 16px; border-radius: 24px; font-size: 12px; color: #fff; border: 1px solid transparent; user-select: none; font-weight: 400; } .bwfan-tag-rounded.clr-primary { background:var(--wffn-primary); } .bwfan-tag-rounded.clr-sky-blue { background:#00AFD6; } .bwfan-tag-rounded.clr-green { background:#58A942; } .bwfan-tag-rounded.clr-orange { background:#ECA717; } /** ellipsis-menu */ .wffn-ellipsis-menu { position: relative; } .wffn-ellipsis-menu .wffn-ellipsis-menu__toggle { display: flex; align-items: center; min-width: 24px; height: 28px; cursor: pointer; } .wffn-ellipsis-menu.is-opened .wffn-ellipsis-menu__toggle { background: var(--wffn-primary); border-radius: 40px; } .wffn-ellipsis-menu.is-opened .wffn-ellipsis-menu__toggle path { fill: #fff; } .wffn-ellipsis-menu .wffn-menu__toggle path, .wffn-ellipsis-menu .wffn-menu__toggle svg { fill: #fff; } .wffn-ellipsis-menu .wffn-ellipsis-menu-dropdown { display: none; } .wffn-ellipsis-menu.is-opened .wffn-ellipsis-menu-dropdown { display: block; position: absolute; min-width: 180px; right: 0; top: calc(100% + 10px); box-shadow: 0 1px 16px rgba(0, 0, 0, 0.15); background: #fff; z-index: 10000; } .bwfan_header .wffn-ellipsis-menu.is-opened .wffn-ellipsis-menu-dropdown { left: 0; } .wffn-ellipsis-menu.is-opened .wffn-ellipsis-menu-dropdown .wffn-ellipsis-menu-item { text-decoration: none; height: auto; display: flex; gap: 8px; padding: 12px 16px; color: var(--wffn-text); font-size: 13px; line-height: 16px; font-weight: 500; width: 100%; } .wffn-ellipsis-menu.is-opened .wffn-ellipsis-menu-dropdown .wffn-ellipsis-menu-item svg { margin: -1px 0 0; fill: var(--wffn-text); } .wffn-ellipsis-menu.is-opened .wffn-ellipsis-menu-dropdown .wffn-ellipsis-menu-item:hover { background: #EBF2F6; color: var(--wffn-primary); } .wffn-ellipsis-menu.is-opened .wffn-ellipsis-menu-dropdown .wffn-ellipsis-menu-item:hover svg { fill: var(--wffn-primary); } .wffn-ellipsis-menu .bwfan-tag-rounded { cursor: pointer; } .wffn-ellipsis-menu.is-opened .bwfan-tag-rounded svg { transform: rotate(180deg); } .wffn-ellipsis-menu .wf_funnel_card_switch { height: auto; width: 100%; } .wffn-modal-action { display: flex; align-items: center; gap: 16px; justify-content: flex-end; } .wffn-swal-modal-title { font-size: 24px; line-height: 32px; color: #353030; font-weight: 500; text-align: left; } .swal2-container .swal2-popup .swal2-close { top: 18px; right: 10px; color: var(--wffn-text); } .swal2-container .swal2-popup .swal2-close:hover { color: #000; } .bwf-header-settings-nav { margin-right: 15px; } .bwf-header-settings-nav svg{ max-height: 25px; max-width: 25px; display: block; } .bwf-brand-logo-only { width: 34px !important; height: 24px; object-fit: cover; object-position: left; } .bwf_template_logo_title { display: flex; align-items: center; gap: 12px; min-width: 360px; } .bwf_template_logo_title .bwf_preview_template_title { border-left: 1px solid #DEDFEA; font-weight: 500; font-size: 20px; line-height: 20px; color: #000; padding-left: 12px; } .bwf_template_logo_title .bwf_preview_template_title .wffn-pro { position: static; float: right; margin-left: 10px; } .wffn-web-preview__iframe-wrapper { height: 100%; } .wffn_template_preview_wrap .wffn_template_preview_header .wffn_template_viewport .wffn_template_viewport_inner .wffn_viewport_icons svg path { fill: #353030; } .wffn_template_preview_wrap .wffn_template_preview_header .wffn_template_viewport .wffn_template_viewport_inner .wffn_viewport_icons { transition-duration: 0.05s; transition-timing-function: ease-in-out; cursor: pointer; display: table-cell; border: 1px solid #E0E0E0; margin: 0; height: auto; border-radius: 0; padding: 6px 0; height: 30px; width: 44px; } .wffn_template_preview_wrap .wffn_template_preview_header .wffn_template_viewport .wffn_template_viewport_inner .wffn_viewport_icons:first-child { border-radius: 8px 0 0 8px; border-right: none; } .wffn_template_preview_wrap .wffn_template_preview_header .wffn_template_viewport .wffn_template_viewport_inner .wffn_viewport_icons:last-child { border-radius: 0px 8px 8px 0px; border-left: none; } .wffn_template_preview_wrap .wffn_template_preview_header .wffn_template_viewport .wffn_template_viewport_inner .wffn_viewport_icons.active { background: var(--wffn-primary); color: #fff; border-color: var(--wffn-primary); } .wffn_template_preview_wrap .wffn_template_preview_header .wffn_template_viewport .wffn_template_viewport_inner .wffn_viewport_icons.active svg path { fill: #fff; } .wffn_template_preview_wrap .wffn_template_preview_header .wffn_template_viewport .wffn_template_viewport_inner { display: inline-flex; } body .wffn_tag, body div.wffn_tag, body span.wffn_tag { font-weight: 500; font-size: 10px; line-height: 12px; color: #fff; padding: 4px 8px; background-color: var(--brand-color); border-radius: 13px; } .bwfan_header .bwf_header_breadcrumb .bwf_breadcrumb_item { display: inline-flex; align-items: center; font-weight: 500; } .bwfan_header .bwf_header_breadcrumb .bwf_breadcrumb_item a { display: block; position: relative; padding: 0; text-transform: capitalize; color: #0073aa; font-size: 13px; font-weight: 500; line-height: 16px; } .bwfan_header .bwf_header_breadcrumb .bwf_breadcrumb_item svg { margin: 0 6px; } body .bwf-modal-zindex { z-index: 100000; } @media screen and (max-width: 1170px){ .bwfan_header .bwf-breadcrumb-svg-icon { margin-right: 0; } .bwfan_header .bwf-breadcrumb-svg-icon img { width: 34px; object-fit: cover; object-position: left; margin-right: 0; } } /** RTL Style */ body.rtl .wffn_template_preview_wrap .wffn_template_preview_header .wffn_template_preview_close { margin-left: 0px; margin-right: 30px; } body.rtl .wffn_template_preview_wrap .wffn_template_preview_header .wffn_template_viewport .wffn_template_viewport_inner .wffn_viewport_icons:first-child { border-radius: 0px 8px 8px 0px; border-left: none; border-right: 1px solid #E0E0E0; } body.rtl .wffn_template_preview_wrap .wffn_template_preview_header .wffn_template_viewport .wffn_template_viewport_inner .wffn_viewport_icons:last-child { border-radius: 8px 0 0 8px; border-right: none; border-left: 1px solid #E0E0E0; } body.rtl .bwfan_header .bwfan_header_r { margin-left: 0; margin-right: auto; } body.rtl .bwfan_header > .bwfan_page_header .bwf-header-right-content { text-align: left; } body.rtl .wffn-swal-modal-title { text-align: right; } body.rtl .bwfan_header .bwfan_header_backlink{ transform:rotate(180deg); } body.rtl .bwfan_header .bwf-breadcrumb-svg-icon{ margin:0 0 0 10px; } body.rtl .bwfan_header .bwf-breadcrumb-svg-icon img { margin:0 0 0 15px; } body.rtl .wffn-ellipsis-menu.is-opened .wffn-ellipsis-menu-dropdown { left: 0; right: unset; } body.rtl .bwfan_page_header .wffn-ellipsis-menu.is-opened .wffn-ellipsis-menu-dropdown { right: 0; } body.rtl .wfacp_funnel_btn_temp_alter.wfacp_funnel_btn_blue_temp { float: right; margin-left: 15px !important; } body.rtl .iziModal .iziModal-header.iziModal-noSubtitle .iziModal-header-title { text-align: right; } body.rtl .iziModal .iziModal-header.iziModal-noSubtitle .iziModal-header-buttons { right: unset; left: 24px; } body.rtl .bwfan-tag-rounded.bwfan_ml_12 { margin-left: 0; margin-right: 12px; } body.rtl .wffn_template_sec_ribbon.wffn-pro.wffn-static-ribbon { margin-left: 0; margin-right: 8px; } body.rtl .wfacp-product-widget-tabs .wfacp-tab-title.wfacp-active:after { content: "\f341"; float: left; right: unset; left: 0; } body.rtl .swal2-container .swal2-popup .swal2-close { right: unset; left: 25px; } body.rtl .bwfan_header .bwfan_header_l2 #bwfan_automation_name { margin-right: 0px; margin-left: 20px; } body.rtl .bwfan_header .bwf_header_breadcrumb .bwf_breadcrumb_item svg{ transform: rotate(180deg); } body.rtl .bwfan_header .bwfan_header_l{ float:right; } body.rtl .bwfan_header .bwf-breadcrumb-svg-icon { margin-right: 0; margin-left: 10px; } body.rtl .bwfan_header .bwf-breadcrumb-svg-icon img { margin-right: 0; margin-left: 15px; } /**End RTL Style */ #ehe-admin-cb { display: none !important; }