/**
 * WP BASE Admin CSS
 *
 * @package     WP BASE
 * @subpackage  Admin CSS
 * @copyright   Copyright (c) 2018-2023, Hakan Ozevin
 * @license     http://opensource.org/licenses/gpl-2.0.php GNU Public License
*/

/* General Styles -------------------------------------------------------------- */

i.mce-i-icon {
	font: 400 20px/1 dashicons;
	padding: 0;vertical-align: top;
	speak: none;
	-webkit-font-smoothing: antialiased;
	-moz-osx-font-smoothing: grayscale;
	margin-left: -2px;
	padding-right: 2px
}

.app-page span.dashicons {
    margin-right: 3px;
}

.manage-column.column-apb{
	width:5.5em;
}

ul#wp-admin-bar-admin-wpbaseshortcodes-default li#wp-admin-bar-admin-help {
	border-bottom:1px solid darkgrey;
}

.app-notice{
	position:relative;
}

a.notice-dismiss {
	text-decoration:none;outline:none;-webkit-box-shadow:none;
}

.app_dropdown_pages{
	width:100%;
}

.app-page abbr,
acronym,
dfn {
	border-bottom: 1px dotted #666;
	cursor: help;
}

.app-page abbr[title] {
	border-bottom: 1px dotted;
	text-decoration: none;
}

.app-page input,
.app-page select {
	-webkit-box-sizing: border-box;
	-moz-box-sizing: border-box;
	box-sizing: border-box;
}

.app-page .ui-corner-all {
	border-radius: 0;
}

.app-page .ui-widget-header,
.app-page .ui-state-default,
.app-page .ui-widget-content .ui-state-default,
.app-page .ui-widget-header .ui-state-default,
.app-dialog .ui-widget-header .ui-state-default,
.ui-multiselect-header.ui-widget-header,
.ui-multiselect-menu .ui-widget-content,
.ui-widget .ui-multiselect-checkboxes .ui-state-hover,
.qtip-titlebar.ui-widget-header.ui-tooltip-header {
	background-image: none;
}

.app-no-header .ui-multiselect-header:not(.ui-multiselect-hasfilter) {
	display: none;
}

.app-dialog.ui-dialog,
.app-terms.ui-dialog {
	padding: 0;
}

.app-dialog.ui-dialog .ui-dialog-titlebar-close {
	text-indent: -9999px;
}

.app-dialog .ui-dialog-titlebar,
.app-terms .ui-dialog-titlebar {
    background-image: none;
    border-radius: 0;
    border: 0;
}

.app-new-alt.ui-dialog .ui-dialog-buttonpane .ui-dialog-buttonset {
    display: flex;
    justify-content: space-around;
    width: 100%;
}

.app-page .ui-widget {
	font-family: unset;
}

.app-1 {
	width: 100%;
	display: block;
}

.app-2col {
	width: 50%;
}

.app-3col {
	width: 33.3333%;
}

.app-4col {
	width: 25%;
}

.app-5col {
	width: 20%;
}

.app-30 {
	width: 30px;
}

.app-50 {
	width: 50px;
}

.app-600 {
	width: 600px;
	display: block;
}

.app-200 {
	width: 200px;
}

.app-btm a {
	display: inline-flex;
}

.app-btm {
	vertical-align: bottom
}

.app-b {
	font-weight: bold;
}

.app-chkbx {
	margin: 5px 0 0 50px;
	text-align: left;
}

.app-c {
	text-align: center;
}

.app-even {
	background-color: #f9f9f9;
}

.app-fade {
	opacity: 0.3
}

.app-invisible {
	visibility: hidden;
}

.app-form select option:disabled {
	color: #ff0000;
	font-weight: bold
}

.app-form select option.new_alt_schedule {
    color: green;
    font-weight: bold;
}

.app-form select.error {
	background-color: #ff0000;
	font-weight: bold
}

.app-hr {
	/* width: 90%; */
	height: 2px;
	border: 0;
	border-top: 1px solid #ddd;
	border-bottom: 1px solid #fafafa;
	overflow: hidden;
	margin-right: 1em;
	margin-top: 0.6em;
}

.app-pl0 {
	padding-left: 0;
}

table .app-pl10 {
	padding-left: 10px;
}

.app-mb0 {
	margin-bottom: 0;
}

.app-mb30 {
	margin-bottom: 30px;
}

.app-ml10 {
	margin-left: 10px
}

.app-ml {
	margin-left: 30px
}

.app-mr0 {
	margin-right: 0;
}

.app-mr10 {
	margin-right: 10px
}

.app-mr5 {
	margin-right: 5px
}

.app-mrl {
	margin: 0 8px 0 4px;
	position: relative;
	float: left
}

.app-mr {
	margin-right: 30px
}

.app-mtmb {
	margin: 10px 0 10px 0
}

.app-mt {
	margin-top: 10px
}

.app-flex {
	display: flex;
	flex-wrap: wrap;
	align-items: baseline;
}

.app-page .app-option-selected,
.app-page button.ui-multiselect.app-option-selected {
	background-color: #ffff66
}

.app-clearfix:after {
	clear: both;
}

.app-clearfix:before,
.app-clearfix:after {
	content: "\0020";
	display: block;
	height: 0;
	overflow: hidden;
}

.app-prpl {
	padding-right: 12px;
	padding-left: 12px;
	display: flex;
	gap: 20px;
}

.app-small {
	font-size: 12px;
	text-align: center;
}

.app-shadow {
	border-radius: 10px 10px 10px 10px;
	box-shadow: 0 0 25px 5px #999;
}

.app-thick {
	border-top: solid 1px grey;
}

.reverse {
	transform: scale(-1, 1);
}

@media screen {
	.app-print-only {
		display: none;
	}
}

.app-right {
	text-align: right;
}

.app-display-none {
	display: none !important;
}

.app-bold {
  font-weight: bold;
}

.app-page input:read-only,
.app-front-admin input:read-only {
    // cursor: not-allowed;
}

/* WP 5.3 Compatibility  -------------------------------------------------------------- */

.app-page input[type="text"] {
 	line-height: initial;
}

.app-page button.ui-multiselect {
	box-shadow: 0 0 0 transparent;
    border-radius: 4px;
    border: 1px solid #7e8993;
    background-color: #fff;
    color: #32373c;
	padding: 0 0 0 8px;
	line-height: 28px;
	min-width: 50px;
}

.app-page .ui-multiselect span.ui-icon.ui-icon-triangle-1-s {
	/* WP5.3: The SVG is arrow-down-alt2 from Dashicons. */
	background: #fff url('data:image/svg+xml;charset=US-ASCII,%3Csvg%20width%3D%2220%22%20height%3D%2220%22%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%3E%3Cpath%20d%3D%22M5%206l5%205%205-5%202%201-7%207-7-7%202-1z%22%20fill%3D%22%23555%22%2F%3E%3C%2Fsvg%3E') no-repeat right 0px top 55%;
	background-color: transparent;
	background-size: 16px 16px;
	margin: 6px 3px -6px 0px;
}

.ui-multiselect-header .ui-multiselect-filter input {
	min-height: 15px;
}

.ui-multiselect .ui-multiselect-open{
	line-height: 12px;
}

.ui-multiselect-filter label {
	display: flex;
}

/* Tabs and Datepicker -------------------------------------------------------------- */

.app-tabs.ui-widget-content,
.app-tabs .ui-widget-content,
.app-tabs .ui-tabs .ui-tabs-panel {
	background: #ffffff;
}

.service-tabs-container.ui-tabs .ui-tabs-nav {
    display: flex;
    flex-wrap: wrap;
}

.app-tabs {
	margin-bottom: 20px;
}

table.ui-datepicker-calendar {
	border-collapse: separate;
}

.ui-datepicker-calendar td {
	border: 1px solid transparent;
}

.app-page .ui-datepicker td a {
    text-align: center;
}

.ui-datepicker .ui-datepicker-calendar .ui-state-highlight a,
.annual_holiday {
	background: #0085ba none;
	color: white;
}

.ui-sortable-helper {
	display: table
}

.app_annual_alt {
	width: 90%
}

#app-your-profile .app-profile-settings input[type="text"],
#app-your-profile .app-profile-settings select,
#app-your-profile .app-profile-settings button {
	width: 25em;
}

#app-your-profile .app-profile-settings select.ui-toolbar {
	width: unset;
	height: unset;
}

#app-your-profile .app-profile-settings button {
	max-width: 350px;
}
/* V3.6.8.1 */
#app-your-profile .app-profile-settings .wp-editor-wrap button {
    width: unset;
}

img.app-main-image {
    display: block;
	width: 200px;
    object-fit: cover !important;
}

img.app-main-avatar {
    width: 100%;
    height: 150px;
    max-width: 150px;
}

.app-services img.app-main-avatar {
	cursor: pointer;
}

.app-services img.app-main-avatar,
.app-workers img.app-main-avatar,
.app-vendors img.app-main-avatar {
    height: 96px;
    max-width: 96px;
}

.app-list-table td.column-image img {
    margin: 0;
    width: auto;
    height: auto;
    max-width: 32px;
    max-height: 32px;
    vertical-align: middle;
	border-radius: 5px;
}

.app-image-upload .image-preview {
	position: relative;
}

.app-image-upload.readonly input {
	opacity: 0.3;
}

.app-image-upload .dashicons.dashicons-trash {
    font-size: 32px;
    position: absolute;
    left: 120px;
    top: 5px;
	cursor: pointer;
	color: orangered;
}

#services-table .app-image-upload .dashicons.dashicons-trash,
.app-workers .app-image-upload .dashicons.dashicons-trash,
.app-vendors .app-image-upload .dashicons.dashicons-trash {
	font-size: 24px;
}

.app-avatar-upload .dashicons.dashicons-trash {
    left: 120px;
}

#services-table .app-image-upload .dashicons.dashicons-trash,
.app-workers .app-avatar-upload .dashicons.dashicons-trash,
.app-vendors .app-avatar-upload .dashicons.dashicons-trash {
    left: 68px;
}

.dashicons.dashicons-trash.app-remove-rule,
.dashicons.dashicons-trash.app-remove-type {
	color: orangered;
	margin-left: 10px;
	cursor: pointer;
}

.dashicons.dashicons-trash.app-remove-credit {
	color: orangered;
	cursor: pointer;
}

.app-upload-image-btn::-webkit-file-upload-button {
  visibility: hidden;
}

.app-upload-image-btn::before {
  content: 'Choose Image';
  content: attr(data-content);
  display: inline-block;
  background: linear-gradient(top, #f9f9f9, #e3e3e3);
  border: 1px solid #999;
  border-radius: 3px;
  padding: 5px 8px;
  outline: none;
  white-space: nowrap;
  -webkit-user-select: none;
  cursor: pointer;
  text-shadow: 1px 1px #fff;
  font-weight: 700;
  font-size: 10pt;
  max-width: 132px;
  width: 100%;
  text-align: center;
}

.app-upload-image-btn,
.app-avatar-upload .app-upload-image-btn,
.app-avatar-upload .app-upload-image-btn::before {
	max-width: 150px;
}

.app-workers .app-upload-image-btn,
.app-vendors .app-upload-image-btn {
	max-width: 96px;
}

.app-workers .app-upload-image-btn::before,
.app-vendors .app-upload-image-btn::before {
	padding: 5px 6px;
	max-width: 82px;
	font-weight: 500;
}

.app-upload-image-btn:hover::before {
  border-color: black;
}

.app-upload-image-btn:active::before {
  background: -webkit-linear-gradient(top, #e3e3e3, #f9f9f9);
}

.app-image-upload .dashicons.dashicons-trash.has-pholder {
	display: none;
}

#app-your-profile thead {
	text-align: left;
}

.app-custom-texts td.key {
	word-break: break-all;
}

@media screen and (max-width: 782px) {
	table.app-custom-texts, table.app-settings-list, table.app-custom-texts textarea {
		font-size: x-small;
	}
	table.app-custom-texts textarea {
		word-break: break-all;
	}

}

/* Transactions Table -------------------------------------------------------------- */

.app-transactions .ui-widget-content a,
.app-form .ui-widget-content a {
	color: #0073aa;
	text-decoration: none;
}

table.app-transactions th.check-column {
	text-align: center;
}

table.app-transactions.dataTable.display tbody td,
table.app-transactions.dataTable.display tbody th {
	border: none
}

.app-page.users_page_your_bookings .dashicons-money,
.app-front-admin .dashicons-money {
	display: none;
}

.app-tr-tooltip {
    table-layout: fixed;
}

.app-tr-tooltip th {
    font-size: 10px;
}

.app-helptip {
    margin-left: 3px;
    position: absolute;
    right: 0;
    /* top: 50%; */
	color: #666;
    display: inline-block;
    font-size: 1.4em;
    font-style: normal;
    height: 16px;
    line-height: 16px;
    position: relative;
    vertical-align: text-top;
    width: 16px;
}

.app-helptip::after {
    font-family: Dashicons;
    font-weight: 400;
    text-transform: none;
    line-height: 1;
    -webkit-font-smoothing: antialiased;
    text-indent: 0px;
    position: absolute;
    top: 0px;
    left: 0px;
    width: 100%;
    height: 100%;
    text-align: center;
    content: "\f348";
    cursor: help;
    font-variant: normal;
    margin: 0px;
}

/* Schedules -------------------------------------------------------------- */

.app-front-admin {
    box-sizing: content-box;
}

.app-front-admin #poststuff {
	min-width: unset;
}

