/**
 * BASIC LINK STYLE
 * Link styles to match the website
*/

.wpheka-page-wrapper a {
	color: #5333ed;
	text-decoration: none;
	border-bottom: 2px solid #2cd4d9;
	position: relative;
}

.wpheka-page-wrapper a:before {
	width: 0;
	position: absolute;
	content: " ";
	border-bottom: 2px solid #5333ed;
	transition: all 120ms linear;
	height: 100%;
	top: 0;
}

.wpheka-page-wrapper a:hover:before {
	width: 100%;
}

/**
 *  KINSTA PAGE BAR
 *  Shown at the top of all admin pages
 */
.wpheka-page-bar {

	/*max-width:1133px;*/
	background: #fff;
	position: relative;
	box-sizing: border-box;
	padding: 16px 22px;
	margin-top: 20px;
	display: flex;
	align-items: center;
	margin-bottom: 20px;
	border: 1px solid #e4e4e4;
}

.wpheka-page-bar h3 {
	margin: 0;
	color: #555;
	font-weight: 300;
	border-left: 1px solid rgba(0, 0, 0, 0.1);
	padding: 0 0 0 11px;
	font-size: 15px;
}

.wpheka-page-bar .logo {
	margin-right: 11px;
}

.kinstamu-whitelabel .wpheka-page-bar h3 {
	border-left: 0;
	padding-left: 0;
}

/**
 *  GENERAL STRUCTURAL ELEMENTS
 *  Used on all pages to create the sidebar and content structure and other
 *  common elements
 */

.wpheka-page-wrapper * {
	box-sizing: border-box;
}

.wpheka-page-wrapper {
	display: flex;
	flex-direction: row-reverse;
	margin-top: 30px;
}

.wpheka-sidebar {
	flex: 0 0 280px;
	width: 280px;
	margin-left: 33px;
}

.wpheka-main-content {

	/*max-width:820px;*/
	width: 100%;
}

.wpheka-flex {
	display: flex;
	align-items: center;
}

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

	.wpheka-page-wrapper {
		display: block;
	}

	.wpheka-sidebar {
		display: block;
		width: 100%;
		margin-left: 0;
		margin-top: 22px;
	}
}

/**
 *  KINSTA BOX
 *  Used all over on the admin, a structure with a deep blue header and
 *  a white content area
 */

.wpheka-box-title-bar {
	background: #42495b;
	padding: 16px;
	display: block;
	width: 100%;
}

.wpheka-box-title-bar h3 {
	color: #fff;
	font-weight: 400;
	margin: 0;
	font-size: 14px;
	padding: 0;
}

.wpheka-box-title-bar__small {
	padding: 11px 16px;
}

.wpheka-box-title-bar__small h3 {
	font-size: 13px;
}

.wpheka-box-content {
	background: #fff;
	padding: 22px;
	border: 1px solid #e4e4e4;
	border-top: 0;
}

/**
 *  TYPOGRAPHY
 *  Some basic typography rules on our admin pages
 */

.wpheka-page-wrapper .mb0 {
	margin-bottom: 0;
}

.wpheka-page-wrapper .mb6 {
	margin-bottom: 6px;
}

.wpheka-page-wrapper .mb11 {
	margin-bottom: 11px;
}

.wpheka-page-wrapper .mb22 {
	margin-bottom: 22px;
}

.wpheka-page-wrapper .mb33 {
	margin-bottom: 33px;
}

.wpheka-page-wrapper .mb44 {
	margin-bottom: 44px;
}

.wpheka-page-wrapper .mr0 {
	margin-right: 0;
}

.wpheka-page-wrapper .mr6 {
	margin-right: 6px;
}

.wpheka-page-wrapper .mr11 {
	margin-right: 11px;
}

.wpheka-page-wrapper .mr22 {
	margin-right: 22px;
}

.wpheka-page-wrapper .mr33 {
	margin-right: 33px;
}

.wpheka-page-wrapper .mr44 {
	margin-right: 44px;
}

.wpheka-page-wrapper p {
	margin: 0 0 22px;
	line-height: 28px;
	font-weight: 300;
	font-size: 16px;
}

.wpheka-page-wrapper .content > *:last-child {
	margin-bottom: 0;
}

