PluginProbe
wpForo Forum / 3.1.5
wpForo Forum v3.1.5
3.1.5 3.1.4 3.1.2 3.1.1 3.1.0 3.0.9 3.0.8 3.0.7 trunk 1.0.0 1.0.1 1.0.2 1.1.0 1.1.1 1.1.2 1.2.0 1.3.0 1.3.1 1.4.0 1.4.1 1.4.10 1.4.11 1.4.12 1.4.13 1.4.2 All 137 releases
wpforo / admin / assets / css / admin.css

admin.css in wpForo Forum 3.1.5, at admin/assets/css/admin.css

1,190 lines 62.9 KB
No matching file
Up and down to move Enter to open Esc to close
Raw Download Zip
1 #wpf-admin-wrap .menu_edit{color: #a7a7a7;cursor: pointer;}
2 #wpf-admin-wrap .menu_edit:hover{color: #004eb7;cursor: pointer;}
3 #wpf-admin-wrap .menu_delete{color: #a7a7a7;cursor: pointer;}
4 #wpf-admin-wrap .menu_delete:hover{color: #eb3034;cursor: pointer;}
5 #wpf-admin-wrap .forum_width{width: 65%;}
6 #wpf-admin-wrap .forumtitle{font-size:14px;font-weight:bold;width: 52%;}
7 #wpf-admin-wrap #forum-hierarchy .menu-item-bar .menu-item-handle{ max-width: none; }
8 #wpf-admin-wrap .item-controls{font-size:13px;}
9 #wpf-admin-wrap .item-controls span a img{ vertical-align:middle;}
10 #wpf-admin-wrap .root_forum{text-decoration: none!important;color:#231f1f; }
11 #wpf-admin-wrap .forum_submit {margin: 0 5px 10px 5px; min-width: 80px !important;}
12 #wpf-admin-wrap .wpf-delete.button, #wpf-admin-wrap .preview.button{display: inline-block !important;margin-bottom: 10px !important;}
13 #wpf-admin-wrap .item-controls{top: 10%!important;}
14 #forum_submit{width: 80px!important;}
15 #usergroup_table{width:98%;}
16 #use_us_cat{width: 1%!important;}
17 #wpf-admin-wrap .form-field textarea{width: 100% !important;}
18 #wpf-admin-wrap .option_box{ margin: 30px;padding: 30px; width: 30%;height: 20%;background: #e9e9eb;border: 1px dotted black;border-radius: 10px;float: left;overflow: auto;}
19 #wpf-admin-wrap .option_box label{margin: 0.5%;font-weight: bold;}
20 #wpf-admin-wrap .wpfadmin_notice{cursor: pointer;}
21 #wpf-admin-wrap .wp-color-result:after{white-space:nowrap;}
22 #wpf-admin-wrap .wpf-table-box-left{ width:30%; margin:0; padding:10px; border:#aaa 1px dashed; float:left; background:#FDFDFD; }
23 #wpf-admin-wrap .wpf-td-label{ font-weight:bold; font-size:13px; line-height:16px; cursor: pointer;}
24 #wpf-admin-wrap .wpf-td-label-left{ font-weight:bold; font-size:13px; line-height:16px; text-align:left; vertical-align:top; }
25 #wpf-admin-wrap .wpf-td-label-left-p{ font-weight:bold; font-size:13px; line-height:16px; text-align:left; vertical-align:top; padding:5px 1px; }
26 #wpf-admin-wrap .wpf-dw-td{ vertical-align:top; text-align:left; width:40%; font-weight:bold;line-height: 1.7em; }
27 #wpf-admin-wrap .wpf-dw-td-nowrap{width: 90%; vertical-align:top; text-align:left; font-weight:bold; white-space:nowrap; line-height: 1.5em; }
28 #wpf-admin-wrap .wpf-dw-td-value{ vertical-align:top; text-align:left;line-height: 1.5em; }
29 #wpf-admin-wrap .wpf-dw-td-g{ width:50%; text-align:right; vertical-align:top; padding-right:10px; font-weight:bold; }
30 #wpf-admin-wrap .wpf-dw-td-value-b{ vertical-align:bottom; text-align:left; }
31 #wpf-admin-wrap .wpf-dw-td-value-p{ vertical-align:top; text-align:left; padding:5px 1px; }
32 #wpf-admin-wrap label i.fa-question-circle{ padding: 0 3px;}
33 #wpf-admin-wrap input[type="color"]{display: inline-block; vertical-align: middle; width: 100px; padding: 4px; height: 27px;}
34 #wpf-admin-wrap #wpf_usergroup_colorx{display: inline-block; vertical-align: middle; width: 100px; border-color: green; min-height: 27px; line-height: 20px; padding: 0 7px;}
35
36 /****************************************************/
37 /************* Admin members bar ********************/
38 /****************************************************/
39
40 .author-rating {
41 height: 8px;
42 border: 1px solid #E0E0E0;
43 background: #F5F5F5;
44 width: 90px;
45 margin: 15px auto 2px 0;
46 padding: 0;
47 }
48 .author-rating .bar{ height:8px; }
49
50 .wpfw-0 { width:0; }
51 .wpfw-10{ width:10%; }
52 .wpfw-20{ width:20%; }
53 .wpfw-30{ width:30%; }
54 .wpfw-40{ width:40%; }
55 .wpfw-50{ width:50%; }
56 .wpfw-60{ width:60%; }
57 .wpfw-70{ width:70%; }
58 .wpfw-80{ width:80%; }
59 .wpfw-90{ width:90%; }
60 .wpfw-100{ width:100%; }
61
62 .wpfcl-a{ color:#68A3C1!important; } /* Blue Dark */
63 .wpfbg-a{ background-color:#68A3C1!important; }
64 .wpfcl-b{ color:#43A6DF!important; } /* Blue Dark */
65 .wpfbg-b{ background-color:#43A6DF!important; }
66 .wpfcl-0{ color:#999999!important; } /* Grey */
67 .wpfbg-0{ background-color:#999999!important; }
68 .wpfcl-1{ color:#555555!important; } /* Grey - Black */
69 .wpfbg-1{ background-color:#555555!important; }
70 .wpfcl-2{ color:#777777!important; } /* Grey */
71 .wpfbg-2{ background-color:#777777!important; }
72 .wpfcl-3{ color:#ffffff!important; } /* White */
73 .wpfbg-3{ background-color:#ffffff!important; }
74 .wpfcl-4{ color:#72CCFC!important;} /* Blue Light */
75 .wpfbg-4{ background-color:#72CCFC!important; }
76 .wpfcl-5{ color:#FF812D!important; } /* Orange */
77 .wpfbg-5{ background-color:#FF812D!important; }
78 .wpfcl-6{ color:#0099CC!important; } /* Blue */
79 .wpfbg-6{ background-color:#0099CC!important; }
80 .wpfcl-7{ color:#E6E6E6!important; } /* Grey */
81 .wpfbg-7{ background-color:#E6E6E6!important; }
82 .wpfcl-8{ color:#4DCA5C!important; } /* Green */
83 .wpfbg-8{ background-color:#4DCA5C!important; }
84 .wpfcl-9{ color:#f5f5f5!important; } /* Grey */
85 .wpfbg-9{ background-color:#f5f5f5!important; }
86
87
88
89 /**************************/
90 /* Global *****************/
91 /**************************/
92
93 #wpf-admin-wrap{ margin-top:0; }
94 #wpf-admin-wrap .wpf-delete{ color:#aa0000;}
95 #wpf-admin-wrap .wpf-delete:hover{ color:#ff0000;}
96 .wpforo-themes .wpf-delete{ color:#aa0000;}
97 .wpforo-themes .wpf-delete:hover{ color:#ff0000;}
98 /* Moderation list table - Delete User action styled in red like Delete */
99 .row-actions .delete_user a { color: #b32d2e; }
100 .row-actions .delete_user a:hover { color: #dc3232; }
101 #wpf-admin-wrap .show-settings { border:none; text-decoration:none; overflow:hidden; outline:none; }
102 #wpf-admin-wrap .wpforo-search-box{ display:block; margin:15px 0 5px 0; text-align:right; }
103 #wpf-admin-wrap .wpf-red{ color:#D74245; }
104 #wpf-admin-wrap .wpf-green{ color:#42B720; }
105
106 /**************************/
107 /* Forums *****************/
108 /**************************/
109 #wpf-admin-wrap #forum-hierarchy .dashicons{ vertical-align: middle; transition: none; font-size: 18px; }
110 #wpf-admin-wrap #forum-hierarchy .item-controls{ border-left: 1px dotted; padding-left: 22px; display: flex; justify-content: center; align-items: center;}
111 #wpf-admin-wrap #forum-hierarchy .item-controls a{ opacity: 0.8; }
112 #wpf-admin-wrap #forum-hierarchy .item-controls a:hover{ opacity: 1; }
113 #wpf-admin-wrap .menu-item-bar > .forum_width{ background: #F6F6F6; border-left: 1px dotted #666666; border-right: 1px dotted #666666}
114 #wpf-admin-wrap .menu-item-depth-0 > .menu-item-bar > .forum_width .item-controls{ border-color: #FFFFFF;}
115 #wpf-admin-wrap .menu-item-bar > .forum_width .item-controls{ border-color: #666666; font-size:16px;}
116 #wpf-admin-wrap .menu-item-depth-0 > .menu-item-bar > .forum_width{ background: #43A6DF; color: white}
117 #wpf-admin-wrap .menu-item-bar > .forum_width:hover{ border: 1px solid #666666}
118 #wpf-admin-wrap .menu-item-depth-0 > .menu-item-bar > .forum_width a{ color: white; font-size:16px; padding:0 2px; border-radius:10%;}
119 #wpf-admin-wrap .menu-item-bar > .forum_width .wpforo-cat-layout { font-size:12px;}
120 #wpf-admin-wrap .inside .main .wpforo-dashboard-logo{ width:140px; height:auto;}
121 #wpf-admin-wrap .vert_tab{ display: block; margin-top: 1px;}
122 #wpf-admin-wrap .nav-tab-wrapper.vert_tab{ display: inline-block; width: 17%; border: none; vertical-align: top; margin: 0 !important; padding: 0 !important; float: left; position:relative; z-index:9;}
123 #wpf-admin-wrap .nav-tab.vert_tab{ border-bottom: 1px solid #ccc}
124 #wpf-admin-wrap .nav-tab-wrapper.vert_tab > a:first-child{ margin-top: 0}
125 #wpf-admin-wrap .nav-tab-active.vert_tab{ border-bottom-color: #ccc !important; border-right-color:#fff;}
126 #wpf-admin-wrap .plugins-tab-wrap{ width: 83%; min-height: 700px; border: 1px solid #cccccc; display: inline-block; margin-left: -1px; padding: 5px 25px; box-sizing: border-box; float: left}
127 #wpf-admin-wrap .nav-tab-wrapper > a.nav-tab:last-child{ float: right}
128 #wpf-admin-wrap .nav-tab-wrapper > a.nav-tab.vert_tab{ float: none !important}
129 #wpf-admin-wrap .nav-tab-wrapper > a.nav-tab.vert_tab:last-child{ float: none !important}
130
131
132 /**************************/
133 /* SETTINGS ***************/
134 /**************************/
135
136 #wpf-admin-wrap .nav-tab{ padding: 7px 12px; }
137 #wpf-admin-wrap .nav-tab-active,
138 #wpf-admin-wrap .nav-tab-active:hover{ background-color:#FFFFFF; border-bottom-color:#FFFFFF; }
139 #wpf-admin-wrap .wpf-info-bar { background: none repeat scroll 0 0 #fff; border: 1px solid #e5e5e5; box-shadow: 0 2px 2px rgba(0, 0, 0, 0.05); font-size: 13px; line-height: 2.1em; margin:0; overflow: auto; padding: 10px 15px 15px 15px; position: relative; border-top:none; }
140 #wpf-admin-wrap .major-publishing-actions{ margin-top:20px; }
141 #wpf-admin-wrap .wpf-label-big{ font-size:16px; display:table; margin-bottom:13px; margin-top:10px; }
142 #wpf-admin-wrap .wpf-field-small{ width:25% }
143 #wpf-admin-wrap .wpf-field-medium{ width:50% }
144 #wpf-admin-wrap .wpf-field-full{ width:100% }
145 #wpf-admin-wrap .wpf-info, #wpf_deactivation_dialog_wrap .wpf-info{ color:#777; font-size:13px; font-style:italic; font-weight:400; line-height:18px; margin:0;}
146
147 .wpforo_settings_table{ width:100%; padding:0; margin:2px; border-spacing: 0; border-collapse: collapse;}
148 .wpforo_settings_table th, .wpforo_settings_table td { padding:8px 10px; text-align:left; vertical-align:top; }
149 .wpforo_settings_table th{ font-weight:bold; font-size:14px; width:42%; }
150 /*.wpforo_settings_table tr:nth-child(odd) { background: #f5f5f5; }
151 .wpforo_settings_table tr:nth-child(even) { background: #FFFFFF; }*/
152 .wpforo_settings_table input[type="text"],
153 .wpforo_settings_table input[type="password"],
154 .wpforo_settings_table input[type="email"],
155 .wpforo_settings_table input[type="url"],
156 .wpforo_settings_table textarea{ padding:5px 10px; width:70%; }
157 .wpforo_settings_table select{ min-width:150px;}
158 .wpforo_settings_table input[type="number"]{ padding:1px 2px 1px 10px; width:30%; }
159 .wpforo_settings_foot{ clear:both; width:100%; text-align:right; padding:15px 0 5px 0; margin:0 0 0 0; border-top:#f8f8f8 solid 3px; }
160 .wpforo_settings_foot input:first-child{ float: right }
161 .wpforo_settings_foot input:last-child{ float: left }
162 .wpforo_settings_foot::after{
163 content: "";
164 clear: both;
165 display: table;
166 }
167
168 .wpf-switch-field input { display: none;}
169 .wpf-switch-field label {float: left;}
170 .wpf-switch-field label {display: inline-block; line-height: 20px; min-width:80px; background-color: #e4e4e4;color:#333;font-size: 13px;font-weight: normal;text-align: center;text-shadow: none;padding: 2px 6px;border: 1px solid rgba(0, 0, 0, 0.2);-webkit-box-shadow: inset 0 1px 3px rgba(0, 0, 0, 0.3), 0 1px rgba(255, 255, 255, 0.1);box-shadow: inset 0 1px 3px rgba(0, 0, 0, 0.3), 0 1px rgba(255, 255, 255, 0.1);-webkit-transition: all 0.1s ease-in-out;-moz-transition: all 0.1s ease-in-out; -ms-transition: all 0.1s ease-in-out; -o-transition: all 0.1s ease-in-out;transition: all 0.1s ease-in-out;}
171 .wpf-switch-field label:hover {cursor: pointer;}
172 .wpf-switch-field input:checked + label {background-color: #43A6DF; -webkit-box-shadow: none; box-shadow: none; color:#fff;} /* #66DD8D */
173 /* .wpf-switch-field input:last-of-type:checked + label {background-color:#F77059; -webkit-box-shadow: none; box-shadow: none;} */
174 .wpf-switch-field input[disabled] + label {opacity: 0.5;} /* #66DD8D */
175 .wpf-switch-field label:first-of-type {border-radius: 4px 0 0 4px;}
176 .wpf-switch-field label:last-of-type {border-radius: 0 4px 4px 0;}
177
178 /**************************/
179 /* SETTINGS > GENERAL *****/
180 /**************************/
181
182
183 /**************************/
184 /* SETTINGS > MEMBERS *****/
185 /**************************/
186
187 #wpf-rating-table{ width:100%; font-size:12px; }
188 #wpf-rating-table input{ font-size:12px; height: 24px; width:100%; }
189 #wpf-rating-table input[type="checkbox"]{ width: 16px; height: 16px;}
190 #wpf-rating-table i{}
191 #wpf-rating-table h4{ margin:0; padding:0; font-size:14px; font-weight:bold; white-space:nowrap; }
192 #wpf-rating-table .wpf-badge-short{ color:#FFFFFF; white-space:nowrap; font-size:15px; line-height:22px; font-weight:bold; text-align:center; display:inline-block; padding:2px 10px; min-width:30px;}
193 #wpf-rating-table .wpf-badge-full{ color:#FFFFFF; white-space:nowrap; font-size:15px; line-height:16px; font-weight:bold; text-align:center; display:inline-block; padding:2px 8px; min-width:30px;}
194 #wpf-rating-table .wpf-badge-full.wpf-badge-level-6, #wpf-rating-table .wpf-badge-full.wpf-badge-level-7, #wpf-rating-table .wpf-badge-full.wpf-badge-level-8 { font-size:18px!important; }
195 #wpf-rating-table .wpf-badge-full.wpf-badge-level-9, #wpf-rating-table .wpf-badge-full.wpf-badge-level-10 { font-size:22px!important; }
196 #wpf-rating-table th{ text-transform:uppercase; font-size:12px;}
197
198 /**************************/
199 /* SETTINGS > STYLES ******/
200 /**************************/
201
202 .wpforo-style-color-wrapper{width:14%; float:left; }
203 .wpforo-style-field{ height:auto; min-height:38px;}
204 .wpforo-style-field input{}
205 .wp-picker-container input.wp-color-picker[type="text"]{ vertical-align:top; }
206 .wpf-forum-additional-options .wp-picker-container .wp-color-result.button,
207 .wpforo-style-color-wrapper .wp-picker-container .wp-color-result.button{min-height: 25px;}
208 .wpforo-style-color{ display:block; color:#333333; font-weight:bold; text-align:center; float:left; width:23px; padding:0 5px; margin-right:5px; border:#CCCCCC 1px solid;}
209 #wpf-admin-wrap .iris-picker{z-index: 1;position: absolute;}
210 #dynamic-css-notice-wrap{margin-top: 25px;padding: 15px;background-color: #FFFFC6;border: 1px solid #e5e5e5;}
211 #dynamic-css-notice-wrap p{margin: 0;}
212 #dynamic-css-notice-wrap br{display: block;margin: 5px 0;content: " ";line-height: 5px;}
213 #dynamic-css-notice-wrap hr{border: 0;border-top: 1px solid #777;border-bottom: none;}
214 #dynamic-css-notice-wrap b{font-size: larger;}
215 #dynamic-css-notice-wrap #dynamic-css-code-wrap{position: relative;padding-top: 30px;margin-top: 15px;}
216 #dynamic-css-notice-wrap #dynamic-css-code-wrap .dynamic-css-fname{display: inline-block;padding: 2px 15px;height: 27px;font-weight: bold;position: absolute;top: 0;left: 0;cursor: copy;background-color: lightyellow;border: 1px solid #ddd;border-bottom: none;border-top-left-radius: 5px;border-top-right-radius: 5px;box-shadow: inset 0 1px 2px rgba(0, 0, 0, 0.07);-webkit-user-select: none;-moz-user-select: none;-ms-user-select: none;user-select: none;}
217 #dynamic-css-notice-wrap #dynamic-css-code-wrap textarea.dynamic-css-code{width: 100%;min-height: 200px;height: 200px;resize: vertical;cursor: copy;background-color: lightyellow;color: #000;padding: 22px;}
218 #dynamic-css-notice-wrap #dynamic-css-code-wrap textarea.dynamic-css-code:focus{border: 1px solid #ddd;box-shadow: inset 0 1px 2px rgba(0, 0, 0, 0.07);}
219 #dynamic-css-notice-wrap #dynamic-css-code-wrap textarea.dynamic-css-code:focus ~ .dynamic-css-fname{border-color: #5b9dd9;box-shadow: 0 0 2px rgba( 30, 140, 190, 0.8 );}
220 #dynamic-css-notice-wrap #dynamic-css-code-wrap .wpf_copied_txt{display: inline-block;align-items: center;transition: opacity 0.2s linear;justify-content: center;position: absolute;left: 50%;top: 50%;transform: translate(-50%, -50%);padding: 3px 15px;border-radius: 7px;background: rgba(0, 0, 0, 0.8);opacity: 0;color: #ffffff;font-weight: bold;font-size: 1.2em;}
221 .wpf_copy_animate{animation: wpf_bounce 0.4s linear;}
222 #dynamic-css-notice-wrap #dynamic-css-code-wrap.wpf_copy_animate .wpf_copied_txt{opacity: 1;}
223 @keyframes wpf_bounce {
224 0%{
225 transform: scale(1);
226 }
227 20%{
228 transform: scale(0.95);
229 }
230 40%{
231 transform: scale(1.04);
232 }
233 60%{
234 transform: scale(0.97);
235 }
236 80%{
237 transform: scale(1.02);
238 }
239 100%{
240 transform: scale(1);
241 }
242 }
243
244 .wpf-color-desc ul{
245 margin-left: 10px;
246 list-style: disc;
247 padding-top: 5px;
248 }
249 .wpf-color-desc ul li{
250 padding: 0;
251 line-height: 18px;
252 list-style: disc;
253 font-size: 14px;
254 }
255 .wpf-color-desc ul li ul li{
256 list-style: circle;
257 }
258 /**************************/
259 /* THEMES *****************/
260 /**************************/
261
262 .wpforo-themes .wpf-div-table{ display:table!important; border: 1px solid #e5e5e5; box-shadow: 0 1px 1px rgba(0, 0, 0, 0.04); background:#FFFFFF; width:100%; padding:0 10px 10px 10px; margin-top:30px; box-sizing:border-box;}
263 .wpforo-themes .wpf-div-tr{ display:table-row; }
264 .wpforo-themes .wpf-div-td{ display:table-cell; vertical-align:top; padding:15px 10px 10px 15px; }
265 .wpforo-themes .wpf-theme-screenshot{ width:250px; height:180px; border:3px solid #ddd; float:left; }
266 .wpforo-themes .wpf-theme-info{ margin-left:270px; min-height:185px; }
267 .wpforo-themes .wpf-theme-info p{ margin:1px;}
268 .wpforo-themes .wpf-layout-info p{ margin:1px;}
269 .wpforo-themes .wpf-layout-info a{ text-decoration:none; font-weight:normal; }
270 .wpforo-themes .wpf-theme-actions{ display:block; clear:both; margin-top:10px; text-align:right; box-sizing:border-box; padding:2px 20px; }
271 .wpforo-themes .wpf-theme-actions .wpf-action{ }
272
273 /**************************/
274 /* ADDONS *****************/
275 /**************************/
276 #menu-comments ul > li:nth-child(3) a{ color:#25ACEA!important; text-shadow: 1px 1px 1px #000; }
277 .wpforo-addons .wpforo-addons-wrapper {box-sizing: border-box;}
278 .wpforo-addons .wpforo-addon-block {width: 280px; padding-top:10px; height:auto; float: left; margin-right: 1%; margin-bottom: 20px; background: #fff; border: 2px solid #e5e5e5; box-shadow: 0 3px 3px rgba(0, 0, 0, 0.04);}
279 .wpforo-addons .wpforo-addon-block .addon-thumb {float:none; width: 260px; padding:10px; margin-top:2px; height:180px;}
280 .wpforo-addons .wpforo-addon-block .addon-info {display:block;background:#43A6DF; padding:10px 15px; border:3px solid #fff; border-top:none;margin: 10px 0 0;min-height: 105px;}
281 .wpforo-addons .wpforo-addon-block .addon-title { font-size:16px; font-weight:bold; color:#FFFFFF; margin:0; line-height:18px; display:inline-block; text-decoration:none;}
282 .wpforo-addons .wpforo-addon-block .addon-title:hover { color:#E5F6FF;}
283 .wpforo-addons .wpforo-addon-block .addon-desc { font-size:13px; color:#FFFFFF; margin:0; line-height:18px; padding:10px 0 0 0; font-style:italic;}
284 .wpforo-addons .wpforo-addon-block .addon-isactive {margin: 0; padding:10px; background:#e5e5e5; text-align:center;}
285 .wpforo-addons .wpforo-addon-block .addon-button{ margin-bottom:10px;}
286 .wpforo-addons .wpforo-addon-block .note-installed { padding:10px 20px; background:#fff; border: 1px solid #ddd; box-shadow: 0 3px 3px rgba(0, 0, 0, 0.04); color:#2396D3; font-size:14px; margin-top:20px; }
287
288 /**************************/
289 /* TOOLS ******************/
290 /**************************/
291 #wpf-admin-wrap .wpf-tool-box { border:1px solid #ddd; min-height:350px; float:left; margin-right:1%; margin-bottom:10px; padding:10px 10px 20px 10px; box-sizing:border-box; width:100%;}
292 #wpf-admin-wrap .wpf-tool-box h3{ margin:0; font-weight:normal; border-bottom:1px dotted #ccc; padding-bottom:5px;}
293 #wpf-admin-wrap .wpf-tool-box th{ padding:5px 5px 5px 5px; font-size:13px; text-align:left; font-weight:400; line-height:16px; border-bottom:1px solid #EDEDED;}
294 #wpf-admin-wrap .wpf-tool-box td{ padding:5px 5px 5px 5px; border-bottom:1px solid #EDEDED;}
295 #wpf-admin-wrap .wpf-tool-box.wpf-spam-attach.right-box { width:52%; min-width:500px;max-height:370px; overflow-y:auto; }
296 #wpf-admin-wrap .wpf-tool-box.wpf-spam-attach.left-box { width:45%; min-width:300px;}
297 #wpf-admin-wrap .wpf-tool-box.wpf-spam-attach .wpf-spam-attach-dir{ color:#4742C5; display:block; text-align:right; }
298 #wpf-admin-wrap .wpf-tool-box tr:nth-child(even){ background:#EDEDED;}
299 #wpf-admin-wrap .wpf-tool-box .wpf-spam-item{}
300 #wpf-admin-wrap .wpf-tool-box .wpf-actions{}
301 @media screen and (max-width:1250px) {
302 #wpf-admin-wrap .wpf-spam-attach.left-box { width:100%; min-width:100%; min-height:unset; max-height:none!important;}
303 #wpf-admin-wrap .wpf-spam-attach.right-box { width:100%; min-width:100%; min-height:unset; max-height:none!important;}
304 }
305
306 #wpf-admin-wrap .wpf-data { word-break: break-all; background: #ffffff; margin: 2px;padding: 2px 10px; font-size: 12px;line-height: 18px;}
307 #wpf-admin-wrap .wpf-data > key{font-weight: 600;color: #000088;}
308 #wpf-admin-wrap .wpf-data > value{font-weight: 600;color: #666666;}
309 #wpf-admin-wrap .wpf-sb-data > key{color: #0a6d9b;}
310 #wpf-admin-wrap .wpf-sb-data > value{color:#1b6e08;}
311 #wpf-admin-wrap .wpf-main-table-data{margin: 10px;}
312 #wpf-admin-wrap .wpf-main-table-data td{vertical-align: top;text-align: left;padding: 0 0 15px;}
313 #wpf-admin-wrap .wpf-table-data{border-collapse: collapse;margin: 0;}
314 #wpf-admin-wrap .wpf-table-data.wpf-tbl{min-width: 550px;}
315 #wpf-admin-wrap .wpf-table-data tr{border: none;}
316 #wpf-admin-wrap .wpf-table-data td{padding: 1px 5px;font-size: 12px;border: 1px solid #cccccc;line-height: 18px;}
317
318 @keyframes dashicons-spin {
319 0% {
320 transform: rotate( 0deg );
321 }
322 100% {
323 transform: rotate( 360deg );
324 }
325 }
326
327
328 body{
329 position: relative !important;
330 }
331
332 #wpf-admin-loading-extrawrap{
333 position: fixed;
334 top: 0;
335 right: 0;
336 bottom: 0;
337 left: 0;
338 background-color: rgba(67, 166, 223, 0.6);
339 z-index: 9999999999999999;
340 }
341
342 #wpf-admin-loading-extrawrap .wpf-admin-loading-wrap{
343 display: flex;
344 flex-wrap: nowrap;
345 flex-direction: column;
346 position: fixed;
347 left: 50%;
348 top: 50%;
349 transform: translate(-50%, -50%);
350 transform-origin: center;
351 width: auto;
352 height: auto;
353 }
354 #wpf-admin-loading-extrawrap .wpf-admin-loading-wrap .wpf-admin-loading-ico{animation: dashicons-spin 2s infinite;animation-timing-function: linear;width: auto;height: auto;text-shadow: 0 0 30px #00000087;}
355 #wpf-admin-loading-extrawrap .wpf-admin-loading-wrap .wpf-admin-loading-ico::before{font-size: 100px;}
356 #wpf-admin-loading-extrawrap .wpf-admin-loading-wrap .wpf-admin-loading-txt{
357 font-size: 2.5em;
358 font-weight: 900;
359 text-shadow: 0 0 30px #00000087;
360 -webkit-touch-callout: none; /* iOS Safari */
361 -webkit-user-select: none; /* Safari */
362 -khtml-user-select: none; /* Konqueror HTML */
363 -moz-user-select: none; /* Old versions of Firefox */
364 -ms-user-select: none; /* Internet Explorer/Edge */
365 user-select: none; /* Non-prefixed version, currently supported by Chrome, Opera and Firefox */
366 }
367 #wpf-access-table #wpf-access-list tr{background-color: #FFFFFF;}
368 #wpf-access-table #wpf-access-list tr:nth-child(odd){background-color: #FCFCFC;}
369 #wpf-admin-wrap .wpf-box-wrap{margin:0; display: flex; justify-content: flex-start; align-items: flex-start; flex-wrap: wrap;}
370 #wpf-admin-wrap .wpf-box-wrap .wpf-dash-box{width: 31%; margin: 10px; min-width: 450px;}
371 #wpf-admin-wrap .wpf-box-header{font-size: 14px;padding: 8px 12px;margin: 0;line-height: 1.4;border-bottom: 1px solid #ccd0d4;}
372 body[class*=forums_page_wpforo] #wpfooter{position: static;}
373 #wpf-admin-wrap .wpf-wn-label{ font-weight: bold; padding:0 5px; font-size: 14px;}
374 #wpf-admin-wrap .wpf-wn-list {margin: 0 20px; font-size: 14px;}
375 #wpf-admin-wrap .wpf-wn-list li{margin-bottom: 2px; list-style: disc;}
376
377
378 /************************************************************/
379 /* Dashboard ##############################################*/
380 /************************************************************/
381 #wpf-dash.wrap{padding: 10px 30px 10px 40px; margin:0; }
382 #wpf-dash[dir=rtl]{padding: 10px 40px 10px 30px;}
383 #wpf-dash a{text-decoration: none;}
384 #wpf-dash a:hover{text-decoration: underline;}
385 #wpf-dash .wpf-dash-head{display: flex; flex-direction: row; justify-content: space-between; align-items: flex-start;}
386 #wpf-dash .wpf-dash-head-left h1{font-size: 34px; letter-spacing: 1px; line-height: 40px; padding-bottom: 0; margin-bottom: 0;}
387 #wpf-dash .wpf-dash-head-left .wpf-head-subtitle{margin-left: 275px; font-size: 11px; color: #0e8e75; font-weight: bold; font-family: "Courier New", Courier, monospace; margin-top: -1px;}
388 #wpf-dash .wpf-dash-head-left .wpf-head-welcome{font-size: 15px; line-height: 25px; letter-spacing: 1px; font-family: 'Lucida Bright', 'DejaVu Serif', Georgia, serif; padding-top: 15px;}
389 #wpf-dash .wpf-dash-head-right{text-align: center;}
390 #wpf-dash .wpf-dash-head-right img{ width: 147px; display: block; margin: 10px auto 1px auto;}
391 #wpf-dash .wpf-dash-head-right .wpf-version{font-family: Verdana, Arial, sans-serif; font-weight: bold; font-size: 12px; color: #666666; }
392 #wpf-dash .wpf-section{margin: 35px 0 20px 0; display: flex; flex-direction: row; justify-content: space-between; align-items: flex-end; width: 100%; border-bottom: 1px solid #cccccc; padding: 0 1px 8px 1px; }
393 #wpf-dash .wpf-section h3{padding: 0; margin: 0;}
394 #wpf-dash .wpf-section .wpf-close{font-size: 14px; color: #666666; cursor: pointer;}
395 #wpf-dash .wpf-section .dashicons{color: #777777; cursor: pointer;}
396 #wpf-dash .wpf-sec-stat{margin-top: 30px;}
397 #wpf-dash .wpf-box{background: #FFF; box-shadow: 0 0 3px #aaa;}
398 #wpf-dash .wpf-box .wpf-box-head{border-bottom: 1px solid #ccc; padding: 10px 20px; display: flex; flex-direction: row; justify-content: space-between; align-items: center;}
399 #wpf-dash .wpf-box .wpf-box-head h3{font-size: 16px; margin: 0; padding: 0; line-height: 24px; color: #333333; font-weight: normal;}
400 #wpf-dash .wpf-box .wpf-box-head .wpf-box-toggle{width: 50px; text-align: right; display: flex; flex-direction: row;justify-content: flex-end; align-items: center;}
401 #wpf-dash .wpf-box .wpf-box-head .wpf-box-toggle span{font-size: 22px; color: #777; cursor: pointer; display: inline; line-height: 22px;}
402 #wpf-dash .wpf-box .wpf-box-head .wpf-box-toggle span.dashicons-admin-generic{font-size: 15px;}
403 #wpf-dash .wpf-box .wpf-box-head .wpf-box-toggle span.dashicons-arrow-left,
404 #wpf-dash .wpf-box .wpf-box-head .wpf-box-toggle span.dashicons-arrow-right{line-height: 22px; width: 14px; font-size: 24px; color: #0d9b7f; margin-right: 3px;}
405 #wpf-dash .wpf-box .wpf-box-head .wpf-box-info{flex-grow: 1; padding-left: 20px;}
406 #wpf-dash .wpf-box .wpf-box-head .wpf-box-info span{font-size: 12px; color: #666;}
407 #wpf-dash .wpf-box .wpf-box-head .wpf-box-info span.dashicons{font-size: 13px; line-height: 21px;}
408
409
410 /************************************************************/
411 /* Board Edit Page #########################################*/
412 /************************************************************/
413
414 .wpf-board{display: flex; justify-content: space-between; align-items: flex-start; margin-top: 50px;}
415 .wpf-board-left{width: calc(100% - 270px);}
416 .wpf-board-right{width: 270px; margin-left: 20px; background: #fff; padding: 20px;}
417 .wpf-board-option{margin-bottom: 20px;}
418 .wpf-board-option label{ font-size: 16px; font-weight: 500;}
419 .wpf-board-option .wpf-board-field{margin-top: 5px;}
420 .wpf-board-option .wpf-board-field input[type="text"],
421 .wpf-board-option .wpf-board-field textarea{width: 100%; background: #fff; padding: 0px 10px;}
422
423 .wpf-board-box{background: #fff; padding: 20px 20px 10px; display: flex; justify-content: flex-start; align-items: stretch; flex-wrap: wrap; margin-bottom: 25px;}
424 .wpf-board-box div{margin-right: 20px; border-right: 1px dashed #ccc; padding-right: 20px; width: 32%; min-width: 320px; margin-bottom: 20px;}
425 .wpf-board-box div:last-child{border-right: none;}
426 .wpf-board-box div > label{display: block; font-size: 15px; font-weight: 500; margin-bottom: 7px;}
427 .wpf-board-box div > label .wpfb-desc{font-size: 13px; font-weight: normal; display: block;}
428
429 .wpf-board-side-box{ padding-bottom: 20px; border-bottom: 3px solid #f5f5f5; margin-bottom: 20px; }
430 .wpf-board-side-box > label{ font-size: 15px; font-weight: 500; display: block; padding-bottom: 7px;}
431 .wpf-board-submit .button{width: 100%; font-size: 16px;}
432
433 .wpf-board-modules{background: #fff; padding: 20px 20px 10px; display: flex; justify-content: flex-start; align-items: stretch; flex-wrap: wrap; margin-bottom: 25px;}
434 .wpf-module-type{width: 100%; font-size: 20px; font-weight: normal; border-bottom: 1px solid #eee; margin-bottom: 10px; padding: 10px}
435 .wpf-board-module{margin: 0.5%; padding: 10px 0 15px; box-shadow: 0 0 20px 1px #f5f5f5 inset; min-width: 280px; width: 18%; border: 1px dashed #ddd; display: flex; justify-content: flex-start; align-items: stretch;}
436 .wpf-board-module .wpf-module-head{width: 84px; text-align: center; display: flex; justify-content: center; align-items: center;}
437 .wpf-board-module .wpf-module-head svg{width: 48px; height: 48px; vertical-align: middle; fill: #43A6DF;}
438 .wpf-board-module .wpf-module-title{min-height: 32px; font-size: 13px; font-weight: 500; display: flex; justify-content: flex-start; align-items: center;}
439 .wpf-board-module .button{margin-top: -3px;}
440
441 /************************************************************/
442 /* Setting Boxes ###########################################*/
443 /************************************************************/
444
445 #wpcontent[dir=rtl]{padding-right: 0;}
446 #wpf-setbox{box-sizing:border-box; padding: 0; }
447 #wpf-setbox[dir=rtl] { margin-right: -10px;}
448 #wpf-setbox.wrap{}
449 #wpf-setbox a{text-decoration: none;}
450 #wpf-setbox a:hover{text-decoration: underline;}
451 #wpf-setbox a:visited, #wpf-setbox a:focus{box-shadow: none!important;}
452 #wpf-setbox .wpf-setbox-head{box-sizing:border-box; padding: 20px 30px 20px 30px; margin-top: 18px; margin-bottom: 40px; display: flex; flex-direction: row; flex-wrap: wrap; justify-content: space-between; align-items: center; box-shadow: 0 0 10px #ccc; background-color: #f9f9f9; width: calc(100% - 16px)}
453 #wpf-setbox .wpf-setbox-head .wpf-head-logo{width: 200px;}
454 #wpf-setbox .wpf-setbox-head .wpf-head-logo img{height: 40px;}
455 #wpf-setbox .wpf-setbox-head .wpf-head-title{text-shadow: 1px 1px 1px #b9b9b9; flex-grow: 1; padding: 0 15px 10px 15px; font-size: 30px; font-weight: 600; color: #43A6DF; letter-spacing: 1px;}
456 #wpf-setbox .wpf-setbox-head .wpf-head-info{ font-size: 14px;}
457 #wpf-setbox .wpf-setbox-head .wpf-head-info a{overflow: hidden; outline: none; font-weight: 600; opacity: 0.8;}
458 #wpf-setbox .wpf-setbox-head .wpf-head-info span{padding: 0 10px; border-right: 1px solid #0073aa;}
459 #wpf-setbox .wpf-setbox-head .wpf-head-info span:last-child{border-right: none;}
460 #wpf-setbox .wpf-setbox-head .wpf-head-info span[dir=rtl]{border-left: 1px solid #999;}
461 #wpf-setbox .wpf-setbox-head .wpf-head-info span:last-child[dir=rtl]{border-left: none;}
462 #wpf-setbox .wpf-setbox-body { padding: 0 15px; }
463 #wpf-setbox .wpf-setbox-body .wpf-section{border-bottom: 1px solid #ccc; padding: 8px 0; display: flex; flex-direction: row; justify-content: space-between; align-items: flex-end;}
464 #wpf-setbox .wpf-setbox-body .wpf-section h3{letter-spacing:1px; font-weight: normal; color: #444; font-size: 20px; margin: 0; padding: 0; line-height: 24px;}
465 #wpf-setbox .wpf-setbox-body .wpf-opt-search{position: relative; text-align: right; z-index: 999; width: 30%;}
466 #wpf-setbox .wpf-setbox-body .wpf-opt-search input[type="text"]{max-width: none; background: #fafafa;}
467 #wpf-setbox .wpf-setbox-body .wpf-opt-search[dir=rtl]{text-align: left;}
468 #wpf-setbox .wpf-setbox-body .wpf-opt-search #wpf-opt-search-results{display:none;box-sizing:border-box;position: absolute;width: 100%;text-align: left;z-index: 99;border: 1px solid #ccc;background-color: #fff;left: 1px;top: 30px;}
469 #wpf-setbox .wpf-setbox-body .wpf-opt-search #wpf-opt-search-results a{padding: 5px;display: inline-block;text-decoration: none;width: 97%;}
470 #wpf-setbox .wpf-setbox-body .wpf-opt-search #wpf-opt-search-results a:hover, #wpf-setbox .wpf-setbox-body .wpf-opt-search #wpf-opt-search-results a:focus{-webkit-transition: color .3s linear;-moz-transition: color .3s linear;-o-transition: color .3s linear;-ms-transition: color .3s linear;transition: color .3s linear;color: #00B38F;}
471 #wpf-setbox .wpf-setbox-body .wpf-opt-search #wpf-opt-search-results a.wpf-opt-search-tabtitle{margin-left: 5px; width: 90%; font-weight: 600; font-size: 14px;}
472 #wpf-setbox .wpf-setbox-body .wpf-opt-search #wpf-opt-search-results a.wpf-opt-search-taboption{margin-left: 20px;width: 90%; font-size: 13px;}
473 #wpf-setbox .wpf-setbox-body .dashicons-search{display: inline-block; position: absolute; bottom: 4px; right: 4px; font-size: 20px; color: #43a6df; cursor: pointer;}
474 #wpf-setbox .wpf-setbox-body .dashicons-search[dir=rtl]{right: auto; left: 4px;}
475 #wpf-setbox .wpf-setbox-body input[type="text"]{font-size: 15px; line-height: 20px; padding: 5px 10px; display: inline-block; width: 100%; max-width: 400px;}
476 #wpf-setbox .wpf-setbox-body .wpf-box-wrap{display: block; align-items: center; padding: 25px 0 10px 0; }
477 #wpf-setbox .wpf-setbox-body .wpf-box{background: #FFF; box-shadow: 0 0 2px #bbb; position: relative; float: left;}
478 #wpf-setbox .wpf-setbox-body .wpf-box-info{ width: 0; height: 0; right: 0; top: 0; position: absolute; border-left: 41px solid transparent;}
479 #wpf-setbox .wpf-setbox-body .wpf-box-info[dir=rtl]{ right: auto; left: 0;}
480 #wpf-setbox .wpf-setbox-body .wpf-box-info img{position: absolute; top: -36px; right: 3px; z-index: 10; height: 16px;}
481 #wpf-setbox .wpf-setbox-body .wpf-box-info img[dir=rtl]{left: 3px;}
482 #wpf-setbox .wpf-setbox-body .wpf-box-info.wpf-ok img{height: 17px;}
483 #wpf-setbox .wpf-setbox-body .wpf-box-info.wpf-new img{height: 8px; top: -32px; right: 1px;}
484 #wpf-setbox .wpf-setbox-body .wpf-box-info.wpf-ok{border-top: 41px solid #43a6df;}
485 #wpf-setbox .wpf-setbox-body .wpf-box-info.wpf-new{border-top: 41px solid #8e58a3;}
486 #wpf-setbox .wpf-setbox-body .wpf-box-info.wpf-note{border-top: 41px solid #f98e3c;}
487 #wpf-setbox .wpf-setbox-body .wpf-box .wpf-box-head{display: flex; justify-content: center; align-items: center; text-align: center; padding: 5px 5px 0 5px; height: 90px;}
488 #wpf-setbox .wpf-setbox-body .wpf-box .wpf-box-head a{ display: flex; width: 100%; height: 100%; justify-content: center; align-items: center;}
489 #wpf-setbox .wpf-setbox-body .wpf-box .wpf-box-head svg{ color: #43a6df; fill: #43a6df;}
490 #wpf-setbox .wpf-setbox-body .wpf-box .wpf-box-foot{min-height: 70px; background-color: #fafafa; display: flex; flex-direction: row; justify-content: space-between; align-items: stretch; border-top: 1px solid #e5e5e5;}
491 #wpf-setbox .wpf-setbox-body .wpf-box .wpf-box-foot:hover{background-color: #f1f1f1;}
492 #wpf-setbox .wpf-setbox-body .wpf-box .wpf-box-foot .wpf-box-title{display: flex; flex-wrap: wrap; justify-content: center; align-items: center; text-align: center; flex-grow: 1; padding: 5px 20px; box-sizing: border-box;}
493 #wpf-setbox .wpf-setbox-body .wpf-box .wpf-box-foot .wpf-box-title a{font-size: 15px;color: #555;line-height: 19px;width: 100%;height: 100%;display: flex;justify-content: center;align-items: center;}
494 #wpf-setbox .wpf-setbox-body .wpf-box .wpf-box-foot .wpf-box-title a:hover{text-decoration: none;}
495 #wpf-setbox .wpf-setbox-body .wpf-box .wpf-box-foot .wpf-box-arrow{display: flex; justify-content: center; align-items: center; text-align: center; padding-right: 20px; box-sizing: border-box;}
496 #wpf-setbox .wpf-setbox-body .wpf-box .wpf-box-foot .wpf-box-arrow[dir=rtl]{padding-left: 20px;}
497 #wpf-setbox .wpf-setbox-body .wpf-box .wpf-box-foot .wpf-box-arrow img{height: 24px;}
498 #wpf-setbox .wpf-setbox-body .wpf-box .wpf-body{display: flex; flex-direction: row; justify-content: space-between; align-items: center; padding: 12px 10px;}
499 #wpf-setbox .wpf-setbox-body .wpf-box .wpf-body .wpf-title{font-size: 15px; flex-grow: 1; padding: 0 10px; color: #666; white-space: nowrap; overflow: hidden; text-overflow: ellipsis;}
500 #wpf-setbox .wpf-setbox-body .wpf-box .wpf-body .wpf-title a{font-size: 15px; color: #555; line-height: 19px;}
501 #wpf-setbox .wpf-setbox-body .wpf-box .wpf-body .wpf-title a:hover{text-decoration: none;}
502 #wpf-setbox .wpf-setbox-body .wpf-box .wpf-body:hover{background-color: #fafafa;}
503 #wpf-setbox .wpf-box-wrap.wpf-box-addons{justify-content: flex-start;}
504 #wpf-setbox .wpf-box-wrap.wpf-box-addons .wpf-box{margin-bottom: 10px;}
505 .wpf-clear{clear: both;}
506 #wpf-setbox .wpf-section-imp-exp{text-align: right; padding-top: 8px;}
507 #wpf-setbox .wpf-section-imp-exp a:hover{ text-decoration: none; }
508 #wpf-setbox .wpf-section-imp-exp button{ display: inline-flex;justify-content: center;align-items: center; }
509 #wpf-setbox .wpf-opt-checkbox-wrap { padding: 5px 0; }
510 #wpf-setbox .wpf-opt-row-imp-exp label{ cursor: pointer; font-size: 15px; }
511 #wpf-setbox .wpf-opt-row-imp-exp input[type=checkbox]{width: 25px; height: 25px; cursor: pointer;}
512 #wpf-setbox .wpf-opt-row-imp-exp input[type=checkbox]:checked::before{content: "\2713";font-size: 25px;font-weight: bold;display: block;text-align: center;color: #43A6DF;margin-top: 10px; margin-left: 0;}
513
514 /************************************************************/
515 /* Single Settings #########################################*/
516 /************************************************************/
517 #wpf-setbox .wpf-switcher input[type=checkbox]{ height: 0; width: 0; visibility: hidden; position: absolute;}
518 #wpf-setbox .wpf-switcher label { cursor: pointer; text-indent: -9999px; width: 50px; height: 18px; background: grey; display: block; border-radius: 30px; position: relative;border: 1px solid rgba(0, 0, 0, 0.1); -webkit-box-shadow: inset 0 1px 3px rgba(0, 0, 0, 0.2), 0 1px rgba(255, 255, 255, 0.1); box-shadow: inset 0 1px 3px rgba(0, 0, 0, 0.2), 0 1px rgba(255, 255, 255, 0.1); -webkit-transition: all 0.1s ease-in-out; -moz-transition: all 0.1s ease-in-out; -ms-transition: all 0.1s ease-in-out; -o-transition: all 0.1s ease-in-out; transition: all 0.1s ease-in-out;}
519 #wpf-setbox .wpf-switcher label:after {content: ''; position: absolute; top: 4px; left: 5px; width: 10px; height: 10px; background: #fff; border-radius: 90px; transition: 0.3s;}
520 #wpf-setbox .wpf-switcher input:checked + label {background: #43A6DF;}
521 #wpf-setbox .wpf-switcher input:checked + label:after {left: calc(100% - 5px);transform: translateX(-100%);}
522 #wpf-setbox .wpf-switcher label:active:after {width: 12px;}
523 #wpf-setbox .wpf-radio input[type=radio]{display: none;}
524 #wpf-setbox .wpf-radio .wpf-radio-circle {cursor: pointer; width: 16px; height: 16px; background: grey; display: inline-block; border-radius: 30px; position: relative;border: 1px solid rgba(0, 0, 0, 0.1); -webkit-box-shadow: inset 0 1px 3px rgba(0, 0, 0, 0.2), 0 1px rgba(255, 255, 255, 0.1); box-shadow: inset 0 1px 3px rgba(0, 0, 0, 0.2), 0 1px rgba(255, 255, 255, 0.1);}
525 #wpf-setbox .wpf-radio input:checked + .wpf-radio-circle {background: #43A6DF;}
526 #wpf-setbox .wpf-radio input:checked + .wpf-radio-circle:after {content: ''; width: 8px; height: 8px; margin: 4px; background: #fff; border-radius: 50%; display: inline-block;}
527 #wpf-setbox .wpf-desc{font-size:13px; color:#666666; font-style: italic; width:90%; padding:5px 0 0 0; margin:0; line-height: 18px; font-weight: normal;}
528 #wpf-setbox .wpf-setbox-body .wpf-setcon{width: calc(100% - 350px); padding-bottom: 20px; float: left;}
529 #wpf-setbox .wpf-setbox-body .wpf-setbar{width: 320px; float: right;}
530 #wpf-setbox .wpf-setcon .wpf-setcon-head{padding: 14px 30px; font-size: 16px; font-weight: 600; line-height: 21px; border-bottom: 1px dashed #43A6DF; color: #43A6DF; margin-bottom: 5px; display: flex; justify-content: space-between; align-items: center; flex-direction: row;}
531 #wpf-setbox .wpf-setcon .wpf-setcon-head a.wpf-back{font-size: 14px; line-height: 20px;}
532 #wpf-setbox .wpf-setcon .wpf-setcon-head a.wpf-back:hover{text-decoration:none;}
533 #wpf-setbox .wpf-setcon .wpf-setcon-head a.wpf-back .dashicons{font-size: 14px; line-height: 22px;}
534 #wpf-setbox .wpf-setcon .wpf-setcon-body{padding: 0 30px;}
535 #wpf-setbox .wpf-setcon .wpf-opt-row{display: flex; justify-content: space-between; align-items: flex-start; padding: 15px 0 10px 0; border-bottom: 1px solid #ddd;}
536 #wpf-setbox .wpf-setcon .wpf-opt-row:last-child{border-bottom: none;}
537 #wpf-setbox .wpf-setcon .wpf-opt-row.wpf-opt-row-tight{padding-top: 8px; padding-bottom: 8px;}
538 #wpf-setbox .wpf-setcon .wpf-opt-row .wpf-opt-intro svg{float: left; padding: 0 30px 5px 10px; fill: #43A6DF; color: #43A6DF;}
539 #wpf-setbox .wpf-setcon .wpf-opt-row .wpf-opt-intro svg[dir=rtl]{float: left; padding: 0 10px 5px 30px}
540 #wpf-setbox .wpf-setcon .wpf-opt-row .wpf-opt-intro img{float: left; padding: 0 30px 5px 10px;}
541 #wpf-setbox .wpf-setcon .wpf-opt-row .wpf-opt-intro img[dir=rtl]{float: left; padding: 0 10px 5px 30px}
542 #wpf-setbox .wpf-setcon .wpf-opt-row .wpf-opt-name{font-size: 15px; width: calc(60% - 42px); color: #555; font-weight: 600;}
543 #wpf-setbox .wpf-setcon .wpf-opt-row .wpf-opt-input{width: 40%; min-width: 300px;}
544 #wpf-setbox .wpf-setcon .wpf-opt-row .wpf-opt-input .wpf-switcher{ width: 60px;}
545 #wpf-setbox .wpf-setcon .wpf-opt-row .wpf-opt-doc{width: 40px; text-align: right; font-size: 16px;}
546 #wpf-setbox .wpf-setcon .wpf-opt-row .wpf-opt-input .wpf-optset{display: flex; justify-content: flex-start; align-items: center; margin-bottom: 6px;}
547 #wpf-setbox .wpf-setcon .wpf-opt-row .wpf-opt-input .wpf-optset .wpf-switcher{margin: 0;}
548 #wpf-setbox .wpf-setcon .wpf-opt-row .wpf-opt-input .wpf-optset .wpf-optset-label{padding: 0 10px 2px 10px; color: #777777;}
549 #wpf-setbox .wpf-setcon .wpf-opt-row .wpf-opt-intro{width: calc(100% - 40px); font-size: 15px; line-height: 22px; padding: 5px 0 20px 0; text-align: justify;}
550 #wpf-setbox .wpf-setcon .wpf-opt-row.wpf-custom-option-group-wrapper{flex-wrap:wrap;}
551 #wpf-setbox .wpf-setcon .wpf-opt-row.wpf-custom-option-group-wrapper .wpf-opt-input{width:100%;}
552 #wpf-setbox .wpf-setcon .wpf-opt-row.wpf-custom-option-group-wrapper .wpf-custom-option-group{margin-top:10px;display:flex;align-items:center;justify-content:space-between;}
553 #wpf-setbox .wpf-setcon .wpf-opt-row.wpf-custom-option-group-wrapper .wpf-custom-option-group.wpf-custom-option-group-default{display:none !important;}
554 #wpf-setbox .wpf-setcon .wpf-opt-row.wpf-custom-option-group-wrapper .wpf-custom-option-group .wpf-custom-option-label{width: 28%;}
555 #wpf-setbox .wpf-setcon .wpf-opt-row.wpf-custom-option-group-wrapper .wpf-custom-option-group .wpf-custom-option-value{width: 68%;}
556 #wpf-setbox .wpf-setcon .wpf-opt-row.wpf-custom-option-group-wrapper .wpf-custom-option-group .dashicons.dashicons-trash{color:#e51c23;cursor:pointer;}
557 #wpf-setbox .wpf-setcon .wpf-opt-row.wpf-custom-option-group-wrapper .wpf-custom-option-group-add{display:flex;align-items:center;justify-content:center;color:#43A6DF;background-color:#f5f5f5;margin:10px 0;height: 20px;font-size:23px;padding:15px;cursor:pointer;}
558 #wpf-setbox .wpf-setcon .wpf-opt-row.wpf-custom-option-group-wrapper .wpf-custom-option-group-add:hover{color:#f5f5f5;background-color:#43A6DF;}
559 #wpf-setbox .wpf-setcon .wpf-opt-row.wpf-custom-option-group-wrapper .wpf-custom-option-group-add .dashicons.dashicons-plus{font-size:40px;width:40px;height:35px;}
560 #wpf-setbox .wpf-setcon-body .wpf-opt-row input[type="submit"]{margin-left: 10px;}
561 #wpf-setbox .wpf-setcon-body .wpf-opt-row-textarea .wpf-opt-name{ width: 39%; }
562 #wpf-setbox .wpf-setcon-body .wpf-opt-row-textarea .wpf-opt-input{ width: 60%; text-align: right; }
563 #wpf-setbox .wpf-setcon-body .wpf-opt-row-textarea textarea{ width: 100%; min-height: 120px; color: #333333; font-family: 'Courier New', Courier, monospace; background: #f5f5f5; }
564 #wpf-setbox .wpf-setcon-body .wpf-opt-row-checkbox .wpf-opt-checkbox-wrap{ min-width: 45%; width: 48%; margin: 3px 1%; }
565 #wpf-setbox .wpf-setcon-body .wpf-opt-row-checkbox .wpf-opt-input{ padding: 0; display: flex; justify-content: flex-start; align-items: flex-start; flex-wrap: wrap; }
566 #wpf-setbox .wpf-setcon-body .wpforo-opt-richeditor tr td:first-of-type{ padding: 10px 0; width: 35%; }
567 #wpf-setbox .wpf-setcon-body .wpforo-opt-richeditor tr td label{ font-size: 15px; color: #555; font-weight: 600; }
568 /*#wpf-setbox .wpf-setcon-body .wpf-opt-input .wpf-opt-name,
569 #wpf-setbox .wpf-setcon-body .wpf-opt-input .wpf-opt-doc{ display: none; }*/
570 #wpf-setbox .wpf-setcon-body .wpf-opt-input .wpf-opt-input { flex-grow: 1; }
571 #wpf-setbox .wpf-setcon-body .wpf-opt-input .wpf-opt-row { border-bottom: 0; }
572 #wpf-setbox .wpf-setbar .wpf-box.wpf-menu-group{width: 100%; }
573 #wpf-setbox .wpf-setbar .wpf-box.wpf-menu-group:first-child{margin-bottom: 20px;}
574 #wpf-setbox .wpf-setbar ul{width: 100%; margin: 0; padding: 0; box-sizing: border-box;}
575 #wpf-setbox .wpf-setbar ul[dir=rtl]{border-right: 1px solid #43A6DF;}
576 #wpf-setbox .wpf-setbar li{width: 100%; padding: 8px 10px; margin: 0; font-size: 13px; font-weight: 600; box-sizing: border-box; border-top: 1px solid #ddd; }
577 #wpf-setbox .wpf-setbar li:nth-child(2){border-top: none;}
578 #wpf-setbox .wpf-setbar li .dashicons-arrow-left-alt2{visibility: hidden; font-size: 16px; line-height: 23px;}
579 #wpf-setbox .wpf-setbar li:hover .dashicons-arrow-left-alt2{visibility: visible;}
580 #wpf-setbox .wpf-setbar li a{color: #666666; display: block; line-height: 20px; outline: 0;}
581 #wpf-setbox .wpf-setbar li a:hover{color: #43A6DF; text-decoration: none;}
582 #wpf-setbox .wpf-setbar li a:visited, #wpf-setbox .wpf-setbar li a:focus{outline: 0; box-shadow: none!important;}
583 #wpf-setbox .wpf-setbar li.wpf-active{margin-left: 0;color: #fff;background-color: #43A6DF; font-size: 14px;width: calc(100% + 1px); }
584 #wpf-setbox .wpf-setbar li.wpf-active a{color: #ffffff;}
585 #wpf-setbox .wpf-setbar li.wpf-active .dashicons-arrow-left-alt2{visibility: visible; font-size: 20px;}
586 #wpf-setbox .wpf-setbar li.wpf-active[dir=rtl]{margin-right: -1px;}
587 #wpf-setbox .wpf-setbar li.wpf-menu-head{padding: 14px 15px; color: #43A6DF; font-weight: 600; letter-spacing: 1px; font-size: 16px; display: flex; justify-content: space-between; align-items: center; flex-direction: row; border-bottom: 1px dashed #43A6DF;}
588 #wpf-setbox .wpf-setbar li.wpf-menu-head .dashicons{font-size: 25px; line-height: 22px; cursor: pointer;}
589
590 #wpf-setbox .wpf-setcon .wpf-mublock,
591 #wpf-setbox .wpf-setcon .wpf-mublock-inline{margin-bottom:5px;}
592 #wpf-setbox .wpf-setcon .wpf-mublock-inline {float:left; display:inline-block; width:19.5%}
593 #wpf-setbox .wpf-setcon .wpf-mublock{display:block;}
594 #wpf-setbox .wpf-setcon .wpf-mublock-inline label,
595 #wpf-setbox .wpf-setcon .wpf-mublock label{white-space:nowrap; font-size:13px; vertical-align:top; margin-left:2px;overflow: hidden;text-overflow: ellipsis;display: inline-block;width: 70%;}
596 #wpf-setbox .wpf-setcon .wpf-switch-field input { display: none;}
597 #wpf-setbox .wpf-setcon .wpf-switch-field label {float: left; display: inline-block; line-height: 20px; min-width:80px; font-weight: normal; background-color: #e4e4e4;color:#333;font-size: 13px;text-align: center; text-shadow: none;padding: 2px 10px; border: 1px solid rgba(0, 0, 0, 0.2);-webkit-box-shadow: inset 0 1px 3px rgba(0, 0, 0, 0.3), 0 1px rgba(255, 255, 255, 0.1);box-shadow: inset 0 1px 3px rgba(0, 0, 0, 0.3), 0 1px rgba(255, 255, 255, 0.1);-webkit-transition: all 0.1s ease-in-out;-moz-transition: all 0.1s ease-in-out; -ms-transition: all 0.1s ease-in-out; -o-transition: all 0.1s ease-in-out;transition: all 0.1s ease-in-out;}
598 #wpf-setbox .wpf-setcon .wpf-switch-field label:hover {cursor: pointer;}
599 #wpf-setbox .wpf-setcon .wpf-switch-field input:checked + label {background-color: #43A6DF; -webkit-box-shadow: none; box-shadow: none; color:#fff;} /* #66DD8D */
600 #wpf-setbox .wpf-setcon .wpf-switch-field label:first-of-type {border-radius: 4px 0 0 4px;}
601 #wpf-setbox .wpf-setcon .wpf-switch-field label:last-of-type {border-radius: 0 4px 4px 0;}
602 #wpf-setbox .wpf-setcon .wpf-color-wrap{padding: 7px 5px; width: 300px; min-width: 50%; float: left; box-sizing: border-box;}
603 #wpf-setbox .wpf-setcon .wpf-color-wrap input{width: 80px!important; padding: 3px 5px!important; font-size: 13px!important; text-align: center!important;}
604 #wpf-setbox .wpf-setcon .wpf-color-wrap label{font-weight: normal!important; display: inline-block!important; margin: 0 5px!important;}
605 #wpf-setbox .wpf-setcon h2.wpf-subtitle{padding: 40px 0 10px 0; margin: 0; font-size: 17px; font-weight: normal;color: #43A6DF; border-bottom: 1px dashed #43A6DF;}
606 #wpf-setbox .wpf-setcon .wpf-scol-wrap{padding: 7px 5px; width: 300px; min-width: 50%; box-sizing: border-box;}
607 #wpf-setbox .wpf-setcon .wpf-scol-wrap input{width: 80px!important; padding: 3px 5px!important; font-size: 13px!important; text-align: center!important;}
608 #wpf-setbox .wpf-setcon .wpf-scol-wrap label{font-weight: normal!important; display: inline-block!important; margin: 0 5px!important;}
609
610 #wpf-setbox .wpf-setcon .wpf-opt-row-fullwidth{ flex-direction: column }
611 #wpf-setbox .wpf-setcon .wpf-opt-row-fullwidth .wpf-opt-name,
612 #wpf-setbox .wpf-setcon .wpf-opt-row-fullwidth .wpf-opt-input{ width: 100% }
613
614 div.wpf-subtitle{padding: 15px 10px 15px 2px; margin: 0; font-size: 19px; font-weight: normal;color: #43A6DF; border-bottom: 1px dashed #43A6DF;}
615 div.wpf-subtitle .wpd-info{color: #666; margin: 8px 0 0 0;}
616 div.wpf-subtitle strong{display: block; margin: 5px 0 0 0; font-size: 14px; font-weight: normal; color: #666;}
617 h4.wpf-subtitle{ padding: 15px 0 10px 0; margin: 0; font-size: 16px; font-weight: normal; color: #43A6DF; border-bottom: 1px dashed #43A6DF;}
618
619 /*.wpf-enabled{background-image: url('../img/editor/active.png');}*/
620 /*.wpf-disabled{background-image: url('../img/editor/passive.png');}*/
621 .wpf-editor-toolbar{display: flex; margin-top: 15px; flex-direction: row; justify-content: flex-start; flex-wrap: wrap;} /*#f06653*/
622 .wpf-editor-disable{cursor:pointer; margin-top:5px; background: #f5f5f5; font-size: 13px; font-weight: 600; padding: 2px 15px; line-height: 18px; border-radius: 3px;}
623 .wpf-editor-button{cursor:pointer; margin-top:5px; width: 30px; height: 23px; background-size:auto 23px; border: 1px solid #eee; margin-right: 5px; background-repeat: no-repeat;}
624 .wpf-editor-attachment{display:block; margin-top:5px; /*background-image: url('../img/editor/attachment.png');*/ width: 30px; height: 23px; background-size:auto 23px; border: 1px solid #eee; margin-right: 5px; background-repeat: no-repeat;}
625
626 #wpf-setbox .wpf-spam-attach.right-box { width:52%; min-width:500px;max-height:370px; overflow-y:auto; }
627 #wpf-setbox .wpf-spam-attach.left-box { width:45%; min-width:300px;}
628 #wpf-setbox .wpf-spam-attach .wpf-spam-attach-dir{ color:#4742C5; display:block; text-align:right; }
629
630 .iconpicker-container{
631 display: flex;
632 align-items: center;
633 }
634
635 .wpf-fa-ico-primary-bg{
636 background-color: #337AB7;
637 color: #FFFFFF;
638 }
639 .wpf-fa-ico-preview{
640 display: flex;
641 justify-content: center;
642 align-items: center;
643 padding: 0 10px;
644 background-color: #EFEFEF;
645 position: absolute;
646 right: 2px;
647 top: 2px;
648 bottom: 2px;
649 min-width: 40px;
650 }
651
652 .wpf-input-group-addon {
653 padding: 6px 12px;
654 font-size: 14px;
655 font-weight: 400;
656 line-height: 1;
657 color: #555;
658 text-align: center;
659 background-color: #eee;
660 border: 1px solid #ccc;
661 border-radius: 4px;
662 white-space: nowrap;
663 margin-left: -44px;
664 border-collapse: separate;
665 }
666
667 .wpfo-settings-style-colorid{
668 line-height: 38px;
669 min-height: 32px;
670 font-size: 14px;
671 font-weight: bold;
672 }
673
674 .wpfo-settings-style-colorid-hash{
675 border-bottom: 2px solid #EEEEEE;
676 margin-bottom: 5px;
677 }
678
679 .iconpicker-popover{
680 box-shadow: 1px 6px 26px 2px rgb(0 0 0 / 50%);
681 z-index: 99999;
682 }
683
684 #wpf-admin-wrap .wpf-selected{
685 background-color: rgb(246, 242, 165);
686 transition: background-color 0.5s ease;
687 }
688
689 #wpf-admin-wrap .wpf-opt-row-cover .wpf-opt-input{
690 width: 100% !important;
691 }
692
693 #wpf-admin-wrap .wpf-opt-row-cover .wpf-cover{
694 width: 100%;
695 position: relative;
696 height: 220px;
697 border-radius: 15px;
698 background-size: cover;
699 background-position: center;
700 }
701
702 #wpf-admin-wrap .wpf-edit-cover{
703 position: absolute;
704 right: 10px;
705 bottom: 10px;
706 font-size: 20px;
707 padding: 0 4px;
708 margin: 0;
709 line-height: 18px;
710 color: #555;
711 cursor: pointer;
712 }
713
714 #wpf-admin-wrap .wpf-edit-cover i{background-color: #ccc; opacity: 0.7; padding: 1px 2px; border-radius: 3px;}
715 #wpf-admin-wrap .wpf-box-wrap .wpf-box-head img{max-width: 70px; }
716 #wpf-admin-wrap .wpf-addon-table {
717 width: 100%;
718 border: none;
719 padding: 0;
720 margin: 0 auto;
721 box-sizing: border-box;
722 }
723
724 #wpf-admin-wrap .wpf-addon-table tr:nth-child(2n+1) {
725 background: #f9f9f9 none repeat scroll 0 0;
726 }
727
728 #wpf-admin-wrap .wpf-addon-table td,
729 #wpf-admin-wrap .wpf-addon-table th {
730 padding: 10px 15px;
731 text-align: left;
732 vertical-align: top;
733 }
734
735 #wpf-admin-wrap .wpf-addon-table label {
736 font-size: 14px;
737 }
738
739 #wpf-admin-wrap .wpfog {
740 color: #F45B00;
741 white-space: nowrap;
742 }
743
744 #wpf-admin-wrap .wpfogx {
745 font-weight: bold;
746 font-family: Gotham, "Helvetica Neue", Helvetica, Arial, sans-serif;
747 cursor: help;
748 font-size: 12px;
749 }
750
751 #wpf-admin-wrap .wpf-email-shortcodes {
752 font-weight: normal;
753 font-size: 12px;
754 color: #666666;
755 list-style: disc;
756 margin-left: 20px;
757 }
758
759 #wpf-admin-wrap .wpf-email-shortcodes li {
760 padding: 0;
761 margin: 0;
762 line-height: 18px;
763 }
764
765 .wpforo-menu-shortcodes .wpforo-menu-shortcodes-head{
766 cursor: pointer;
767 opacity: 0.8;
768 }
769
770 .wpforo-menu-shortcodes .wpforo-menu-shortcodes-head:hover{
771 opacity: 1;
772 }
773
774 /* settings search input field autocomplate style */
775 /*the container must be positioned relative:*/
776 .autocomplete {
777 position: relative;
778 display: inline-block;
779 }
780
781 input {
782 border: 1px solid transparent;
783 background-color: #f1f1f1;
784 padding: 10px;
785 font-size: 16px;
786 }
787
788 input[type=text] {
789 background-color: #f1f1f1;
790 }
791
792 input[type=submit] {
793 background-color: DodgerBlue;
794 color: #fff;
795 cursor: pointer;
796 }
797
798 .autocomplete-items {
799 position: absolute;
800 border: 1px solid #d4d4d4;
801 border-bottom: none;
802 border-top: none;
803 top: 100%;
804 right: 0;
805 text-align: left;
806 max-height: 420px;
807 width: 100%;
808 overflow-x: hidden;
809 overflow-y: auto;
810 }
811
812 .autocomplete-items div {
813 padding: 10px;
814 cursor: pointer;
815 background-color: #fff;
816 border-bottom: 1px solid #d4d4d4;
817 }
818
819 /*when hovering an item:*/
820 .autocomplete-items div:hover {
821 background-color: #e9e9e9;
822 }
823
824 /*when navigating through the items using the arrow keys:*/
825 .autocomplete-active {
826 background-color: DodgerBlue !important;
827 color: #ffffff;
828 }
829
830 .autocomplete-active a{
831 color: #FFFFFF;
832 }
833
834 #wpf-forum-cover{box-sizing: border-box; width: 100%; height: 150px; border-radius: 10px; margin: 20px 0; border: 2px dashed #ccc; padding: 10px; display:flex; justify-content: center; align-items: center; background-position: center; background-size: cover; background-color: #fafafa;}
835
836 /* Extra RTL */
837 [dir=rtl] #wpf-dash .wpf-overview .wpf-stat-user .wpf-user-table td:nth-child(1) {text-align: right;}
838 [dir=rtl] #wpf-dash .wpf-overview .wpf-stat-user .wpf-user-table th:nth-child(1) {text-align: right;}
839 [dir=rtl] #wpf-setbox .wpf-setbox-body input[type="text"] {padding-right: 25px;}
840 [dir=rtl] #wpf-setbox .wpf-setbox-body .wpf-box{float: right;margin: 0 0 25px 1%;}
841 [dir=rtl] #wpf-setbox .wpf-setbox-body .wpf-setbar{width: 332px;}
842 [dir=rtl] #wpf-setbox .wpf-setbox-body .wpf-box .wpf-box-foot .wpf-box-arrow img {-webkit-transform:rotate(180deg);-moz-transform: rotate(180deg);-ms-transform: rotate(180deg);-o-transform: rotate(180deg);transform: rotate(180deg);}
843 [dir=rtl] #wpf-setbox .wpf-setbox-body .wpf-box .wpf-box-foot .wpf-box-arrow{padding-right: 1px; padding-left: 20px;}
844 [dir=rtl] #wpf-setbox .wpf-setcon .wpf-opt-row .wpf-opt-doc {text-align: left;}
845
846 @media screen and (min-width:1601px){
847 #wpf-setbox .wpf-settings-home .wpf-box{width: 15.2%; margin: 0 1.2% 25px 0;}
848 }
849 @media screen and (max-width:1600px){
850 #wpf-setbox .wpf-settings-home .wpf-box{width: 19%; margin: 0 1% 25px 0;}
851 #wpf-setbox .wpf-setcon .wpf-opt-row .wpf-opt-input {min-width: 150px;}
852 }
853 @media screen and (max-width:1440px){
854 #wpf-setbox .wpf-settings-home .wpf-box{width: 23%; margin: 0 2% 25px 0;}
855 }
856 @media screen and (max-width:1280px){
857 #wpf-setbox .wpf-settings-home .wpf-box{width: 30%; margin: 0 3% 25px 0;}
858 #wpf-setbox .wpf-setbox-body .wpf-setcon{width: 100%; float: none; margin-bottom: 20px;}
859 #wpf-setbox .wpf-setbox-body .wpf-setbar{width: 100%; float: none;}
860 }
861 @media screen and (max-width:1024px){
862 #wpf-dash .wpf-overview{display: block;}
863 #wpf-dash .wpf-overview .wpf-stat-brief,
864 #wpf-dash .wpf-overview .wpf-stat-graph,
865 #wpf-dash .wpf-overview .wpf-stat-user,
866 #wpf-dash .wpf-overview .wpf-stat-subs{width: 100%!important;}
867 #wpf-dash .wpf-credits{display: block;}
868 #wpf-setbox .wpf-setbox-body input[type="text"],
869 #wpf-setbox .wpf-setbox-body input[type="url"]{width: 100%;}
870 #wpf-setbox .wpf-setcon .wpf-switch-field label {float: none;display: inline-block;min-width: 90%;padding: 2px 0;}
871 #wpf-setbox .wpf-setcon .wpf-color-wrap{width: 30% !important;}
872 }
873 @media screen and (max-width:800px){
874 .wpf-admin-wrap{padding-right: 10px;}
875 #wpf-setbox .wpf-settings-home .wpf-box {width: 47%;margin: 0 3% 25px 0;}
876 .wpf-board{flex-direction: column;}
877 .wpf-board-left{width: 100%}
878 .wpf-board-right{width: 100%; margin-left: 0;}
879 }
880 @media screen and (max-width:600px){
881 #wpf-setbox .wpf-setbox-body .wpf-section{display: block;}
882 #wpf-setbox .wpf-setbox-body input[type="text"] {width: 100%;display: block;margin-top: 10px;min-height: auto;}
883 #wpf-setbox .wpf-setbox-head .wpf-head-info {font-size: 14px;margin-top: 12px;}
884 }
885 @media screen and (max-width:480px){
886 #wpf-setbox .wpf-settings-home .wpf-box{width: 100%; margin: 0 0 25px 0;}
887 }
888
889 /****************************************************/
890 /*********** Moderation Report Row ******************/
891 /****************************************************/
892
893 /* Fix striping for moderation table - account for inserted report rows */
894 /* Post rows are at positions 1,3,5,7... Report rows at 2,4,6,8... */
895 /* We want: 1st post=white, 2nd post=grey, 3rd post=white, etc. */
896 .wp-list-table.striped > tbody > tr:nth-child(4n+1):not(.wpf-moderation-report-row) {
897 background-color: #fff !important;
898 }
899 .wp-list-table.striped > tbody > tr:nth-child(4n+3):not(.wpf-moderation-report-row) {
900 background-color: #f6f7f7 !important;
901 }
902
903 /* Report row container - hidden by default */
904 .wpf-moderation-report-row {
905 background: transparent !important;
906 }
907 .wpf-moderation-report-row:hover {
908 background: transparent !important;
909 }
910
911 /* Completely hide empty report rows (still counted for nth-child) */
912 .wpf-moderation-report-row.wpf-moderation-report-empty {
913 display: none;
914 }
915
916 .wpf-moderation-report-cell {
917 padding: 0 !important;
918 border-left: 3px solid #fd7e14 !important;
919 overflow: hidden;
920 }
921 .wpf-moderation-report-container {
922 padding: 12px 15px;
923 display: flex;
924 flex-direction: column;
925 gap: 10px;
926 max-height: 0;
927 overflow: hidden;
928 opacity: 0;
929 transition: max-height 0.3s ease-out, opacity 0.25s ease-out, padding 0.3s ease-out;
930 padding-top: 0;
931 padding-bottom: 0;
932 }
933
934 /* Show report when hovering the post row above or the report row itself */
935 tr:not(.wpf-moderation-report-row):hover + .wpf-moderation-report-row .wpf-moderation-report-container,
936 .wpf-moderation-report-row:hover .wpf-moderation-report-container {
937 max-height: 800px;
938 opacity: 1;
939 padding-top: 12px;
940 padding-bottom: 12px;
941 }
942
943 /* Show orange left border on post row when viewing its report */
944 /* When hovering a post row that has a non-empty report following it */
945 tr:not(.wpf-moderation-report-row):has(+ .wpf-moderation-report-row:not(.wpf-moderation-report-empty)):hover > :first-child,
946 /* When hovering the report row, highlight the post row above using :has() */
947 tr:not(.wpf-moderation-report-row):has(+ .wpf-moderation-report-row:not(.wpf-moderation-report-empty):hover) > :first-child {
948 border-left: 3px solid #fd7e14 !important;
949 }
950
951 /* Individual report block */
952 .wpf-mod-report {
953 display: flex;
954 gap: 15px;
955 background: #fff;
956 border-radius: 0;
957 padding: 12px 15px;
958 font-size: 13px;
959 line-height: 1.5;
960 }
961 .wpf-mod-report-ai.wpf-mod-status-detected {
962 border-color: #f5c6cb;
963 background: #fff0f2;
964 }
965 .wpf-mod-report-ai.wpf-mod-status-suspected {
966 border-color: #ffcc80;
967 background: #fff8e6;
968 }
969 .wpf-mod-report-ai.wpf-mod-status-uncertain {
970 border-color: #ffeeba;
971 background: #fffcf0;
972 }
973 .wpf-mod-report-ai.wpf-mod-status-clean {
974 border-color: #c3e6cb;
975 background: #f0fff4;
976 }
977 .wpf-mod-report-builtin {
978 border-color: #b8daff;
979 background: #f0f7ff;
980 }
981
982 /* Type column (left side) */
983 .wpf-mod-report-type {
984 display: flex;
985 flex-direction: column;
986 align-items: center;
987 justify-content: flex-start;
988 min-width: 90px;
989 padding-right: 15px;
990 border-right: 1px solid rgba(0,0,0,0.08);
991 gap: 6px;
992 }
993 .wpf-mod-type-icon {
994 display: flex;
995 align-items: center;
996 justify-content: center;
997 }
998 .wpf-mod-type-icon svg {
999 width: 24px;
1000 height: 24px;
1001 }
1002 .wpf-mod-type-label {
1003 font-size: 11px;
1004 font-weight: 600;
1005 text-align: center;
1006 color: #555;
1007 text-transform: uppercase;
1008 letter-spacing: 0.3px;
1009 }
1010
1011 /* Content column (right side) */
1012 .wpf-mod-report-content {
1013 flex: 1;
1014 display: flex;
1015 flex-direction: column;
1016 gap: 8px;
1017 }
1018
1019 /* Header with status badges */
1020 .wpf-mod-report-header {
1021 display: flex;
1022 flex-wrap: wrap;
1023 gap: 10px;
1024 align-items: center;
1025 }
1026 .wpf-mod-status {
1027 font-size: 11px;
1028 font-weight: 600;
1029 text-transform: uppercase;
1030 padding: 3px 8px;
1031 border-radius: 3px;
1032 background: rgba(0,0,0,0.08);
1033 }
1034 .wpf-mod-status-detected {
1035 background: rgba(220,53,69,0.15);
1036 color: #721c24;
1037 }
1038 .wpf-mod-status-suspected {
1039 background: rgba(255,152,0,0.2);
1040 color: #e65100;
1041 }
1042 .wpf-mod-status-uncertain {
1043 background: rgba(255,193,7,0.25);
1044 color: #856404;
1045 }
1046 .wpf-mod-status-clean {
1047 background: rgba(40,167,69,0.15);
1048 color: #155724;
1049 }
1050 .wpf-mod-status-builtin {
1051 background: rgba(13,110,253,0.15);
1052 color: #084298;
1053 }
1054 .wpf-mod-score,
1055 .wpf-mod-confidence,
1056 .wpf-mod-action {
1057 font-size: 12px;
1058 color: #555;
1059 padding: 2px 6px;
1060 background: rgba(0,0,0,0.04);
1061 border-radius: 3px;
1062 }
1063
1064 /* Summary section */
1065 .wpf-mod-report-summary {
1066 font-size: 13px;
1067 color: #333;
1068 line-height: 1.5;
1069 padding: 8px 10px;
1070 background: rgba(0,0,0,0.02);
1071 border-radius: 4px;
1072 border-left: 2px solid rgba(0,0,0,0.1);
1073 }
1074 .wpf-mod-report-summary strong {
1075 color: #444;
1076 margin-right: 4px;
1077 }
1078
1079 /* Indicators list */
1080 .wpf-mod-report-indicators {
1081 font-size: 13px;
1082 }
1083 .wpf-mod-report-indicators strong {
1084 display: block;
1085 margin-bottom: 6px;
1086 color: #444;
1087 }
1088 .wpf-mod-indicator-list {
1089 list-style: none;
1090 margin: 0;
1091 padding: 0;
1092 display: flex;
1093 flex-direction: column;
1094 gap: 4px;
1095 }
1096 .wpf-mod-indicator {
1097 padding: 6px 10px;
1098 background: rgba(0,0,0,0.02);
1099 border-radius: 4px;
1100 border-left: 3px solid #ccc;
1101 }
1102 .wpf-mod-indicator.wpf-mod-severity-high {
1103 border-left-color: #dc3545;
1104 background: rgba(220,53,69,0.05);
1105 }
1106 .wpf-mod-indicator.wpf-mod-severity-medium {
1107 border-left-color: #fd7e14;
1108 background: rgba(253,126,20,0.05);
1109 }
1110 .wpf-mod-indicator.wpf-mod-severity-low {
1111 border-left-color: #6c757d;
1112 }
1113 .wpf-mod-indicator-category {
1114 font-weight: 600;
1115 text-transform: capitalize;
1116 color: #333;
1117 display: block;
1118 }
1119 .wpf-mod-indicator-desc {
1120 color: #666;
1121 font-size: 12px;
1122 display: block;
1123 margin-top: 2px;
1124 }
1125
1126 /* Meta footer */
1127 .wpf-mod-report-meta {
1128 display: flex;
1129 flex-wrap: wrap;
1130 gap: 12px;
1131 padding-top: 8px;
1132 border-top: 1px solid rgba(0,0,0,0.06);
1133 font-size: 11px;
1134 color: #888;
1135 }
1136 .wpf-mod-quality,
1137 .wpf-mod-credits,
1138 .wpf-mod-context,
1139 .wpf-mod-date {
1140 display: inline-flex;
1141 align-items: center;
1142 gap: 4px;
1143 }
1144 .wpf-mod-context {
1145 color: #198754;
1146 font-weight: 500;
1147 }
1148 .wpf-mod-context::before {
1149 content: "";
1150 }
1151
1152 /* Responsive adjustments */
1153 @media screen and (max-width: 782px) {
1154 .wpf-mod-report {
1155 flex-direction: column;
1156 gap: 10px;
1157 }
1158 .wpf-mod-report-type {
1159 flex-direction: row;
1160 min-width: auto;
1161 padding-right: 0;
1162 padding-bottom: 10px;
1163 border-right: none;
1164 border-bottom: 1px solid rgba(0,0,0,0.08);
1165 }
1166 .wpf-mod-report-header {
1167 flex-direction: column;
1168 align-items: flex-start;
1169 gap: 6px;
1170 }
1171 }
1172
1173 .wpf-manage-subscription{
1174 background: #6753FF; color: #fff; border-color: #2E1DAE;
1175 }
1176 /* ==========================================================================
1177 WordPress 7.0+ Dashicons Alignment Fix
1178 WP 7.0 changed: .wp-core-ui .button .dashicons { line-height: 1.9; vertical-align: top; }
1179 This breaks dashicon vertical alignment in wpForo admin buttons.
1180 ========================================================================== */
1181 #wpf-admin-wrap .button .dashicons,
1182 #wpf-admin-wrap .button-primary .dashicons,
1183 #wpf-admin-wrap .button-secondary .dashicons,
1184 .wp-core-ui .wpforo-ai-wrap .button .dashicons,
1185 .wp-core-ui .wpforo-ai-wrap .button-primary .dashicons,
1186 .wp-core-ui .wpforo-ai-wrap .button-secondary .dashicons {
1187 line-height: 1;
1188 vertical-align: text-bottom;
1189 }
1190