.app-wrap-admin,
.app-front-admin .app-wrap {
	float: left;
	margin-top: 0;
	min-width: 240px;
}

.app-monthly-admin,
.app-weekly-admin,
.app-front-admin .app-monthly-wrapper:not(.app-long-bookings-wrapper),
.app-front-admin .app-schedule-wrapper {
	margin: 0 15px 10px 15px;
}

.app-wrap-admin .app-title,
.app-front-admin .app-wrap .app-title {
	margin: 10px 15px;
	font-size: 1.1em
}

.app-wrap-admin .app-list,
.app-front-admin .app-wrap .app-list {
	margin-top: 0;
	padding-right: 30px;
}

.app-wrap-admin h3,
.app-front-admin .app-wrap h3 {
	margin: 0;
	font-weight: bold;
}

.app-wrap-admin th,
.app-front-admin .app-wrap th {
	padding: 0;
}

.app-pagination {
	margin: 0 15px;
}

.app-page .app-legend {
	margin-left: 15px;
}

.wrap.app-business-settings {
    margin: 10px 30px 0 2px;
}

.wrap.app-business-settings .nav-tab-wrapper {
	margin-bottom: 10px
}

.app-has-inline-cell table tr td.app-all {
	position: relative;
}

.app-cell-inline span {
	font-size: 12px;
	display: block;
	line-height: 16px;
}

.app-cell-inline .app-cell-edit span {
	display: inline-block;
	cursor: pointer;
    text-decoration: none;
}

.app-cell-inline .app-cell-edit .dashicons-edit {
	width: 15px;
}

.app-has-inline-cell .app-cell-inline {
	background: rgba(0,183,51,0.25);
}

.app-cell-inline.app-all {
	display: inline-block;
	width: 40%;
	position: absolute;
	text-align: center;
    font-size: 10px;
}

table.app-schedule-daily .app-cell-inline.app-all {
	width: 11%;
}
.app-cell-inline.app-all[data-order="0"] {
	left: 0;
}
.app-cell-inline.app-all[data-order="1"] {
	left: 12%;
}
.app-cell-inline.app-all[data-order="2"] {
	left: 24%;
}
.app-cell-inline.app-all[data-order="3"] {
	left: 36%;
}
.app-cell-inline.app-all[data-order="4"] {
	left: 48%;
}
.app-cell-inline.app-all[data-order="5"] {
	left: 60%;
}
.app-cell-inline.app-all[data-order="6"] {
	left: 72%;
}
.app-cell-inline.app-all[data-order="7"] {
	left: 84%;
}
.app-cell-worker, .app-cell-status {
	text-transform: uppercase;
	font-weight: 700;
}
span.app-cell-service {
    font-size: 11px;
}
.app-inline-cell-short {
	overflow: hidden;
}

/* Bookings Table -------------------------------------------------------------- */

.app-page .tablenav .tablenav-pages a,
.app-page .tablenav-pages span.current  {
	text-decoration: none;
	padding: 3px 6px;
}

.app-page .tablenav .tablenav-pages a,
.app-page .tablenav-pages-navspan {
	display: inline-block;
	min-width: 17px;
	border: 1px solid #ccc;
	padding: 5px;
	background: #e5e5e5;
	font-size: 16px;
	line-height: 1;
	font-weight: 400;
	text-align: center;
}

.app-page .tablenav-pages-navspan {
	height: 16px;
	border-color: #ddd;
	background: #f7f7f7;
	color: #a0a5aa;
}

.app-page .tablenav .tablenav-pages a:hover,
.app-page .tablenav .tablenav-pages a:focus {
	border-color: #5b9dd9;
	color: #fff;
	background: #00a0d2;
	box-shadow: none;
	outline: none;
}

.app-page .tablenav .displaying-num {
	margin-right: 7px;
}

.app-page .tablenav .one-page .displaying-num {
	display: inline-block;
	margin-top: 5px;
	margin-right: 0;
}

.app-page .tablenav .actions {
	overflow: hidden;
	padding: 2px 8px 0 0;
}

.app-page .tablenav-pages {
	margin-top: 0
}

.app-status-elm {
	width: 100%;
}

td.column-db_id,
td.column-note {
	text-align: center;
}

tr.is-expanded td.column-note {
	text-align: left;
}

table.app-manage {
	border-spacing: 0;
	table-layout: fixed;
}

table.app-manage thead th,
table.app-manage tfoot th,
table.app-transactions thead th,
table.app-transactions tfoot th,
table.app-vendors thead th,
table.app-vendors tfoot th,
table.app-commissions thead th,
table.app-commissions tfoot th {
	font-size: 12px;
	background-color: #f8f9fa;
}

.app-manage h4 {
    font-size: 1em;
}

tr.app-tr {
	vertical-align: middle;
}

tr.app-tr.multi-app-child {
	opacity: 0.7
}

.app-form table.form-table tr {
	vertical-align: top;
}

.app-form table.dataTable thead th {
	padding: 8px;
}

#services-table th.check-column,
.app-manage th.check-column,
.app-addons th.check-column,
#app-commissions th.check-column,
#app-clients th.check-column,
#app-workers th.check-column,
#app-vendors th.check-column {
	padding: 10px 6px 10px 18px !important;
}

.app-page table.dataTable tfoot th {
	padding-left: 8px;
}

.app-page td.column-delete.check-column {
	padding-left: 26px
}

.app-abandon,
.app-owner {
	display: block;
	font-size: 9px;
}

table.app-manage thead th.column-client,
table.app-manage tfoot th.column-client {
	padding-left: 25px;
}

.app-manage td.column-client {
	padding-left: 0
}

td.column-provider.worker-free {
	opacity: 0.5
}

.app-manage-row .button {
	min-width: 62px;
}

.app-manage-row select {
	float: none;
	font-size: 9px;
	height: 28px;
	padding: 0 24px 0 8px;
}

.app-manage select {
	max-width: 300px;
	width: 100%;
	padding: 0 24px 0 8px;
}

.app-manage select.app_users,
.app-manage select.app_extras {
	width: 80%;
}

.app-manage button.app_users,
.app-manage button.app_extras {
	line-height: 22px;
	padding-top: 3px;
	padding-bottom: 3px;
}

.app_iedit_parent input {
	width: 65%
}

.app-manage .inline-edit-col .input-text-wrap {
	line-height: 1.5;
	padding-top: 0.4em;
}

.inline-edit-row {
    box-shadow: inset 0 0 2px 2px grey;
}

.app_admin_service_properties.inline-edit-row {
	box-shadow: none;
}

.app-manage .inline-edit-row fieldset .app_iedit_time .input-text-wrap {
	display: flex;
}

.app-manage .inline-edit-row fieldset label.app_iedit_time input[type="text"] {
	width: 60%;
	height: auto;
}

.inline-edit-row fieldset label.app_iedit_time select,
.inline-edit-row fieldset label.app_iedit_time input.app-admin-time {
	/* width: 25%; */
	width: 40%;
	height: auto;
	margin-right: 0;
}

.inline-edit-row fieldset label.app_iedit_time select.event-dt {
	width: 100%;
	height: auto;
}

.inline-edit-row fieldset label textarea {
	width: 64%;
	width: calc(95% - 8.5em);
}

.app-iedit-email-actions label {
	float: left;
	margin-top: 5px;
}

.app-iedit-email-actions {
	margin: 10px 20px 0 0;
	display: inline-flex;
	flex-wrap: wrap;
}

#wpbody-content .app-manage .inline-edit-col-left {
	min-width: 220px;
}

.app_iedit_start_date input,
.app_iedit_end_date input {
	width: 100%;
}

#wpbody-content .app-manage .inline-edit-col-center {
	min-width: 220px;
}

#wpbody-content .app-manage .inline-edit-col-right {
	min-width: 220px;
}

#wpbody-content div.actions {
	display: block;
}

.app-locked .locked-indicator,
.app-locked .locked-info {
    display: block;
}

.locked-info {
    display: none;
}

.locked-indicator {
    display: none;
    margin-left: -3px;
    height: 20px;
    width: 16px;
}

.locked-indicator-icon:before {
    color: #82878c;
    content: "\f160";
    display: inline-block;
    font: normal 20px/1 dashicons;
    speak: none;
    vertical-align: middle;
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
}

tr.app-locked .check-column input[type=checkbox],
tr.app-locked .check-column label,
tr.app-locked .row-actions .inline {
    display: none;
}

.user-inner .booking-info {
	display: block;
}

.user-inner,
.service-inner,
.worker-inner {
	display: flex;
}

.service-inner,
.worker-inner {
	flex-direction: column;
}

.app-manage .inline-edit-row .input-text-wrap input[type=text],
.app-manage .inline-edit-row .input-text-wrap textarea {
	width: 100%;
}

.app-manage .inline-edit-row fieldset label span.title {
	width: 8em;
}

.app-manage .inline-edit-row fieldset label span.input-text-wrap {
	margin-left: 8em;
	margin-right: 1em;
}

.inline-edit-row fieldset label.long span.title {
    line-height: 1.2;
}

.app-manage-row {
	display: flex;
	align-items: center;
	justify-content: space-between;
	align-content: flex-end;
	height: auto;
	margin-bottom: 4px;
}

.app-manage-row.first-row {
	align-items: flex-start;
	margin-top: 6px;
}

.app-manage-row.third-row {
	margin-top: 10px;
	margin-bottom: 8px;
	display: flex;
    align-items: center;
}

.app-manage-first-column .subsubsub {
	margin-top: 0;
}

.app-manage-third-column.tablenav {
	margin: 0;
}

.app-page .app-manage-row div {
	padding-left: 0;
	padding-right: 0;
	margin-right: 10px;
}

.app-page div.app-manage-row div:last-of-type {
	margin-left: auto;
	padding-right: 0;
	margin-right: 0;
}
.wp-base-dev_page_app_commissions .app-page div.app-manage-row.third-row .app-manage-first-column,
.wp-base_page_app_commissions .app-page div.app-manage-row.third-row .app-manage-first-column,
.wp-base-dev_page_app_vendors .app-page div.app-manage-row.third-row .app-manage-first-column,
.wp-base_page_app_vendors .app-page div.app-manage-row.third-row .app-manage-first-column {
	margin-left: 0;
}

.app-list-table.app-workers .inline-edit-row fieldset .inline-edit-col,
.app-list-table.app-vendors .inline-edit-row fieldset .inline-edit-col{
    margin-right: -6px;
}

.app-page.app-workers .app-manage-row.first-row div:last-of-type {
    margin-left: 0;
}

.app-workers .app-manage-row.first-row {
	align-items: center;
    justify-content: flex-end;
}

.app-page .inline-edit-row .input-text-wrap input[type=search] {
    width: 100%;
}

#wpbody-content .app-workers .inline-edit-row fieldset,
#wpbody-content .app-vendors .inline-edit-row fieldset {
	padding-right: 0;
}

.app-workers .app_users_worker {
    font-size: 14px;
}

@media screen and (min-width: 782px) {
	.app-workers.app-page .app-manage-second-column {
		margin-right: 50px;
	}
}

@media screen and (max-width: 782px) {
	#wpbody-content .app-page form {
		display: flex;
		flex-direction: column;
	}
	#wpbody-content .app-ml10 {
		margin-left: 0;
	}
	#wpbody-content .app-page .actions form button,
	#wpbody-content .app-page .actions form select,
	#wpbody-content .app-page .actions form input:not([type=checkbox]) {
		width: 160px;
		margin-right: 0;
	}
	#wpbody-content .app-page .app-manage-row {
		display: flex;
	}
	#wpbody-content .app-page .app-manage-row .subsubsub {
		display: flex;
		flex-wrap: wrap
	}
	#wpbody-content .app-page .tablenav.top {
		margin-top: 0;
	}
	.app-page .form-table label {
		width: 40%;
		margin-bottom: 10px;
	}
	.app-wrap-admin{
		float: none;
		width: 100%;
	}
	.app-first-letter{
		visibility:hidden;
	}
	.app-first-letter::first-letter{
		visibility:visible;
	}
	.inline-edit-row fieldset label textarea {
		width: 80%;
	}
	.app-manage select{
		max-width:360px;
	}
	label.app_iedit_date_time.title {
		float:none;
	}
	.app-iedit-email-actions label {
		width: 40%;
	}
	label.app_iedit_send_mail,
	label.app_iedit_textarea,
	label.app_iedit_time {
		margin-top: 10px;
		display: block;
		width: 100%;
	}

}

@media screen and (min-width: 783px) {
	#wpbody-content .app-page form {
		/* display: block; */
	}
	#wpbody-content #app-search-form {
		text-align: right;
	}
	#wpbody-content .app-page .actions form select {
		max-width: 120px;
	}
}

@media screen and (max-width: 360px) {
	#wpbody-content .app-page .app-manage-first-row {
		flex-direction: column;
	}
}

.app-page .actions {
	overflow: initial;
}

.app-page .alignright,
.app-page .alignleft {
	margin-top: 0;
	margin-bottom: 0;
}

table.app-manage tbody th,
table.app-manage td {
	border: initial;
	padding: 8px 10px;
}

@media screen and (min-width: 783px) {
	#wpbody-content .app-manage .inline-edit-col-left {
		width: 33.3%;
	}
	#wpbody-content .app-manage .inline-edit-col-center {
		width: 33.3%;
	}
	#wpbody-content .app-manage .inline-edit-col-right {
		width: 33.3%;
	}
	.user-inner .booking-info {
		display: none
	}
}

.app-manage .inline-edit-save {
	margin-bottom: 10px;
}