/**
 *  KINSTA WIDGET
 *  Styles common to all widgets
 */

.wpheka-widget {
	margin-bottom: 33px;
}

/**
 * KINSTA FORM GENERAL
 */

.wpheka-control-container {
	position: relative;
	padding-right: 22px;
}

/**
     * KINSTA NUMBER FIELD
     */

.wpheka-number-field {
	padding: 3px 0;
}

.wpheka-number-field .wpheka-control {
	width: 68px;
	color: #888;
	text-align: center;
	box-sizing: border-box;
	background: linear-gradient(to bottom, #eee, #fff 25px);
	background-image: -webkit-linear-gradient(top, #eee, #fff 25px);
	box-shadow:
		inset 0 -1px #fff,
		inset 0 1px 1px rgba(0, 0, 0, 0.05);
	margin-right: 11px;
}

/**
      * KINSTA SELECT FIELD
      */

.wpheka-select-field {
	padding: 3px 0;
}

.wpheka-select-field .wpheka-control {
	color: #888;
	text-align: center;
	box-sizing: border-box;
	background: linear-gradient(to bottom, #eee, #fff 25px);
	background-image: -webkit-linear-gradient(top, #eee, #fff 25px);
	box-shadow:
		inset 0 -1px #fff,
		inset 0 1px 1px rgba(0, 0, 0, 0.05);
	margin-right: 11px;
}

/**
     *  ANIMATED SWITCH CHECKBOX
     *  Full CSS animated sliding yes/no indicator
    */

.wpheka-switch {
	display: flex;
	align-items: center;
	padding: 6px 0;
}

.wpheka-switch .wpheka-control-ui {
	position: relative;
	display: inline-block;
	vertical-align: top;
	width: 70px;
	height: 30px;
	padding: 3px;
	margin-right: 11px;
	background: linear-gradient(to bottom, #eee, #fff 25px);
	background-image: -webkit-linear-gradient(top, #eee, #fff 25px);
	border-radius: 18px;
	box-shadow:
		inset 0 -1px #fff,
		inset 0 1px 1px rgba(0, 0, 0, 0.05);
	cursor: pointer;
}

.wpheka-switch .wpheka-control {
	position: absolute;
	top: 0;
	left: 0;
	opacity: 0;
}

.wpheka-switch-label {
	position: relative;
	display: block;
	height: inherit;
	font-size: 11px;
	font-weight: 600;
	text-transform: uppercase;
	background: #eceeef;
	border-radius: inherit;
	box-shadow:
		inset 0 1px 2px rgba(0, 0, 0, 0.12),
		inset 0 0 2px rgba(0, 0, 0, 0.15);
}

.wpheka-switch-label:before,
.wpheka-switch-label:after {
	position: absolute;
	top: 50%;
	margin-top: -0.5em;
	line-height: 1;
	-webkit-transition: inherit;
	-moz-transition: inherit;
	-o-transition: inherit;
	transition: inherit;
}

.wpheka-switch-label:before {
	content: attr(data-off);
	right: 11px;
	color: #aaa;
	text-shadow: 0 1px rgba(255, 255, 255, 0.5);
}

.wpheka-switch-label:after {
	content: attr(data-on);
	left: 11px;
	color: #fff;
	text-shadow: 0 1px rgba(0, 0, 0, 0.2);
	opacity: 0;
}

.wpheka-switch .wpheka-control:checked ~ .wpheka-switch-label {
	background: #8ce196;
	box-shadow:
		inset 0 1px 2px rgba(0, 0, 0, 0.15),
		inset 0 0 3px rgba(0, 0, 0, 0.2);
}

.wpheka-switch .wpheka-control:checked ~ .wpheka-switch-label:before {
	opacity: 0;
}

.wpheka-switch .wpheka-control:checked ~ .wpheka-switch-label:after {
	opacity: 1;
}

.wpheka-switch-handle {
	position: absolute;
	top: 4px;
	left: 4px;
	width: 28px;
	height: 28px;
	background: linear-gradient(to bottom, #fff 40%, #f0f0f0);
	background-image: -webkit-linear-gradient(top, #fff 40%, #f0f0f0);
	border-radius: 100%;
	box-shadow: 1px 1px 5px rgba(0, 0, 0, 0.2);
}

.wpheka-switch-handle:before {
	content: "";
	position: absolute;
	top: 50%;
	left: 50%;
	margin: -6px 0 0 -6px;
	width: 12px;
	height: 12px;
	background: linear-gradient(to bottom, #eee, #fff);
	background-image: -webkit-linear-gradient(top, #eee, #fff);
	border-radius: 6px;
	box-shadow: inset 0 1px rgba(0, 0, 0, 0.02);
}

.wpheka-switch .wpheka-control:checked ~ .wpheka-switch-handle {
	left: 40px;
	box-shadow: -1px 1px 5px rgba(0, 0, 0, 0.2);
}

.wpheka-switch-label,
.wpheka-switch-handle {
	transition: all 0.3s ease;
	-webkit-transition: all 0.3s ease;
	-moz-transition: all 0.3s ease;
	-o-transition: all 0.3s ease;
}

/**
     *  KINSTA BUTTON
     *  Basic buttons styles and progress button addon
    */

.wpheka-button {
	display: inline-block;
	box-sizing: border-box;
	padding: 11px 22px;
	outline: none;
	border: 2px solid #5333ed;
	background-color: #5333ed;
	color: #fff;
	text-transform: uppercase;
	letter-spacing: 1px;
	font-size: 14px;
	position: relative;
	overflow: hidden;
	-webkit-appearance: none;
	text-decoration: none;
	cursor: pointer;
	transition: background 200ms linear;
	font-weight: 300;
	border-radius: 100px;
}

.wpheka-button:hover {
	background: #fff;
	color: #5333ed;
}

.wpheka-button__full {
	text-align: center;
	display: block;
	width: 100%;
}

.wpheka-button__full-left {
	text-align: left;
	display: block;
	width: 100%;
}

.wpheka-button__large {
	padding: 22px;
}

.wpheka-button__white {
	background: #fff;
	color: #888;
}

.wpheka-button__white:hover {
	background: #f1f1f1;
}

.wpheka-button .progress {
	position: absolute;
	left: 0;
	bottom: 0;
	width: 100%;
	height: 12px;
	background-color: transparent;
}

.wpheka-button .progress-bar {
	height: 12px;
	width: 0%;
	background: rgba(0, 0, 0, 0.25);
}

.wpheka-button .text {
	display: inline-block;
}

/**
     *  KINSTA DROPDOWN
     *  Styles for the dropdown functionality
    */

.wpheka-dropdown {
	position: relative;
	display: inline-block;
}

.wpheka-dropdown__full {
	display: block;
	width: 100%;
}

.wpheka-dropdown > .wpheka-button {
	background-image: url(../images/arrow-down.svg);
	background-repeat: no-repeat;
	background-position: calc(100% - 20px) calc(50% - 1px);
	background-size: 13px;
	padding-right: 44px;
}

.wpheka-dropdown-content {
	display: none;
	position: absolute;
	background-color: #fff;
	width: 100%;
	min-width: 160px;
	box-shadow: 0 8px 16px 0 rgba(0, 0, 0, 0.2);
	border-radius: 100px;
}

.wpheka-dropdown-content > a,
.wpheka-dropdown-content > span {
	color: #000;
	padding: 12px 16px;
	text-decoration: none;
	display: block;
	cursor: pointer;
}

.wpheka-dropdown-content button {
	border-radius: 0 !important;
	border: 0 !important;
}

.wpheka-dropdown-content button:first-of-type {
	border-top-right-radius: 30px !important;
	border-top-left-radius: 30px !important;
}

/*    .wpheka-dropdown-content button:last-of-type {
        border-bottom-right-radius: 100px !important;
        border-bottom-left-radius: 100px !important;
    }*/

.wpheka-dropdown-content > a:hover,
.wpheka-dropdown-content > span:hover {
	background-color: #f1f1f1;
}

.wpheka-dropdown:hover .wpheka-dropdown-content {
	display: block;
}

.wpheka-dropdown:hover > .wpheka-button {
	background-color: #5333ed;
	color: #fff;
}

/**
 *  KINSTA QUICKSAVE
 *  Styles for the quicksave functionality
 */

.wpheka-quicksave-message {
	margin-left: 11px;
	display: inline-block;
	color: #fff;
	padding: 4px 11px;
}

.wpheka-quicksave-success {
	background: #78db7b;
}

.wpheka-quicksave-error {
	background: #fb8686;
}

/**
 *  KINSTA MESSAGE
 *  Styles for error and success messages
 */

.wpheka-message {
	display: block;
	color: #fff;
	padding: 11px;
	margin-bottom: 22px;
}

.wpheka-message-success {
	background: #78db7b;
}

.wpheka-message-error {
	background: #fb8686;
}

.wpheka-inbox-message-warning {
	background-color: #dcbb18;
	margin: 0 -22px 22px -22px;
	position: relative;
	padding: 22px 22px 22px 55px;
	text-align: justify;
	line-height: 28px;
	font-weight: 300;
	font-size: 16px;
}

.wpheka-inbox-message-warning:before {
	content: "";
	position: absolute;
	left: 0;
	top: 0;
	height: 100%;
	width: 44px;
	display: block;
	background-image: url(../images/warning.svg);
	background-color: rgba(0, 0, 0, 0.1);
	background-size: 28px 28px;
	background-repeat: no-repeat;
	background-position: 8px center;
}

/**
     *  KINSTA TOOLTIPS
     *  Styles for the tooltips
    */

.wpheka-tooltip {
	position: absolute;
	top: 11px;
	right: 0;
	opacity: 0.4;
}

.wpheka-tooltip:hover {
	opacity: 1;
}

.wpheka-tooltip-content {
	display: none;
}

/**
 *  KINSTA TABLE
 *  Simple Table Layout
 */

.wpheka-table {
	width: 100%;
	border-collapse: collapse;
}

.wpheka-table th {
	padding: 11px;
	text-align: left;
	border-bottom: 1px solid #ddd;
}

.wpheka-table td {
	padding: 11px;
}

.wpheka-table tbody tr:nth-of-type(odd) {
	background: #f1f1f1;
}

/**
     *  CACHE PURGE FORM
    */
#wpheka-custom-form {
	padding: 22px;
	background: #f1f1f1;
}

#wpheka-custom-form h3 {
	margin: 0 0 11px;
	font-size: 14px;
}

#wpheka-custom-form-fields {
	display: flex;
	align-items: center;
}

#wpheka-custom-form select {
	margin-right: 4px;
	background: #fff;
	font-size: 13px;
	line-height: 22px;
	-webkit-appearance: none;
	-moz-appearance: none;
	appearance: none;
	padding: 3px 33px 3px 14px;
	box-sizing: content-box;
	background-repeat: no-repeat;
	background-position: calc(100% - 11px) center;
	background-image: url('data:image/svg+xml;utf8,<svg height="10px" id="Livello_1" style="enable-background:new 0 0 50 50;" version="1.1" viewBox="0 0 50 50" width="10px" xml:space="preserve" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink"><path d="M44.27,15.401c-0.068-0.165-0.229-0.272-0.407-0.272H6.139c-0.18,0-0.34,0.107-0.408,0.272  c-0.068,0.164-0.03,0.355,0.096,0.48l18.861,18.861c0.086,0.086,0.199,0.129,0.312,0.129c0.112,0,0.225-0.043,0.312-0.129  l18.862-18.861C44.301,15.756,44.338,15.565,44.27,15.401z"/></svg>');
}

#wpheka-custom-form .prefix {
	background: #fff;
	padding: 6px 2px 6px 11px;
	border: 1px solid #ddd;
	border-right: 0;
	font-size: 13px;
	line-height: 22px;
	margin-right: -2px;
	box-shadow: none;
	white-space: nowrap;
}

#wpheka-custom-form input[type="text"] {
	background: #fff;
	box-shadow: none;
	font-size: 13px;
	width: 100%;
	line-height: 22px;
	padding: 6px 6px 6px 2px;
	border: 1px solid #ddd;
	border-left: 0;
}

#wpheka-custom-form input[type="submit"] {
	font-size: 13px;
	line-height: 22px;
	padding: 6px 11px;
	background: #5333ed;
	border: 1px solid #5333ed;
	color: #fff;

	/*border:0px;*/
	cursor: pointer;
	margin: 0;
	margin-left: -2px;
	border-top-right-radius: 22px;
	border-bottom-right-radius: 22px;
}