@media screen and (max-width: 782px) {
	.user-inner .booking-info::before {
		content: '\00B7';
		font-weight: bold;
		padding: 0 5px;
		font-size: larger;
	}

	.wp-core-ui .app-addon-table select,
	.app-addon-table input {
		min-height: 0;
		font-size: 11px;
	}

	.app-addon-table th {
		font-size: 11px;
	}
}

.app-table input[type=text],
.app-addon-table input[type=text] {
	width: 100%;
}

.app-table input[type=text].app-50 {
	width: 50%;
}

.app-table select,
.app-addon-table select {
	width: 100%;
	max-width: 100%;
}

#services-table .app-time-dur-rule select {
	width: 14%;
}

.app-table .has-checkbox,
.app-addon-table .has-checkbox {
	text-align: center;
	vertical-align: middle;
}

.app-page .button-petit,
.app-credits .button-petit,
.app-front-admin .wp-core-ui .button-petit {
	font-size: 10px;
	line-height: 18px;
	height: 20px;
	padding: 0 2px 0 2px;
	text-align: center;
	min-height: 20px;
}

.app-page th#id,
.app-page td.column-id,
.app-page th.column-id,
.app-page td.column-payment_id,
.app-page th.column-payment_id,
.app-page td.column-sort_order,
.app-page th.column-sort_order,
.app-page td.column-capacity,
.app-page th.column-capaciy {
	text-align: center;
}

#app-commissions th#id,
#app-commissions td.column-id,
#app-commissions th.column-id,
#app-clients th#id,
#app-clients td.column-id,
#app-clients th.column-id,
#app-workers th#id,
#app-workers td.column-id,
#app-workers th.column-id,
#app-vendors th#id,
#app-vendors td.column-id,
#app-vendors th.column-id {
	text-align: left;
}

#services-table td,
td.column-image,
td.column-color {
    vertical-align: middle;
}

.app-services .column-image img.app-main-avatar,
.column-color a {
	cursor: default;
}

.row-actions .dashicons {
	color: black;
}

.app-manage .row-actions .dashicons.dashicons-edit {
	padding-left: 25px;
	box-sizing: initial;
}

.app-manage .row-actions .dashicons.dashicons-edit.app-pl0 {
	padding-left: 0;
}

.app-manage-row a.rbutton {
    padding: 0 4px;
    opacity: 0.6;
    border-radius: 8px;
    display: inline-block;
    height: 24px;
    line-height: 24px;
}

.app-manage-row a.rbutton.current {
	opacity: 1
}

.app_iedit_timezone .input-text-wrap {
	height: 26px;
	display: inline-block;
	margin-left: 0
}

/* FEBM -------------------------------------------------------------- */
@media screen and (min-width: 782px) {
	.app-fem .app-filter-form select {
		max-width: 14.5%;
	}
}

@media screen and (max-width: 782px) {
	.app-fem .wrap .add-new-h2 {
		display: table-caption;
		margin-top: 10px;
	}
}

/* Other Tables -------------------------------------------------------------- */
#services-table {
	/* min-width: 900px; */
	position: static;
	overflow-x: auto;
}
#extras-table {
	min-width: 1100px;
}
#coupons-table {
	min-width: 950px;
}
#rules-table {
	min-width: 850px;
}
#worker-table, #udf-table {
	min-width: 600px;
}

td.app-lts input,
td.app-lts select {
	font-size: 11px;
	height: 27px
}

.app-page table.inactive tr:not(.active),
.app-page tr.inactive,
.app-page label.inactive,
.app-page input.inactive {
	opacity: 0.5
}

.app-page tr.inactive a:hover {
	opacity: 1
}

tr.app-coupon-tr td,
tr.app-extra-tr td,
tr.app_rule_tr td,
tr.app-category-tr td {
	vertical-align: middle
}

tr.app-coupon-tr td:first-child,
tr.app-extra-tr td:first-child,
tr.app_rule_tr td:first-child,
tr.app-category-tr td:first-child {
	text-align: center;
}

.no-entry-defined td {
	text-align: center;
}

.app-crowded thead th {
	font-size: 11px;
}

.app-more {
	text-align: center;
	display: flex;
}

a.app-lts-more {
	font-size: smaller;
}

.app-crowded .datepicker {
	font-size: 10px;
	line-height: 18px;
}

.app-crowded select,
.app-crowded button,
.app-crowded button.ui-multiselect,
.app-crowded input:not([type="checkbox"]) {
	font-size: 11px;
	line-height: 12px;
	min-height: 28px;
	font-weight: normal;
}

.app-crowded select {
	line-height: 2;
}

.app-crowded button.ui-multiselect::first-line {
	line-height: 26px;
}

.app-ms-small ul.ui-multiselect-checkboxes {
	font-size: 10px;
}

.app-ms-small .ui-multiselect-header {
	font-size: 10px;
}

.app-ms-small .ui-multiselect-header li {
	margin: 0 5px 0 0
}

.app-ms-small .ui-multiselect-header .ui-helper-reset span {
	vertical-align: middle;
}

.app-ms-small .ui-multiselect-header .ui-helper-reset {
	line-height: 1.8;
}

.ui-multiselect-filter input {
	box-sizing: border-box;
	height: 100%;
}

.ui-multiselect.ui-state-default,
.ui-widget-content .ui-multiselect.ui-state-default {
	font-weight: normal;
}

.app-crowded td {
	padding-right: 3px;
	padding-left: 3px;
}

#services-table thead th,
#services-table tfoot th,
#app-workers thead th,
#app-workers tfoot th{
	font-size: 12px;
    background-color: #f8f9fa;
	font-weight: 500;
}

#services-table .app-client-name,
#app-workers .app-client-name {
	display: block;
	margin-bottom: 5px;
}

#services-table .app-service-tr td {
    vertical-align: middle;
}

#services-table td.app-internal {
	padding-right: 10px;
	padding-left: 10px;
}

#services-table td.app-service-page select {
	width: 100%;
	max-width: 150px
}

#services-table .ui-tabs .ui-tabs-panel {
	display: table-row;
}

th.app-service-id-th span.dashicons {
	width: 10px;
}

th.app-service-id-th a {
	padding-left: 8px;
}

span.app-service-id {
	display: flex;
	justify-content: center;
}

.app-service-price,
.app-service-deposit {
	text-align: right;
}

.app-service-tab-head th {
	vertical-align: top;
	padding-right: 0;
}

table.app-service-addon-settings {
	width: 100%;
	margin: 10px 0;
	padding: 0 5px;
}

.app-service-addon-settings tr.ui-tabs-panel td:not(.ui-state-disabled) {
	border: 1px solid lightgrey;
	border-radius: 5px;
}

.app-service-addon-settings tr.ui-tabs-panel td .ui-datepicker-calendar td {
	border: 2px solid transparent;
}

table.app-service-addon-settings tr.app-service-tab-head td {
	background-color: transparent;
}

.app-service-tab-head .ui-tabs-active .tab-title {
    font-weight: 500;
}

.app-service-tab-head ul li a {
	width: 90%;
	outline: none;
	-webkit-box-shadow: none;
}

tr.app-service-tab-head .ui-tabs-nav li.ui-tabs-active {
	margin-bottom: 0;
}

.app-service-tab-head .ui-widget-header {
	background: none;
	border: none;
}

tr.app-service-tr td {
	border-top: 1px solid lightgrey;
}

#worker-table select {
	width: 100%;
}

div#app-wh {
	display: flex;
	flex-wrap: wrap;
}

.app-list .app-weekly-admin table td {
	height: 3em;
	font-size: 0.8em;
}

.app-page .app-make-expand span.dashicons {
	margin: 0;
}

.app-make-expand.button-secondary {
	line-height: 1.5;
	padding: 5px;
	position: absolute;
	right: calc(1.4em + 12px);
}

.app-make-expand.app-expanded .dashicons-editor-expand {
	display: none;
}

.app-make-expand:not(.app-expanded) .dashicons-editor-contract {
	display: none;
}

.app-2col .app-list .app-weekly-admin table td {
    font-size: 1em;
	font-weight: 500;
}

.app-wrap-admin .app-list table.app-wh td {
	border-style: dashed solid;
}

.app-wrap-admin .app-list table.app-wh td.exact-hour {
	border-top-style: solid;
	border-top-color: #eee;
}

.app-page .app-list table th {
	height: 24px;
}

#wpbody-content .inline-edit-row fieldset.app-addon-ek {
	border-top: 1px groove #ccc;
	margin-bottom: 10px;
	padding-left: 10px;
}

#wpbody-content .inline-edit-row fieldset.app-addon-ek.app-credit-fields {
	margin-top: 10px;
}

#wpbody-content .inline-edit-row .app-time-dur fieldset.app-addon-ek {
	margin-bottom: -5px;
}

#wpbody-content .inline-edit-row fieldset.app-addon-ek.sequence div {
	margin-top: 10px;
}

#wpbody-content .inline-edit-row fieldset.app-addon-ek.sequence,
#wpbody-content .inline-edit-row fieldset.app-addon-ek.person-types {
	border-top: 3px double #ccc;
}

#wpbody-content .inline-edit-row .app-package-seq .app-addon-ek {
	margin-bottom: 0;
}

#wpbody-content .inline-edit-row fieldset.app-addon-main {
	border: 0;
	margin-bottom: 10px;
	padding-left: 10px;
}

fieldset.app-addon-ek legend {
    margin-left: 4px;
	margin-bottom: 0;
    font-weight: 700;
	padding: 0 5px;
	font-size: 100%;
	width: unset;
}

fieldset.app-addon-ek.sequence legend {
    font-weight: 900;
}

.addon-info {
	margin-top: 20px;
	padding: 0 10px
}

.app-package-seq {
	/* padding: 0 10px; */
	/* margin-bottom: 10px; */
	/* display: flex; */
	/* flex-wrap: wrap; */
	width: 50%;
	float: left;
}

@media screen and (max-width: 782px) {
	.app-package-seq {
		width: 100%;
		float: none;
	}
}

.app-packages .app-package-seq input {
	margin-right: 3px;
}

.app-recurring .app-flex {
	width: 100%;
}

#wpbody-content #services-table .inline-edit-row tr:not(.app-recurring) fieldset:last-of-type {
    padding-right: 12px;
	margin-bottom: 5px;
}

#wpbody-content .inline-edit-row .app-recurring fieldset.app-addon-ek {
	min-width: 200px;
	width: 25%;
	border-right: 1px groove #ccc;
	margin-bottom: -8px;
}

#wpbody-content .inline-edit-row .app-recurring fieldset:last-of-type {
    padding-right: 12px;
}

.app-list-table .inline-edit-row .app-recurring fieldset label:first-child {
	width: calc(20% - 1em);
}
@media screen and (max-width: 782px) {
	.app-list-table .inline-edit-row .app-recurring .app-addon-ek label:first-child span.title {
		display: none;
	}
	.app-list-table .inline-edit-row .app-recurring .app-addon-ek label:first-child span.input-text-wrap {
		margin-top: 35px;
	}
}

.app-list-table .inline-edit-row .app-recurring fieldset label:not(:first-child) {
	width: calc(80% - 1em);
}

.app-list-table .inline-edit-row .app-recurring fieldset.app-addon-main label,
.app-list-table .inline-edit-row .app-sel-dur fieldset.app-addon-main label,
.app-list-table .inline-edit-row .app-time-dur fieldset.app-addon-main label {
	width: 30%;
}

.app-list-table .inline-edit-row .app-recurring fieldset.app-addon-ek .inline-edit-col {
    margin-bottom: 20px;
}

#services-table .app_iedit_service_fee .input-text-wrap input,
.app-addon-main .app_iedit_packages_duration.wp-clearfix .input-text-wrap input,
.app-addon-ek label[class^="app_iedit_package_delay"] .input-text-wrap input.delay {
    width: 50%;
}

.app-package-seq fieldset:not(:nth-of-type(2)) .title,
.person-types-list fieldset.app-addon-ek:not(.person-types):not(:nth-of-type(2)) .title,
.app-time-dur fieldset.app-addon-ek:not(:nth-of-type(2)) .title {
	display: none;
}

.app-service-addon-settings tr.ui-tabs-panel.app-recurring td {
	border-bottom: 0;
}

.app-service-addon-settings input.app-add-btn {
	min-width: 100px;
	margin-left: 30px;
	vertical-align: baseline;
}

div.addon-set-info {
	margin-bottom: 10px;
	padding-left: 10px;
}

span.addon-set-title {
	padding-top: 4px;
	padding-right: 10px;
	display: inline-block;
	font-weight: bold;
	font-size: 13px;
	vertical-align: top;
	text-transform: uppercase;
}
span.addon-sets-description {
	font-size: 13px;
	line-height: 1.2;
	display: inline-block
}

#services-table select.fee-unit,
.app-list-table .inline-edit-row .app-packages select {
	vertical-align: middle;
}

.app-list-table .app-packages input {
	vertical-align: middle;
}

#services-table .app_iedit_service_fee .input-text-wrap {
    display: flex;
}

#services-table .fee-unit,
.app-packages select.select-unit {
	max-width: 45%;
}

.app-packages input.delay {
	width: 12%;
	min-width: 30px;
}

.inline-edit-row .app-flexible-price .input-text-wrap input.datepicker {
	font-size: 12px;
	width: 60%;
}

.inline-edit-row .app-flexible-price .app-time-selection {
	font-size: 12px;
	width: 38%;
}

@media screen and (max-width: 782px) {
	.inline-edit-row .app-flexible-price input.datepicker,
	.inline-edit-row .app-flexible-price .app-time-selection {
		font-size: 14px;
		width: 100%;
	}

	.inline-edit-row .app-flexible-price input.datepicker {
		margin-bottom: 10px;
	}
}

.inline-edit-row .app-flexible-price .no-date .app-time-selection {
	font-size: 14px;
	width: 100%;
}

.app-flexible-price [class^='app_iedit_flexible_price_from_pax'],
.app-flexible-price [class^='app_iedit_flexible_price_to_pax']{
	opacity: 0.3;
}

.seats-enabled .app-flexible-price [class^='app_iedit_flexible_price_from_pax'],
.seats-enabled .app-flexible-price [class^='app_iedit_flexible_price_to_pax']{
	opacity: 1;
}

tbody.service-tabs {
	display: table-header-group !important;
}

.has-checkbox label {
	display: inline-block;
}

.has-checkbox label span {
	display: inline-block;
	padding-right: 10px;
	-webkit-user-select: none;
	-ms-user-select: none;
	-moz-user-select: none;
}

#social-facebook-id,
#social-google-id,
#social-wordpress-id {
    border-top: 1px solid #f0f0f0;
}

/* Submit Box -------------------------------------------------------------- */

#app_worker_id,
.app-list-for {
	font-size: 14px;
	align-self: center;
	padding: 5px 10px 5px 10px;
}

.app-submit-holder {
	display: flex;
	justify-content: space-between;
	padding-top: 10px;
}

.app-submit-holder .tablenav {
	margin: 0;
}

.app-submit {
	padding: 0 0 10px 0;
	margin: 5px 0;
	-webkit-border-bottom-left-radius: 3px;
	border-bottom-left-radius: 3px;
	-webkit-border-bottom-right-radius: 3px;
	border-bottom-right-radius: 3px;
	border: none;
}

#wpbody-content .app-submit form {
	display: flex;
	gap: 10px;
}

.app-4col .ui-multiselect {
	width: 100%;
	min-height: 32px;	
}

.app-flex .app-wh-list.ui-multiselect {
	width: calc(100% - 120px);
	min-height: 32px;
}

.app-wh-tz-form,
.app-wh-tz-form .ui-multiselect {
	width: 100%;
}

#app-wh-list-btn {
	width: 80px;
}

@media screen and (max-width: 960px) {
	#app-wh-list-btn,
	.app-wh-list.ui-multiselect,
	.app-flex .app-wh-list.ui-multiselect,
	.app-4col .ui-multiselect,
	.app-prpl .app-4col,
	.app-prpl .app-2col {
		width: 100%;
	}
}

@media screen and (max-width: 520px) {
	.app-prpl {
		display: block;
	}
}

.app-wh-tz-form {
	justify-content: flex-end;
}

/* Buttons, Cursors, Blinkers, Effects -------------------------------------------------------------- */

.app-disabled-button {
	opacity: 0.3;
	cursor: not-allowed;
}

button.app-gcal-test a {
	color: inherit;
	text-decoration: none;
}

.app-gcal-color-1 {
	background-color: #a4bdfc
}

.app-gcal-color-2 {
	background-color: #7ae7bf
}

.app-gcal-color-3 {
	background-color: #dbadff
}

.app-gcal-color-4 {
	background-color: #ff887c
}

.app-gcal-color-5 {
	background-color: #fbd75b
}

.app-gcal-color-6 {
	background-color: #ffb878
}

.app-gcal-color-7 {
	background-color: #46d6db
}

.app-gcal-color-8 {
	background-color: #e1e1e1
}

.app-gcal-color-9 {
	background-color: #5484ed
}

.app-gcal-color-10 {
	background-color: #51b749
}

.app-gcal-color-11 {
	background-color: #dc2127
}

.app-location-tr,
.app-service-tr,
.app-worker-tr,
.app-udf-tr,
.app-extra-tr,
.app-time-dur-rule,
#app-wh .app-title,
.app-category-tr {
	cursor: move;
}

#wpbody-content .app-page .button {
	font-size: 13px;
	height: 28px;
}

#app-service-reset-form .button {
	/* margin-left: 6px; */
}

#app_export_csv_button {
	width: auto;
	white-space: normal;
	height: auto
}

.app-page #poststuff h3.hndle {
	cursor: default;
}

.app-flash {
	font-weight: bold;
	animation: blinker 1s linear infinite;
}

@keyframes blinker {
	50% {
		opacity: 0.0;
	}
}

@keyframes app_target {
	from {
		background-color: #ffa;
	}
	to {
		background-color: inherit;
	}
}

div:target,
p:target,
tr:target,
th:target,
ol:target {
	animation-name: app_target;
	animation-duration: 10s;
	animation-iteration-count: 1;
}

a.info-button img {
	vertical-align: bottom
}

li a.info-button img {
	vertical-align: middle
}

.app-info-list,
.addon-info .app-info-list {
	list-style-type: disc;
	padding-left: 15px;
	font-size: 16px;
	line-height: 22px;
}

.addon-set-info .app-info-list {
    padding-left: 25px;
}

.app-infobox .inside{
	display: flex;
	align-items: center;
}

.app-infobox-col1 {
	float: left;
	width: 6%;
	min-width: 50px;
	text-align: center;
	padding-top: 10px;
}

.app-infobox-col1 a:active,
.app-infobox-col1 a:focus,
.app-infobox-col1 a:focus img,
a.info-button:focus,
a.info-button:focus img {
	outline: none;
	-webkit-box-shadow: none;
}

.app-infobox-col2 {
	float: left;
	width: 94%;
	padding-top: 10px;
}

.app-manage .inline-edit-row span.error {
	max-width: 28%;
	margin-left: 5px;
    margin-top: 5px;
}

.app-form .inline-edit-save span.error {
	margin-left: 5px;
    margin-top: 5px;
}

.app-error {
	font-weight: bold;
	color: red;
}

.app-success {
	color: green;
	font-weight: bold;
}

.app-form .inline-edit-save img.waiting,
.app-manage img.waiting {
	margin-left: 5px;
	margin-top: 5px;
}

.form-table .app-instructions th,
.form-table .app-instructions td {
	padding: 10px;
	border-right: 1px solid #dfdfdf;
	vertical-align: middle
}

h2.app-dashicons-before:before {
	display: inline-block;
	width: 32px;
	height: 32px;
	font-size: 23px;
	line-height: 28px;
	font-family: dashicons;
	text-decoration: inherit;
	font-weight: 400;
	font-style: normal;
	vertical-align: top;
	text-align: center;
	-webkit-transition: color .1s ease-in .1s;
	transition: color .1s ease-in .1s;
	-webkit-font-smoothing: antialiased;
	-moz-osx-font-smoothing: grayscale;
}


/* Search -------------------------------------------------------------- */
#app-filter-form,
#app-sort-form,
#app-bulk-change-form,
#app-search-form {
	display: flex;
	gap: 5px;
	flex-wrap: wrap;
}

#app-search-form select {
	float: none;
	height: 30px;
    padding: 0 24px 0 8px;
	margin: 1px 3px 3px 0;
}

#app-search-form ::-webkit-input-placeholder {
	font-size: 12px
}

#app-search-form ::-moz-placeholder {
	font-size: 12px
}

#app-search-form :-ms-input-placeholder {
	font-size: 12px
}

#app-search-form input:-moz-placeholder {
	font-size: 12px
}

.app-w-select {
	font-size: 14px;
	padding: 3px;
	margin: 1px;
	line-height: 20px;
	height: 28px;
	vertical-align: bottom;
}

#app-search-form input[type="search"] {
	font-size: 9px;
	max-width: 160px;
	min-width: 120px;
	width: initial;
	margin: 1px 3px 1px 1px;
	padding: 0 8px;
	height: 28px;
	line-height: 28px;
	/* background-image: url(../images/search.svg); */
	/* background-repeat: no-repeat; */
	/* background-size: 16px; */
    /* background-position: right 10px center; */
	position: relative;
	z-index: 2;
}

#app-search-form .app-search-button {
	margin: 1px 0;
	height: 30px;
	width: initial;
}

#app-search-form.has-flex input[type="search"] {
	max-width: 100%
}

#app-search-form input::placeholder {
	font-size: 8.5px;
}

/* Colorpicker -------------------------------------------------------------- */

a.pickcolor {
	-moz-border-radius: 4px;
	-webkit-border-radius: 4px;
	border-radius: 4px;
	border: 1px solid #dfdfdf;
	margin: 0 7px 0 3px;
	padding: 4px 14px;
}

.app-preset-samples {
	padding-top: 8px
}

.app-preset-samples label,
.app-preset-samples span {
	float: left;
	font-size: 12px;
}

.app-preset-samples label.app-mr {
	font-weight: bold;
}

.app-list-table .wp-picker-container {
	position: relative;
}

.app-custom-color-wrap .wp-picker-holder,
.app-caption-color-wrap .wp-picker-holder,
.app-list-table .wp-picker-holder {
	position: absolute;
	right: 0;
	z-index: 2;
}

.app-custom-color-wrap,
.app-caption-color-wrap {
	display: flex;
	flex-wrap: wrap;
	justify-content: space-between;
}

.app-caption-color-wrap {
	justify-content: flex-start;
}

.app-custom-color-wrap .wp-color-result-text,
.app-caption-color-wrap .wp-color-result-text,
.app-list-table .wp-color-result-text {
	line-height: 2;
}

.app-colorpicker-item {
	position: relative;
}

.app-caption-color-wrap .app-colorpicker-item {
	margin-right: 10%;
}

@media screen and (max-width: 782px) {
	.app-page .app-preset-samples label {
		width: 100%;
	}
	.app-preset-samples span {
		width: 30%;
	}
}


/* Help, qTip and Tutorial -------------------------------------------------------------- */

.qtip-content .app-title {
	margin: 0;
	text-align: center;
}

.app-qtip {
	max-width: 600px !important
}

.app-qtip.ui-tooltip{
	width: auto;
}

.app-small-qtip {
	max-width: 700px !important;
}

.app-small-qtip .widefat td {
	font-size: 10px !important;
}

.app-narrow-qtip {
	max-width: 300px !important;
	z-index: 12000
}

.qtip.app-yellow-qtip {
	max-width: 400px;
	z-index: 12000;
	line-height: 1.4;
	font-weight: 500;
	font-size: 12px;
	border-radius: 5px;
}

.app-help-t1 {
	font-weight: 900;
	text-transform: uppercase;
	font-size: 13px;
}

.app-help-t2 {
	font-weight: 600;
	font-size: 13px;
}

.app-shortcodes-help div.odd {
	background-color: #f9f9f9;
}

#app-tabs a[href*="app-account-shortcode"],
#app-tabs a[href*="app-book-shortcode"],
#app-tabs a[href*="app-countdown-shortcode"],
#app-tabs a[href*="app-list-shortcode"],
#app-tabs a[href*="app-meeting-room-shortcode"],
#app-tabs a[href*="app-register-shortcode"],
#app-tabs a[href*="app-sell-credit-shortcode"],
#app-tabs a[href*="app-waiting-room-shortcode"] {
	font-weight: 700;
}

.wrap.app-help-page #poststuff p span {
	font-size: 16px;
	font-style: normal;
}

ol#tutorials {
	font-size: 16px;
}

.app-help-page #poststuff h2 {
	font-size: 24px;
}

.app-settings-list td.key {
	word-break: break-word;
}

.wp-pointer-bottom .wp-pointer-arrow,
.wp-pointer-top .wp-pointer-arrow,
.wp-pointer-undefined .wp-pointer-arrow {
	left: 147px !important;
}

#app_support_request_form input[type=text] {
	width: 100%;
	max-width: 600px;
}
#app_support_request_form textarea {
	width: 100%;
	max-width: 600px;
	height: 100px;
}

/* Export/Import -------------------------------------------------------------- */

.app-impex-wr {
	float: right;
	margin-right: 10px;
	width: 18%;
	margin-top: 20px;
}

.app-impex-wr a {
	text-decoration: none
}

.app-csv-wr {
	float: left;
	min-width: 140px;
	margin-bottom: 5px;
}

.app-csv-wr label {
	-webkit-user-select: none;
    -ms-user-select: none;
    -moz-user-select: none;
}

.app-csv-prnt {
	/* float: left; */
	/* width: 68%; */
}

.app-csv-dates {
	display: flex;
	flex-wrap: wrap;
	justify-content: start;
    margin-bottom: 10px;
}

.app-csv-dates input,
.app-csv-dates select {
	margin-right: 10px;
}

.app-csv-download-wr {
	float: left;
	margin: 0 10px 10px 0;
	width: 30%;
	white-space: nowrap;
}

.app-csv-gprnt {
	margin-top: 10px;
}

tr.app_impex {
	height: 80px;
}

/* Licenses -------------------------------------------------------------- */

table.app-license th.app-license-name {
	padding-left: 10px;
}

table.app-license th.app-license-key {
	padding-left: 10%;
}

table.app-license .app-license-status,
table.app-license .app-license-actions {
	text-align: center;
}

table.app-license button {
	padding: .4em 1em;
	box-shadow: 0 5px 5px rgba(0, 0, 0, 0.2);
	border: 1px solid rgba(0, 0, 0, 0.2);
	border-radius: 4px;
	height: auto;
	background-image: none;
}

table.app-license button .ui-icon {
	display: inline-block;
	vertical-align: bottom;
}

/* Manual Payments & Add Manual Credit -------------------------------------------------------------- */

.app-add-mp {
	width: 100%;
	text-align: center;
}

.manual-payment {
	display: flex;
	margin-top: 3%;
}

.app-mp-dialog label,
.app-credit-dialog label {
	display: block;
	padding: 3px;
}

.app-mp-dialog input,
.app-credit-dialog input,
.app-mp-dialog textarea,
.app-credit-dialog textarea{
	width: 60%;
}

.app-mp-dialog label span,
.app-credit-dialog label span {
	margin-right: 10px;
	width: 30%;
	display: block;
	float: left
}

.app-mp-dialog sup,
.app-credit-dialog sup {
	font-weight: bold;
	color: red
}

.app-mp-buttons {
	padding: 3px;
	display: flex;
	justify-content: space-between;
}

.no-close .ui-dialog-titlebar-close {
	display: none
}

.app-mp-dialog-msg.success {
    padding: 0 10px;
    font-size: 11px;
    color: green;
    font-weight: bold;
}

/* Multilang -------------------------------------------------------------- */

input.app-multilang {
	width: 100%;
	background-position: top right;
	background-repeat: no-repeat;
}

textarea.app-multilang {
	background-position: top right;
	background-repeat: no-repeat;
	margin-top: 5px;
}

th.app-multilang {
	text-align: right;
}

/* Event Bookings -------------------------------------------------------------- */

.app-eb fieldset {
	margin-bottom: 10px;
}

.app-eb abbr {
	cursor: help;
}

.app-eb label,
.app-eb input {
	margin-right: 10px;
}

.app-eb input {
	width: 10%;
}

.app-eb .app-event-row  input {
	width: 50%;
}

.app-eb .app-event-row  .app-2col input {
	width: 100%;
}

.app-eb input[type=checkbox] {
	width: 16px;
}

.app-event-row {
	display: flex;
	flex-wrap: wrap;
	justify-content: normal;
}

table.wpb-event-parti.dataTable th, table.wpb-event-parti.dataTable tfoot td {
	text-align: left;
	padding-left: 10px;
}

table.wpb-event-parti.dataTable th.app-upper {
	text-transform: uppercase;
	text-align: center;
}

@media screen and (max-width: 782px) {
	.app-event-row div {
		width: 100%;
	}
}

.app-event-dt-holder {
	float: left;
	width: 29%;
	margin-right: 1%;
	text-align: center;
}

.app-event-dt-holder input[type=text] {
	line-height: 20px;
}

.app-event-holder {
	width: 19%;
}

.app-event-dt-holder span {
	text-align: center;
}

.app_event_start_date,
.app_event_end_date {
	float: left;
	width: 60%;
}

.app_event_start_date input,
.app_event_end_date input {
	width: 100%;
}

.app_event_start_time,
.app_event_end_time {
	float: left;
	width: 39%;
	padding-left: 1%;
}

.app_event_start_time select,
.app_event_end_time select {
	padding: 2px;
	line-height: 28px;
	height: 28px;
}

/* Credits -------------------------------------------------------------- */

.app-credit-buttons {
	margin-top: 30px;
}

/* CodeMirror -------------------------------------------------------------- */

.CodeMirror {
	font-family: monospace;
	height: 300px;
	color: #000
}

.CodeMirror-lines {
	padding: 4px 0
}

.CodeMirror pre {
	padding: 0 4px
}

.CodeMirror-gutter-filler,
.CodeMirror-scrollbar-filler {
	background-color: #fff
}

.CodeMirror-gutters {
	border-right: 1px solid #ddd;
	background-color: #f7f7f7;
	white-space: nowrap
}

.CodeMirror-linenumber {
	padding: 0 3px 0 5px;
	min-width: 20px;
	text-align: right;
	color: #999;
	white-space: nowrap
}

.CodeMirror-guttermarker {
	color: #000
}

.CodeMirror-guttermarker-subtle {
	color: #999
}

.CodeMirror-cursor {
	border-left: 1px solid #000;
	border-right: none;
	width: 0
}

.CodeMirror div.CodeMirror-secondarycursor {
	border-left: 1px solid silver
}

.cm-fat-cursor .CodeMirror-cursor {
	width: auto;
	border: 0!important;
	background: #7e7
}

.cm-fat-cursor div.CodeMirror-cursors {
	z-index: 1
}

.cm-animate-fat-cursor {
	width: auto;
	border: 0;
	-webkit-animation: blink 1.06s steps(1) infinite;
	-moz-animation: blink 1.06s steps(1) infinite;
	animation: blink 1.06s steps(1) infinite;
	background-color: #7e7
}

@-moz-keyframes blink {
	50% {
		background-color: transparent
	}
}

@-webkit-keyframes blink {
	50% {
		background-color: transparent
	}
}

@keyframes blink {
	50% {
		background-color: transparent
	}
}

.cm-tab {
	display: inline-block;
	text-decoration: inherit
}

.CodeMirror-rulers {
	position: absolute;
	left: 0;
	right: 0;
	top: -50px;
	bottom: -20px;
	overflow: hidden
}

.CodeMirror-ruler {
	border-left: 1px solid #ccc;
	top: 0;
	bottom: 0;
	position: absolute
}

.cm-s-default .cm-header {
	color: #00f
}

.cm-s-default .cm-quote {
	color: #090
}

.cm-negative {
	color: #d44
}

.cm-positive {
	color: #292
}

.cm-header,
.cm-strong {
	font-weight: 700
}

.cm-em {
	font-style: italic
}

.cm-link {
	text-decoration: underline
}

.cm-strikethrough {
	text-decoration: line-through
}

.cm-s-default .cm-keyword {
	color: #708
}

.cm-s-default .cm-atom {
	color: #219
}

.cm-s-default .cm-number {
	color: #164
}

.cm-s-default .cm-def {
	color: #00f
}

.cm-s-default .cm-variable-2 {
	color: #05a
}

.cm-s-default .cm-variable-3 {
	color: #085
}

.cm-s-default .cm-comment {
	color: #a50
}

.cm-s-default .cm-string {
	color: #a11
}

.cm-s-default .cm-string-2 {
	color: #f50
}

.cm-s-default .cm-meta,
.cm-s-default .cm-qualifier {
	color: #555
}

.cm-s-default .cm-builtin {
	color: #30a
}

.cm-s-default .cm-bracket {
	color: #997
}

.cm-s-default .cm-tag {
	color: #170
}

.cm-s-default .cm-attribute {
	color: #00c
}

.cm-s-default .cm-hr {
	color: #999
}

.cm-s-default .cm-link {
	color: #00c
}

.cm-invalidchar,
.cm-s-default .cm-error {
	color: red
}

.CodeMirror-composing {
	border-bottom: 2px solid
}

div.CodeMirror span.CodeMirror-matchingbracket {
	color: #0f0
}

div.CodeMirror span.CodeMirror-nonmatchingbracket {
	color: #f22
}

.CodeMirror-matchingtag {
	background: rgba(255, 150, 0, .3)
}

.CodeMirror-activeline-background {
	background: #e8f2ff
}

.CodeMirror {
	position: relative;
	overflow: hidden;
	background: #fff
}

.CodeMirror-scroll {
	overflow: scroll!important;
	margin-bottom: -30px;
	margin-right: -30px;
	padding-bottom: 30px;
	height: 100%;
	outline: 0;
	position: relative
}

.CodeMirror-sizer {
	position: relative;
	border-right: 30px solid transparent
}

.CodeMirror-gutter-filler,
.CodeMirror-hscrollbar,
.CodeMirror-scrollbar-filler,
.CodeMirror-vscrollbar {
	position: absolute;
	z-index: 6;
	display: none
}

.CodeMirror-vscrollbar {
	right: 0;
	top: 0;
	overflow-x: hidden;
	overflow-y: scroll
}

.CodeMirror-hscrollbar {
	bottom: 0;
	left: 0;
	overflow-y: hidden;
	overflow-x: scroll
}

.CodeMirror-scrollbar-filler {
	right: 0;
	bottom: 0
}

.CodeMirror-gutter-filler {
	left: 0;
	bottom: 0
}

.CodeMirror-gutters {
	position: absolute;
	left: 0;
	top: 0;
	min-height: 100%;
	z-index: 3
}

.CodeMirror-gutter {
	white-space: normal;
	height: 100%;
	display: inline-block;
	vertical-align: top;
	margin-bottom: -30px
}

.CodeMirror-gutter-wrapper {
	position: absolute;
	z-index: 4;
	background: 0 0!important;
	border: none!important
}

.CodeMirror-gutter-background {
	position: absolute;
	top: 0;
	bottom: 0;
	z-index: 4
}

.CodeMirror-gutter-elt {
	position: absolute;
	cursor: default;
	z-index: 4
}

.CodeMirror-gutter-wrapper ::selection {
	background-color: transparent
}

.CodeMirror-gutter-wrapper ::-moz-selection {
	background-color: transparent
}

.CodeMirror-lines {
	cursor: text;
	min-height: 1px
}

.CodeMirror pre {
	-moz-border-radius: 0;
	-webkit-border-radius: 0;
	border-radius: 0;
	border-width: 0;
	background: 0 0;
	font-family: inherit;
	font-size: inherit;
	margin: 0;
	white-space: pre;
	word-wrap: normal;
	line-height: inherit;
	color: inherit;
	z-index: 2;
	position: relative;
	overflow: visible;
	-webkit-tap-highlight-color: transparent;
	-webkit-font-variant-ligatures: contextual;
	font-variant-ligatures: contextual
}

.CodeMirror-wrap pre {
	word-wrap: break-word;
	white-space: pre-wrap;
	word-break: normal
}

.CodeMirror-linebackground {
	position: absolute;
	left: 0;
	right: 0;
	top: 0;
	bottom: 0;
	z-index: 0
}

.CodeMirror-linewidget {
	position: relative;
	z-index: 2;
	overflow: auto
}

.CodeMirror-rtl pre {
	direction: rtl
}

.CodeMirror-code {
	outline: 0
}

.CodeMirror-gutter,
.CodeMirror-gutters,
.CodeMirror-linenumber,
.CodeMirror-scroll,
.CodeMirror-sizer {
	-moz-box-sizing: content-box;
	box-sizing: content-box
}

.CodeMirror-measure {
	position: absolute;
	width: 100%;
	height: 0;
	overflow: hidden;
	visibility: hidden
}

.CodeMirror-cursor {
	position: absolute;
	pointer-events: none
}

.CodeMirror-measure pre {
	position: static
}

div.CodeMirror-cursors {
	visibility: hidden;
	position: relative;
	z-index: 3
}

.CodeMirror-focused div.CodeMirror-cursors,
div.CodeMirror-dragcursors {
	visibility: visible
}

.CodeMirror-selected {
	background: #d9d9d9
}

.CodeMirror-focused .CodeMirror-selected,
.CodeMirror-line::selection,
.CodeMirror-line>span::selection,
.CodeMirror-line>span>span::selection {
	background: #d7d4f0
}

.CodeMirror-crosshair {
	cursor: crosshair
}

.CodeMirror-line::-moz-selection,
.CodeMirror-line>span::-moz-selection,
.CodeMirror-line>span>span::-moz-selection {
	background: #d7d4f0
}

.cm-searching {
	background: #ffa;
	background: rgba(255, 255, 0, .4)
}

.cm-force-border {
	padding-right: .1px
}

@media print {
	.CodeMirror div.CodeMirror-cursors {
		visibility: hidden
	}
}

.cm-tab-wrap-hack:after {
	content: ''
}

span.CodeMirror-selectedtext {
	background: 0 0
}

.CodeMirror {
	border: 1px solid #eee;
	height: auto;
}


/* Editor Widget -------------------------------------------------------------- */
/** * from WP Editor Widget plugin V 0.5.5 * Author: David M&aringrtensson, Odd Alice */

#app-editor-widget-container {
	position: fixed;
	top: 30px;
	left: 30px;
	right: 30px;
	bottom: 30px;
	z-index: 50100;
	background: #fff;
}

#app-editor-widget-backdrop {
	position: fixed;
	top: 0;
	left: 0;
	right: 0;
	bottom: 0;
	min-height: 360px;
	background: #000;
	opacity: .7;
	z-index: 50000;
}

#app-editor-widget-container .close {
	position: absolute;
	top: 7px;
	right: 7px;
	width: 30px;
	height: 30px;
	z-index: 1000;
}

#app-editor-widget-container .close span {
	display: block;
	margin: 8px auto 0;
	width: 15px;
	height: 15px;
	background-position: -100px 0;
}

#app-editor-widget-container .icon {
	background-image: url(../../../../wp-includes/images/uploader-icons.png);
	background-repeat: no-repeat;
}

#app-editor-widget-container .close:active {
	outline: 0;
}

#app-editor-widget-container .editor {
	margin: 50px;
}

#available-widgets [class*=wp_editor_widget] .widget-title:before {
	content: "\f478";
}

/* Dashboard -------------------------------------------------------------- */
#app-navbar.metabox-holder,
#wpcontent .app-control-wrap.metabox-holder,
#wpcontent .app-report-box.metabox-holder,
#wpcontent .app-graph-box.metabox-holder,
.postbox.app-controls h3 {
	padding-top: 0;
}

.toplevel_page_appointments #wpcontent,
.wp-base-dev_page_app_setup #wpcontent,
.wp-base_page_app_setup #wpcontent {
	padding: 0;
}

.app-graph .legend table {
    width: unset;
}

.app-dashboard.wrap {
	padding-left: 20px;
	margin-top: 110px;
}

@media screen and (max-width: 782px) {
	.app-dashboard.wrap {
		margin-top: 155px;
	}
}

@media screen and (max-width: 600px) {
	.app-dashboard.wrap {
		margin-top: 180px;
	}
}

#app-navbar {
	margin: 0;
	padding-top: 0;
	position: fixed;
    width: 100%;
    z-index: 100;
    top: 32px;
	box-shadow: 0 5px 6px -3px rgba(0,0,0,.4);
}

@supports (position: sticky) {
	#app-navbar {
		position: -webkit-sticky;
		position: sticky;
		top: 32px;
	}

	.app-dashboard.wrap {
		margin-top: 20px;
	}
}

@media screen and (max-width: 600px) {
	#app-navbar {
		/* position: absolute; */
	}

	.app-dashboard.wrap {
		/* margin-top: 130px; */
	}
}

@media screen and (max-width: 782px) {
	#app-navbar {
		top: 46px;
	}

	button.app-disp-cols.ui-multiselect {
		display: none;
	}
}

#app-navbar .app-controls {
	width: 100%;
	padding: 5px 10px 0 20px;
    margin-bottom: 0;
	background-color: #fbfbfb;
}

#payments-filter div.app-actions,
#bookings-filter div.app-actions,
#services-filter div.app-actions,
#schedules-filter div.app-actions,
#app-graphs-filter div.app-actions {
	display:flex;
	flex-wrap: wrap;
	align-items: center;
	align-content: center;
	justify-content: space-between;
}

@media screen and (max-width: 782px) {
	#services-filter .add-new-h2 {
		margin-bottom: 10px;
		top: 0;
	}
}

#payments-filter,
#bookings-filter,
#services-filter,
#schedules-filter {
    margin-bottom: 10px;
    margin-top: 0;
	padding-right: 10px;
}

.app-controls .tablenav {
	height: auto;
	margin-top: 5px;
}

.app-actions div {
	margin-bottom: 5px;
	display: flex;
	align-items: center;
	font-size: 11px;
	gap: 6px;
}

.app-page .add-new-h2 {
	top: 0px;
	font-weight: 500;
}

#app-date-select,
#app-date-range-options {
    margin-bottom: 0;
}

.app-actions .app-dash-title {
    font-size: 14px;
    font-weight: 600;
    margin-right: 20px;
	padding-left: 2px;
}

.app-add-new-buttons {
    flex-wrap: wrap;
}

.app-controls .app-actions select {
	height: 28px;
    max-width: 160px;
    font-size: 10px;
}

.app-controls .app-actions select.app-status-elm {
	height: 28px;
    max-width: 180px;
    font-size: 14px;
}

.bp-user .app-controls .app-actions select {
	padding: 0 24px 0 8px;
}

#app-graphs-filter .graph-option-section {
    line-height: 2.5em;
    /* padding-right: 5px; */
}

.app-graph-filter-options {
	margin-top: auto;
}

#app-date-range-options span {
    line-height: 24px;
    height: 24px;
    margin-right: 6px;
}

#app-navbar,
.app-report-box.metabox-holder {
	display: flex;
    justify-content: space-between;
	padding-top: 0;
	flex-wrap: wrap;
	z-index: 2;
}

#app-open-navbar,
#app-open-navbar-service,
#app-open-navbar-schedule {
    position: absolute;
    right: 0;
}

#app-open-navbar button,
#app-open-navbar-service button,
#app-open-navbar-schedule button {
    width: 25px;
    height: 40px;
    background-color: #fff;
    border: 1px solid #c3c4c7;
    border-right: none;
	border-radius: 0 0 4px 4px;
	box-shadow: 0 0 0 transparent;
    transition: box-shadow .1s linear;
	cursor: pointer;
	padding: 0;
	margin: 0;
}

#app-open-navbar button:after,
#app-open-navbar-service button:after,
#app-open-navbar-schedule button:after {
    right: 0;
    content: "\f148";
    font: normal 20px/1 dashicons;
	color: #3c434a;
    speak: never;
    display: inline-block;
    padding: 0;
    bottom: 0;
    position: relative;
    vertical-align: bottom;
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
    text-decoration: none;
}

#app-close-navbar,
#app-close-navbar-service,
#app-close-navbar-schedule {
    position: absolute;
    right: 0;
    height: 100%;
}

#app-close-navbar button,
#app-close-navbar-service button,
#app-close-navbar-schedule button {
    width: 18px;
	height: calc(100% - 10px);
    background-color: transparent;
    border: 1px solid #c3c4c7;
    border-right: none;
	border-radius: 0 0 4px 4px;
	box-shadow: 0 0 0 transparent;
    transition: box-shadow .1s linear;
	cursor: pointer;
	padding: 0;
	margin: 0;
}

#app-close-navbar button:after,
#app-close-navbar-service button:after,
#app-close-navbar-schedule button:after {
    right: 14px;
    content: "\f148";
	transform: rotate(180deg);
    font: normal 20px/1 dashicons;
	color: #3c434a;
    speak: never;
    display: inline-block;
    padding: 0 5px 0 0;
    bottom: 0;
    position: relative;
    vertical-align: bottom;
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
    text-decoration: none;
	z-index: 10;
}

.app-report-box.metabox-holder {
	margin: 0 -5px;
}

.app-report-box.metabox-holder .postbox {
	min-width: 13%;
	min-width: 150px;
	margin: 0 5px 10px 5px;
	flex: 0 1 0;
}

.app-report-box.metabox-holder .postbox h3 {
    text-align: center;
	border-bottom: 1px solid #e8e8e8;
	font-size: 13px;
}

.app-count {
    text-align: center;
    font-size: 36px;
    padding: 10px;
	text-shadow: 0.05em 0.05em 0.05em rgba(10,10,10,0.2);
}

.app-count a {
	color: #444;
	text-decoration: none;
}

.app-count.app-crowded {
    font-size: 28px;
    padding-top: 18px;
}

.app-crowded .app-count.app-crowded {
    font-size: 24px;
    padding-top: 20px;
}

.app-crowded .app-report-box.metabox-holder .postbox {
    min-width: 130px;
}

.app-crowded  .app-popular-box.metabox-holder .postbox,
.app-popular-box.metabox-holder .postbox {
    min-width: 260px;
}

.app-crowded .app-report-box.metabox-holder .postbox h3 {
    font-size: 12px;
	padding-right: 8px;
	padding-left: 8px;
}

.wp-base_page_app_bookings #screen-meta-links,
.wp-base-dev_page_app_bookings #screen-meta-links {
    float: none;
    margin: 0;
    position: fixed;
    z-index: 1000;
    right: 20px;
}

#app-dashboard-wrap canvas.overlay {
	background-color: unset;
}

.app-controls label {
	font-size: 10px;
}

.app-controls input[type="checkbox"] {
	height: 1rem;
	width: 1rem;
}

.app-popular li {
    display: flex;
    justify-content: space-between;
}

.app-popular.inside {
    padding-bottom: 0;
}

.app-popular ul {
	margin: 0;
	padding: 0;
}

/*--------------------------------------------------------------
*** Addon Showcase
--------------------------------------------------------------*/
#wpb-addon-showcase {
	display: flex;
	flex-wrap: wrap;
	justify-content: space-between;
    margin-right: -3%;
	font-family: -apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Oxygen-Sans,Ubuntu,Cantarell,"Helvetica Neue",sans-serif;
}

@media screen and (max-width: 640px) {
	#wpb-addon-showcase {
		justify-content: center;
	}
}

#wpb-addons .wpb-addon {
    background: #fff;
    border: 1px solid #ccc;
    float: left;
    position: relative;
	overflow: hidden;
    margin: 0 3% 3% 0;
    min-width: 320px;
	width: 30%;
    height: 240px;
}

#wpb-addons .wpb-addon p {
	margin: 10px 0 5px 0;
	line-height: 1.6;
}

#wpb-addons .wpb-addon ul,
#wpb-addons .wpb-addon ol {
	margin: 8px 16px;
    list-style: disc;
}

#wpb-addons .wpb-addon li {
	margin-bottom: 3px;
}

#wpb-addons .wpb-addon.invisible {
	visibility:hidden;
}

@media screen and (max-width: 1024px) {
	#wpb-addons .wpb-addon.invisible {
		display: none;
	}
}

#wpb-addons .wpb-addon-img-link {
	display: block;
	height: 192px;
}

#wpb-addons .wpb-addon img {
	border: none;
    height: auto;
    max-width: 100%;
	max-height: 192px;
}

#wpb-addons .wpb-addon-excerpt {
    padding: 10px 15px 0 15px;
	height: 192px;
}

#wpb-addons .wpb-addon-inner {
    overflow: hidden;
    column-width: 320px;
    height: 182px;
}

#wpb-addons .wpb-addon-excerpt.no-thumbnail {
	margin-bottom: -10px;
}

#wpb-addons .wpb-addon-excerpt.has-thumbnail {
    position: absolute;
    top: 0;
}

#wpb-addons .wpb-addon-excerpt.no-thumbnail > p:first-child {
	margin-top: 0;
}

#wpb-addons .wpb-addon-excerpt.no-thumbnail > p:last-child {
	margin-bottom: 0;
}

#wpb-addons .has-thumbnail {
	visibility: hidden;
	opacity: 0;
	transition: opacity 1s;
}

#wpb-addons .wpb-addon-img-link:hover .has-thumbnail {
	visibility: visible;
	opacity: 1;
	background: rgba(0,0,0,.7);
    color: #fff;
}

#wpb-addons .wpb-addon-img-link:hover img {
	opacity: 0.2;
}

#wpb-addons .wpb-addon-excerpt.has-thumbnail a {
	color: #a5dffb;
}

#wpb-addons .wpb-addon-excerpt.has-thumbnail a:hover {
	color: #00a0d2;
}

#wpb-addons .wpb-addon .wpb-addon-id {
	position: relative;
	background: #f1f1f1;
}

#wpb-addons .wpb-addon .wpb-addon-title {
    font-size: 15px;
    margin: 0 0 8px;
	overflow: hidden;
	white-space: nowrap;
    text-overflow: ellipsis;
	padding: 15px 120px 15px 15px;
	box-shadow: inset 0 1px 0 rgba(0,0,0,.1);
	background: rgba(255,255,255,.65);
}

#wpb-addons .wpb-addon .wpb-addon-actions {
    position: absolute;
    top: 50%;
    transform: translateY(-50%);
    right: 0;
    padding: 10px 15px 10px 15px;
}

#wpb-addons .wpb-addon .wpb-addon-actions .button-secondary {
	margin-right: 0;
	margin-left: 3px;
}
#wpb-addons .corner-ribbon {
  width: 200px;
  background: #e43;
  position: absolute;
  text-align: center;
  line-height: 50px;
  letter-spacing: 1px;
  color: #f0f0f0;
  font-weight: 700;
  font-size: 12px;
}
#wpb-addons .corner-ribbon.sticky-ribbon {
  position: absolute;
}
#wpb-addons .corner-ribbon.shadow {
  box-shadow: 0 0 3px rgba(0, 0, 0, .3);
}
#wpb-addons .corner-ribbon.top-left{
  top: 25px;
  left: -50px;
  transform: rotate(-45deg);
  -webkit-transform: rotate(-45deg);
}
#wpb-addons .corner-ribbon.top-right{
  top: 25px;
  right: -50px;
  transform: rotate(45deg);
  -webkit-transform: rotate(45deg);
}
#wpb-addons .corner-ribbon.red {
  background: #e43;
}
#wpb-addons .corner-ribbon.green {
  background: #2ecc71;
}
#wpb-addons .wpb-addon-img-link:hover .corner-ribbon {
    opacity: 0.2;
}

/*--------------------------------------------------------------
*** Multi Vendor
--------------------------------------------------------------*/
.unconfirmed-pagination {
	height: 30px;
	color: #555;
	font-size: 11px;
}

.unconfirmed-pagination .currently-viewing {
	font-style: italic;
	margin-right: 20px;
}

@media screen and (min-width: 783px) {
	#wpbody-content #app-export-commissions {
		display: flex;
		flex-wrap: wrap;
	}
	#app-export-commissions input,
	#app-export-commissions select {
		margin-right: 5px;
	}
}

.app-list-table .inline-edit-row fieldset label span.title,
.app-list-table .inline-edit-row fieldset .app_iedit_image span.title {
	float: none;
	width: 100%;
	font-weight: 500;
}

.app-list-table div.inline-edit-col {
    display: flex;
    flex-wrap: wrap;
}

#services-table.app-list-table div.inline-edit-col {
	padding: 0 10px;
	/* flex-wrap: wrap; */
}

.app-list-table .inline-edit-row fieldset label {
	display: block;
    margin: .2em 1em .2em 0;
    line-height: 2.5;
	width: 19%;
    width: calc(20% - 1em);
}

.app-list-table .inline-edit-row fieldset label.wide {
    width: calc(40% - 2em);
}

.app-list-table .inline-edit-row fieldset .app-info-item .wp-picker-input-wrap label {
    display: inline-block;
    width: auto;
    margin: 0;
}

.app-list-table .inline-edit-row .app-package-seq fieldset label {
    width: 200px;
}

.app-list-table .inline-edit-row fieldset .app_iedit_image {
	display: block;
    margin: .2em 1em .2em 0;
	min-width: 150px;
}

.app-list-table .inline-edit-row fieldset .app-iedit-created-owner {
	width: calc(25% - 1em);
	align-content: start;
}

.app-list-table .inline-edit-row .app-conf-text.has-checkbox {
    display: inline-block;
    line-height: 1.5;
}

#services-table .app-service-main span:not(.wp-picker-input-wrap):not(.wp-color-result-text),
#services-table .app-service-main label {
	width: 100%;
	margin: 0;
}

#services-table .app-sortable,
#app-workers .app-sortable {
	cursor: move;
}

#services-table .app-service-main label {
    line-height: 1.6;
}

.app_service_locations .ui-multiselect-header .ui-multiselect-filter input,
.app_service_categories .ui-multiselect-header .ui-multiselect-filter input {
    width: 100%;
    margin-right: 8px;
}

.app_service_locations .ui-multiselect-filter,
.app_service_categories .ui-multiselect-filter {
    width: 100%;
}

.app-list-table .inline-edit-row fieldset .app_iedit_created p {
    line-height: 2;
}

.app-list-table .inline-edit-row fieldset .app_iedit_bg_color {
    height: 70px;
}

#services-table .wp-picker-clear {
    line-height: 28px;
}

#services-table .wp-picker-container .iris-picker {
    border-radius: 5px;
    border-color: #acacac;
    margin-top: 2px;
    border-width: 2px;
}

.app-list-table .inline-edit-row fieldset .app_iedit_description {
    width: calc(40% - 1em);
    max-width: 450px;
    margin-right: 1em;
}

@media screen and (max-width: 1024px) {
	.app-list-table .inline-edit-row fieldset label,
	.app-list-table .inline-edit-row fieldset .app_iedit_image	{
		width: 33%;
		width: calc(33.33% - 1em);
	}
}

@media screen and (max-width: 768px) {
	.app-list-table .inline-edit-row fieldset label,
	.app-list-table .inline-edit-row fieldset .app_iedit_image	{
		width: 48%;
		width: calc(50% - 1em);
	}
}

@media screen and (max-width: 480px) {
	.app-list-table .inline-edit-row fieldset label,
	.app-list-table .inline-edit-row fieldset .app_iedit_image	{
		width: 100%;
	}
}

.app-list-table .inline-edit-save {
    margin: 1em .4em 1em .4em;
	padding: 0 10px;
}

.app-list-table .inline-edit-row fieldset label span.input-text-wrap,
.app-list-table .inline-edit-row fieldset .app_iedit_image span.input-text-wrap {
	margin-left: 0;
}

.app-list-table .inline-edit-row fieldset .inline-edit-col {
    margin-right: -1em;
}

.app-list-table .inline-edit-row select {
	width: 100%;
	vertical-align: baseline;
}

.app-list-table .inline-edit-row fieldset label span.title,
.app-list-table .inline-edit-row fieldset .app_iedit_image span.title {
    line-height: 2;
}

.app-list-table .inline-edit-row fieldset .app_iedit_image span.title {
	display: block;
}

.app-list-table .inline-edit-row textarea {
    width: 100%;
	height: 30px;
}

.app-credit-history .app-plan-name,
.app-credit-history .app-plan-val {
	display: inline-block;
}

.app-credit-history .app-plan-name {
	min-width: 80px;
}

.app-credit-history .app-plan-val {
	min-width: 25px;
	font-weight: 500;
}

#services-table textarea,
#app-workers textarea {
	height: 96px;
	font-size: 12px;
	width: 100%;
}

#services-table .app_iedit_workers textarea {
	height: 96px;
}
#services-table .app_iedit_workers_with_free textarea {
	height: 40px;
}

#app-workers textarea {
	height: 96px;
}

#services-table .inline-edit-row fieldset .app_iedit_image span.title {
	display: block;
}

#services-table .app-service-info,
#app-clients .app-user-info,
#app-workers .app-user-info,
#app-vendors .app-user-info {
	width: 100%;
	padding-top: 10px;
}

#services-table .app-service-info .left,
#app-clients .app-user-info .left,
#app-workers .app-user-info .left,
#app-vendors .app-user-info .left {
	float: left;
}

#services-table .app-service-info .right,
#app-clients .app-user-info .right,
#app-workers .app-user-info .right,
#app-vendors .app-user-info .right {
	float: right;
}

#services-table .app-service-id,
#app-clients .app-user-id,
#app-workers .app-user-id,
#app-vendors .app-user-id {
	font-size: 16px;
	font-weight: 600;
	/* padding-right: 10px; */
	position: absolute;
    right: 20px;
    top: 15px;
}

#app-clients .app-user-main,
#app-workers .app-user-main,
#app-vendors .app-user-main {
	margin: 0 10px;
}

#services-table .app-service-main {
	/* position: absolute; */
    /* left: 120px; */
	margin-top: 10px;
	/* margin-right: 1em; */
	/* width: calc(20% - 1em); */
}

.app-service-avatar {
    margin-right: 20px;
}

#services-table .app-service-item,
#app-clients .app-user-item,
#app-workers .app-user-item,
#app-vendors .app-user-item {
    display: block;
    line-height: 16px;
    padding-bottom: 5px;
}

#services-table .app-info-item {
	display: flex;
	flex-direction: column;
	width: calc(20% - 1em);
}

#services-table .app-info-item.wide {
	width: calc(40% - 1em);
}

#services-table .app-service-info {
    display: flex;
    gap: 1em;
}

.app-list-table .inline-edit-row fieldset .app-info-item label {
	width: 100%;
}

#services-table .app-service-item:empty {
    display: none;
}

#services-table .app-service-name,
#app-clients .app-user-name,
#app-workers .app-user-name,
#app-vendors .app-user-name {
	font-size: 18px;
	font-weight: 600;
}


@media screen and (max-width: 782px) {
	#services-table .app-service-info .left,
	#app-clients .app-user-info .left,
	#app-workers .app-user-info .left,
	#app-vendors .app-user-info .left {
		float: none;
	}

	#services-table .app-service-main {
		width: 100%;
	}
}

select.app_displayed_columns,
select.app_displayed_columns_bookings {
	display: none;
}

.column-id .span_service_id {
    display: block;
	font-weight: 600;
}

.column-id sup {
    font-size: 9px;
	cursor: pointer;
	color: white;
    background-color: #646970;
    padding: 1px 3px 1px 2px;
    margin: 1px;
    font-weight: 700;
}

.app_iedit_internal input {
	vertical-align: text-top;
}

#app-clients input[type="password"],
#app-workers input[type="password"],
#app-vendors input[type="password"] {
    min-height: 28px;
    line-height: initial;
	width: 100%;
}

span.span_commission_id {
    padding-left: 5px;
}

.app-export-form {
    clear: both;
    background: #f5f5f5;
    background-image: linear-gradient(to top,#f5f5f5,#fafafa);
    border-color: #dfdfdf;
    overflow: auto;
    margin: 8px 0;
    padding: 12px;
    border-width: 1px;
    border-style: solid;
    border-radius: 3px;
    font-size: 13px;
}

#credit-plans div.fg-toolbar,
#mv-commission-rates div.fg-toolbar,
.inline-edit-row .dataTables_length,
.inline-edit-row .dataTables_filter {
	display: none;
}

table.dataTable.app-list thead th div.DataTables_sort_wrapper span,
table.dataTable.app-custom-texts thead th div.DataTables_sort_wrapper span {
    right: -8px;
}

#app-clients img.avatar,
#app-workers img.avatar,
#app-vendors img.avatar {
    float: left;
    margin-right: 10px;
    margin-top: 1px;
    border-radius: 5px;
}

/*--------------------------------------------------------------
*** Test Bookings
--------------------------------------------------------------*/
.app-test-bookings.app-flex {
	align-items: flex-end;
	margin-left: -10px;
	flex-wrap: nowrap;
	margin-bottom: 30px;
}

.app-test-bookings div {
	max-width: 20%;
	margin-left: 10px;
}

.app-test-bookings label {
	display: block;
}

.app-test-bookings select {
	max-width: 100%;
}

/*--------------------------------------------------------------
*** Seasonal
--------------------------------------------------------------*/
.app-alt-schedules .past {
	display: none;
}

/*--------------------------------------------------------------
*** Setup
--------------------------------------------------------------*/
.app-setup-nav {
    display: flex;
    width: 100%;
    align-items: baseline;
}

.app-setup-nav .app-dash-title {
    min-width: 100px;
	font-size: 14px;
    font-weight: 600;
}

.app-setup-nav .app-setup-steps {
    width: 80%;
}

.app-setup-steps ul {
    display: flex;
    gap: 15px;
    position: relative;
	list-style: none;
	padding: 0;
	margin-bottom: 0;
}

.app-setup-steps ul:before {
    position: absolute;
    top: 16px;
    left: 50%;
    transform: translateX(-50%);
    width: 80%;
    height: 2px;
    background: #dedfe0;
    content: "";
    z-index: 0;
}

.app-setup-steps ul li {
	flex: 1;
    text-align: center;
}

.app-setup-steps ul li a {
    display: block;
    padding: 5px 10px;
    color: #8a8e92;
    text-align: center;
    font-size: 12px;
    text-decoration: none;
}

.app-setup-steps ul li.completed-step a span {
    width: 25px;
    height: 25px;
    line-height: 25px;
    font-size: 14px;
    background: #00ba37;
    box-shadow: none;
}

.app-setup-steps ul li.active-step a span {
    background: #007cba;
    /* background: var(--wp-admin-theme-color); */
    box-shadow: 0 0 4px 1px rgba(#007cba, .3);
    box-shadow: 0 0 4px 1px rgba(#007cba,.3);
}

.app-setup-steps ul li a span {
    color: #fff;
    width: 25px;
    height: 25px;
    line-height: 25px;
    font-size: 12px;
    font-weight: 400;
    border-radius: 50%;
    background: #c2c4c6;
    display: inline-block;
    text-align: center;
    margin-bottom: 10px;
    position: relative;
    box-shadow: none;
}

.app-setup-steps ul li.active-step a,
.app-setup-steps ul li.active-step a small {
    color: #007cba;
    /* color: var(--wp-admin-theme-color); */
    font-weight: 500;
}

.app-setup-steps-title {
    color: #646970;
    display: block;
    font-size: 11px;
}

.app-setup-container {
  container-type: inline-size;
  container-name: app-setup;
}

.app-setup-wrap {
	padding: 20px 140px 40px;
}

@container app-setup (max-width: 960px) {
    .app-setup-wrap {
        padding: 20px 20px 20px;
    }
}

.app-setup-wrap .postbox .inside {
	margin: 0;
	padding: 0;
}

.app-setup-wrap .app-setup-inside {
	padding: 20px 100px 40px;
}

.app-setup-wrap .app-setup-inside .app-title.step-title {
    font-size: 1.2rem;
	font-weight: 500;
    margin: 0;
    padding: 20px 0 10px 0;
    border-bottom: 1px solid #eee;
}

.app-setup-wrap table.form-table {
    margin-bottom: 20px;
}

.app-setup-buttons {
	border-top: 1px solid #eee;
	padding-top: 20px;
    display: flex;
    justify-content: space-between;
	align-items: center;
}

.app-setup-buttons .app-setup-back:hover,
.app-setup-wrap .app-setup-exit:hover {
    color: #007cba;
    /* color: var(--wp-admin-theme-color); */
}

.app-setup-buttons .app-setup-back,
.app-setup-wrap .app-setup-exit {
    color: #787c82;
    text-decoration: none;
    transition: all .2s ease-in-out;
    background: none;
    border: none;
    cursor: pointer;
}

.app-setup-buttons .app-skip-step {
	margin-right: 20px;
}

.app-setup-wrap .app-2col {
    width: 100%;
}

.app-setup-wrap .app-weekly-admin {
	margin: 0;
}

.app-setup-wrap .app-image-upload {
	float: left;
	cursor: pointer;
}

.app-setup-wrap #conf-form-fields td.has-checkbox {
    display: flex;
    flex-wrap: wrap;
    row-gap: 10px;
}

.app-setup-exit-wrap {
	display: flex;
	justify-content: center;
	margin-top: 20px;
}

.app-setup-wrap .app-timetable-wrapper {
	margin: 0 0 10px 0;
	width: 100%;
}

.app-setup-wrap  .app-timetable-title {
	width: calc(100% - 3px);
}

.app-setup-wrap .app-timetable-cell {
	width: calc( 20% - 0.5px);
}

.app-setup-wrap .page-info {
	margin-bottom: 10px;
	font-weight: 500;
}

.app-setup-wrap .app-view-sample img,
.app-setup-wrap .app-account-sample img {
    max-width: 100%;
}

.app-setup-wrap .form-table th.app-samples {
	font-weight: 400;
}

/*--------------------------------------------------------------
*** Schedules
--------------------------------------------------------------*/

#app-schedules .app-front-admin h2 {
	margin: 0;
}

#app-schedules .ec-week-view .ec-event.long,
#app-schedules .ec-day-view .ec-event.long {
	display:none;
}

.app-schedules-group {
	position: relative;
	margin-left: -20px;
}

.app-account-page .app-schedules-group {
	margin-left: 0;
}

.app-schedules-group #app-navbar {
	z-index: 100;
	overflow: hidden;
}

#schedules-filter .app-dash-title {
	display: none;
}

#schedules-filter div.app-actions {
	justify-content: space-around;
    gap: 10px 20px;
}

#schedules-filter .app-filter-ms {
	width: 180px;
	max-width: 400px;
}

#schedules-filter .app-filter-stats {
	width: 150px;
	max-width: 200px;
}

#schedules-filter .app-filter-weekdays {
	width: 120px;
	max-width: 200px;
}

#schedules-filter button.ui-multiselect {
	width: 100%;
}

.app-filter-services.app-filter-ms {
    flex-grow: 2;
}

.app-filter-workers.app-filter-ms {
    flex-grow: 0.5;
}

.has-color .ui-multiselect-checkboxes label span {
    margin-right: auto;
}

.has-color .ui-multiselect-checkboxes label {
    display: flex;
    padding: 3px 1px 3px 3px;
    text-indent: 0;
    justify-content: space-between;
}

.has-color .ui-multiselect-checkboxes a.pickcolor {
	width: 20px;
	padding: 0;
	margin-right: 3px;
	cursor: default;
}

.has-color .ui-multiselect-checkboxes input {
	align-self: center;
}

body[class*="schedules"] .ui-multiselect-header.ui-widget-header,
body.app-account-schedules .ui-multiselect-header.ui-widget-header {
	font-size: 11px;
}

body[class*="schedules"] .ui-multiselect-header.ui-widget-header a,
body.app-account-schedules .ui-multiselect-header.ui-widget-header a {
	display: flex;
	align-items: center;
}

body[class*="schedules"] .ui-multiselect-menu,
body.app-account-schedules .ui-multiselect-menu {
	z-index: 1010;
}

body[class*="schedules"] .app-users-quick-book.ui-multiselect-menu,
body.app-account-schedules .app-users-quick-book.ui-multiselect-menu {
	z-index: 10002;
	font-size: 11.5px;
}

.bp-user .app-users-quick-book.ui-multiselect-menu span {
	font-size: 11.5px !important;
}

#schedules-filter .app-schedule-picker {
	width: 120px;
}

#schedules-filter .app-page .tablenav .actions {
    padding-right: 20px;
}

.app-front-admin #schedules-filter div.app-actions {
	margin-top: 10px;
}

.app-schedule-select.ui-widget {
	font-size: 13px;
}

#schedules-filter .app-schedule-start {
	position: absolute;
	z-index:101;
	opacity: 0;
	width: 120px;
	font-size: 13px;
}

#schedules-filter .app-schedule-start-alt {
	z-index:100;
	width: 120px;
	font-size: 13px;
}

@media screen and (max-width: 782px) {
	#schedules-filter input {
		min-height: 30px;
	}
}

#app-schedules {
	-webkit-text-size-adjust: 100%;
    -webkit-tap-highlight-color: transparent;
    font-size: 1rem;
    font-weight: 400;
    line-height: 1.5;
    color: #212529;
    text-align: left;
    background-color: transparent;
	margin-left: 20px;
}

.app-account-page #app-schedules {
	margin-left: 0;
}

#app-schedules .app-sched {
    position: relative;
    display: flex;
    flex-direction: column;
    min-width: 0;
    word-wrap: break-word;
    background-color: #fff;
    background-clip: border-box;
    border: 1px solid rgba(0, 0, 0, .125);
    border-radius: .25rem;
	margin-top: 0;
    padding: 0;
    max-width: none;
    box-shadow: none;
	box-sizing: border-box;
}

#app-schedules .app-sched-body {
    flex: 1 1 auto;
    min-height: 1px;
    padding: 1.25rem;
}

#app-schedules .ec-toolbar {
	flex-direction: row-reverse;
}

#app-schedules .ec-start {
    display: flex;
    flex-direction: row-reverse;
}

#app-schedules .ec-toolbar>*>:not(:last-child) {
    margin-right: 0;
}

#app-schedules .btn-group,
#app-schedules .btn-group-vertical {
    position: relative;
    display: inline-flex;
    vertical-align: middle;
}

#app-schedules .btn-default:not(:disabled):not(.disabled).active,
#app-schedules .btn-default:not(:disabled):not(.disabled):active {
    color: #212529;
    background-color: rgb(229.5, 229.5, 229.5);
    border-color: rgb(169.6773255814, 180.125, 190.5726744186);
}

#app-schedules .btn-group>.btn-group:not(:last-child)>.btn {
    border-top-right-radius: 0;
    border-bottom-right-radius: 0;
}

#app-schedules .btn-default:hover {
    color: #212529;
    background-color: rgb(235.875, 235.875, 235.875);
    border-color: rgb(176.9418604651, 186.5, 196.0581395349);
}

#app-schedules .btn-group-vertical>.btn,
#app-schedules .btn-group>.btn {
    position: relative;
    flex: 1 1 auto;
}

#app-schedules .btn:hover {
    color: #212529;
    text-decoration: none;
}

#app-schedules .btn {
    white-space: nowrap;
}

#app-schedules .btn {
    display: inline-block;
    font-weight: 400;
    color: #212529;
    text-align: center;
    vertical-align: middle;
    -webkit-user-select: none;
    -moz-user-select: none;
    user-select: none;
    background-color: transparent;
    border: 1px solid transparent;
    padding: .375rem .75rem;
    font-size: 1rem;
    line-height: 1.5;
    border-radius: .25rem;
    transition: color .15s ease-in-out, background-color .15s ease-in-out, border-color .15s ease-in-out, box-shadow .15s ease-in-out;
}

#app-schedules .btn-default {
    color: #212529;
    background-color: #fff;
    border-color: #ced4da;
}

#app-schedules .ec .ec-toolbar>*>:not(:first-child) {
    margin-left: .75em;
}

#app-schedules .ec .ec-toolbar>*>:not(:first-child) {
    margin-right: .75em;
}

#app-schedules .btn:not(:disabled) {
    cursor: pointer;
}

#app-schedules .ec .ec-toolbar>*>* {
    margin-bottom: .5em;
}

#app-schedules .btn-default:hover {
    color: #212529;
    background-color: rgb(235.875, 235.875, 235.875);
    border-color: rgb(176.9418604651, 186.5, 196.0581395349);
}

#app-schedules .ec-event:not(.ec-pointer) {
	cursor: pointer;
    color: inherit;
    padding: 2px 2px 2px 5px;
    border-radius: 8px;
	border: 1px solid #f0f0f0;
	box-shadow: -.5px 0 0 #f0f0f0;
    overflow: hidden;
    display: flex;
}

#app-schedules .ec-week-view .ec-event,
#app-schedules .ec-day-view .ec-event {
	/* font-size: 12px; */
}

#app-schedules .ec-month-view .ec-event:not(.ec-pointer) {
	outline: 2px solid #f0f0f0;
}

#app-schedules .ec-events {
	cursor: cell;
}

#app-schedules .ec:not(.ec-month-view) .ec-events {
	margin-right: 0;
}

#app-schedules .ec-month-view .ec-event,
#app-schedules .ec-week-view:not(.ec-list) .ec-event.long,
#app-schedules .ec-day-view:not(.ec-list) .ec-event.long,
#app-schedules .ec-timeline .ec-event {
	max-height: 48px;
}

#app-schedules .ec-month-view .ec-event {
	left: 3px;
}

#app-schedules .ec-month-view .ec-events:not(.ec-preview) .ec-event:hover,
#app-schedules .ec-week-view .ec-events:not(.ec-preview) .ec-event.long:hover,
#app-schedules .ec-day-view .ec-events:not(.ec-preview) .ec-event.long:hover {
	max-height: 100%;
}

#app-schedules .ec:not(.ec-timeline) .ec-events:not(.ec-preview) .ec-event:hover {
    height: auto !important;
    z-index: 99 !important;
}

#app-schedules .ec:not(.ec-timeline) .ec-events:not(.ec-preview) .ec-event:not(.long):hover {
	width: max(100% , 144px) !important;
}

#app-schedules .ec:not(.ec-timeline) .ec-events:not(.ec-preview) .ec-event.long:hover {
	min-width: 144px !important;
}

#app-schedules .ec.ec-timeline .ec-events.ec-preview .ec-event:hover {
	width: 100% !important;
}

#app-schedules .ec-timeline .ec-event:hover {
	max-height: unset;
}

#app-schedules .ec-timeline .ec-event:not(.long):hover {
	width: 144px !important;
}

#app-schedules .ec-resource,
#app-schedules .ec-timeline .ec-events {
    min-height: 48px;
}

#app-schedules .ec-resource,
#app-schedules .ec-timeline .ec-days {
	flex-basis: 50px !important;
}

#app-schedules .ec-event-body {
	display: block;
}

#app-schedules .ec-event-time {
    position: relative;
    font-weight: 700;
    line-height: 1.3em;
	margin: 0 3px 0 0;
    max-width: 100%;
    text-overflow: ellipsis;
}

#app-schedules .ec-event-title {
    position: relative;
    position: sticky;
    line-height: 1.3em;
	min-height: 1.5em;
    text-overflow: ellipsis;
    white-space: nowrap;
}

#app-schedules .ec-month-view .ec-event-time,
#app-schedules .ec-month-view .ec-event-title,
#app-schedules .ec-resource-day-view .ec-event-time,
#app-schedules .ec-resource-day-view .ec-event-title {
	line-height: 1.5em;
}

#app-schedules .ec-week-view .ec-event-time,
#app-schedules .ec-week-view .ec-event-title {
	line-height: 1.65em;
}

#app-schedules .ec-timeline .ec-body {
	overflow-x: visible;
	overflow-y: hidden;
}

.app-js-schedules .ec-bg-event {
	cursor: not-allowed;
}

#app-schedules .ec-pointer,
.app-js-schedules .ec-extra {
    cursor: cell !important;
}

#app-schedules .ec-resource span {
	padding-top: 0;
}

#app-schedules .ec-resource > span {
	display: flex;
    justify-content: space-between;
	gap: 5px;
	width: 100%;
	max-width: 200px;
	margin: auto;
	padding-top: 4px;
}

#app-schedules .ec-resource .app-ec-title {
    max-width: 150px;
    line-height: 18px;
	align-self: center;
}

#app-schedules .app-ec-img img.avatar {
	border-radius: 5px;
}

.app-panel-wrap {
  position: fixed;
  top: 0;
  bottom: 0;
  right: 0;
  width: 320px;
  transform: translateX(100%);
  transition: .3s ease-out;
  z-index: 10000;
}

.app-panel-wrap.left {
	left: 0;
	transform: translateX(-100%);
	transition: .3s ease-out;
}

.app-panel-wrap.open {
  transform: translateX(0%);
  transition: .3s ease-out;
}

.app-panel-wrap .app-dock-left span.dashicons {
	margin: 0;
}

.app-panel-wrap .app-dock-left.button-secondary,
.app-panel-wrap .app-close-panel.button-secondary {
	line-height: 1.5;
	padding: 5px;
	position: absolute;
	right: 22px;
	top: 40px;
	z-index: 10000;
}

.app-panel-wrap .app-close-panel.button-secondary {
	left: 16px;
	width: 32px;
}

.app-panel-wrap .app-dock-left.left .dashicons-align-pull-left {
	display: none;
}

.app-panel-wrap .app-dock-left:not(.left) .dashicons-align-pull-right {
	display: none;
}

.app-panel {
  position: absolute;
  top: 0;
  bottom: 0;
  left: 0;
  right: 0;
  background: #f6f6f6;
  color: #50575e;
  overflow: auto;
  padding: 30px 10px 10px 15px;
  border-left: 1px solid #ddd;
  border-right: 1px solid #ddd;
  box-shadow: 0px 10px 40px -3px rgba(0, 0, 0, .1), 0 2px 4px -1px rgba(0, 0, 0, .2);
  font-size: 13px;
}

.app-manage .app-panel h3 {
    margin-top: 1.5em;
}

.app-manage .app-panel .inline-edit-row {
	box-shadow: none;
}

.app-manage .app-panel .inline-edit-row fieldset label span.input-text-wrap {
    margin-right: 0;
}

.app-panel .inline-edit-row fieldset label {
    margin: .5em 0;
}

.app-panel .inline-edit-row fieldset .app-quick-book-user-fields label {
    margin: .1em 0;
}

.app-manage .app-panel .inline-edit-row fieldset label span.title {
    width: 6em;
}
.app-manage .app-panel .inline-edit-row fieldset label span.input-text-wrap {
    margin-left: 6em;
}

#app-panel .app_iedit_time input[type="text"],
#app-panel select.app-admin-time {
    font-size: 11.5px;
}

.app-manage .app-panel select.app_users,
.app-manage .app-panel select.app_extras {
    width: 100%;
}

.app-manage .app-panel button.app_users {
	width: 100% !important;
}

.app-panel button.ui-multiselect {
	font-size: 11.5px;
}

.app-manage .app-panel .inline-edit-save {
    margin-top: 20px;
}

.app-panel h3.app_iedit_app_h {
    font-size: 1.1em;
	text-align: center;
}

.app-panel div.error,
.app-panel div.notice {
	margin: 0;
	padding: 5px 10px;
}

.app-panel div.notice {
	font-size: 12px;
}

.app-panel .app-admin-notice:empty,
.app-panel .app-notice:empty,
.app-panel .app-error:empty {
	display: none;
}

@media screen and (max-width: 782px) {
	#app-panel .inline-edit-row fieldset label span.title {
		float: left;
	}
	#app-panel .inline-edit-row span.title {
        font-size: 13px;
    }
	#app-panel .inline-edit-row fieldset label span.input-text-wrap {
        margin-left: 6em;
    }
	#app-panel select {
		min-height: 30px;
	}
	#app-panel input[type=text], #app-panel select, #app-panel textarea {
		min-height: 30px;
		font-size: 14px;
	}
	#app-panel input[type=text] {
		padding: 0 8px;
        min-height: 30px;
	}
	#app-panel input[type=checkbox] {
		height: 1rem;
        width: 1rem;
	}
	#app-panel .app_iedit_time input[type="text"],
	#app-panel select.app-admin-time {
		font-size: 11.5px;
	}
}
