/*!
 * Go Night Dark Mode/Night Mode WordPress Plugin
 * Author: Web_Trendy
 * Copyright 2020 - 2021 © Web_Trendy (https://codecanyon.net/user/web_trendy/portfolio)
 * Licensed under GPL v2 or Later
 *
 * "Open your hands if you want to be held." -Rumi
 *
 */ 




 /*------------------------------------------------------------------
[Table of contents]

1.0 Variables
2.0 Main Styles
3.0 Cursor Styles 
4.0 Media Queries
-------------------------------------------------------------------*/


/*--------------------------------------------------------------
1.0 Variables
--------------------------------------------------------------*/
$dark-color: #555;
$blue: #4eafe2;
$gray: #ebebeb;
$transition: all 300ms ease;

/*--------------------------------------------------------------
1.0 Main Styles
--------------------------------------------------------------*/
 
/*Remove Old Styles*/
.wt-tabs {
	margin-top: 10px;
	padding: 0 10px;
	border-bottom: 1px solid #ccc;
	a {
		text-decoration: none !important;
		padding: 10px 15px;
		border-top-right-radius: 5px;
		border-top-left-radius: 5px;
		margin-right: 3px;
		display: inline-block;
		font-weight: 600;
		color: lighten($dark-color, 10%);
		border: 1px solid lighten($dark-color, 50%);
	    border-bottom: none;
	    float: left;
		background-color: lighten($dark-color, 55%);
		&:hover, &:focus {
			color: darken($dark-color, 5%);
			text-decoration: none !important;
			background-color: white;
		}
		&.active {
			background-color: lighten($dark-color, 61%);
			margin-bottom: -1px;
			border-bottom: 1px solid lighten($dark-color, 61%);
		}
	}
	&:after {
		content: "";
	    display: table;
	    clear: both;
	}
}
.wt-tab-content {
	padding: 10px;
}


/*Form Styles*/
.wt-icon {
	width: 20px;
}

.label-title {
	font-weight: 500;
}
.label-desc {
	font-size: 80%;
	margin: 5px 0;
	color: #aaa;
}

.wt-form-row {
	& > th:first-child {
		display: none;
		& + td {
			padding-left: 0;
			padding-top: 0;
		}
	}
}
.form-table {
	margin-top: 0;
}
.wt-body {
	form {
		h2 {
			color: #4eafe2;
			margin: 50px 0 0;
		    display: inline-block;
		}
	}
}

/*--------------------------------------------------------------
1.0 General Styles
--------------------------------------------------------------*/

/*Toggler*/
.toggler-wrapper {
	display: flex;
	align-items: center;
	width: 40px;
	height: 20px;
	cursor: pointer;
	position: relative;
	input[type="checkbox"] {
		display: none;
		&:checked {
			&+.toggler-slider {
				background-color: #44cc66;
			}
		}
	}
	.toggler-slider {
		background-color: #ccc;
		position: absolute;
		border-radius: 100px;
		top: 0;
		left: 0;
		width: 100%;
		height: 100%;
		transition: $transition;
	}
	.toggler-knob {
		position: absolute;
		transition: $transition;
	}
	.placeholder {
		margin-left: 55px;
	    min-width: max-content;
	    display: inline-block;
	}
}
.toggler-wrapper.style-4 {
	input[type="checkbox"] {
		&:checked {
			&+.toggler-slider {
				.toggler-knob {
					left: calc(100% - 20px);
				}
			}
		}
	}
	.toggler-knob {
		width: 20px;
		height: 20px;
		border-radius: 50%;
		left: 0;
		top: 0;
		background-color: white;
		box-shadow: 0 2px 6px rgba(153,153,153,0.75);
	}
}

/*Badge Checkbox/Radio*/
.wt-badge-radiocheck {
	input[type="radio"], input[type="checkbox"] {
		display: none;
		&+label {
			background-color: lighten($dark-color, 55%);
			color: lighten($dark-color, 10%);
			padding: 7px 15px;
			border-radius: 5px;
			font-size: 90%;
		}
		&:checked {
			&+label {
				background-color: lighten($dark-color, 5%);
				color: lighten($dark-color, 60%);
			}
		}
	}
}

/*Links*/
.wt-links {
	text-decoration: none !important;
	color: $blue;
	&:hover, &:focus {
		color: darken($blue, 15%);
	}
}

.wt-hide {
	display: none;
}

/*Form*/
.wt-desc {
	display: inline-flex;
	align-items: center;
	color: #999;
	font-size: 85%;
	font-weight: 300;
	margin-top: 5px;
	font-style: normal;
}
.img-select {
	/*height: 30px;*/
	margin-right: 10px;
}
.code-box {
	span {
		background-color: white;
	    padding: 10px 15px;
	    border-radius: 5px;
	    display: inline-block;
	    color: #aaa;
	    font-size: 1.3em;
	    font-weight: 300;
	}
}

.custom-select {
	height: 38px !important;
	padding-left: 10px !important;
	width: 100px !important;
    flex: none !important;
    &+.input-group-append {
    	flex-grow: 1;
    }
	&+.input-group-append input {
		border-top-left-radius: 0px !important;
		border-bottom-left-radius: 0px !important;
	}
}

/*Replace Logo Styles*/
.wpcc-imageselector {
	border: 1px dashed #a2aab2;
    background-color: #edeff0;
    line-height: 20px;
    padding: 8px 0;
    text-align: center;
    cursor: pointer;
    transition: all 200ms ease;
    margin-top: 5px;
    &+.image-box {
    	display: inline-block;
    	position: relative;
    }
    &.deactive {
    	display: none;
    	&+.image-box {
    		margin-top: 20px;
    		background-color: #f1f1f1;
    	}
    }
    &:hover {
    	background-color: #f8f9f9;
    }
}


.wpcc_preview {
	width: 300px;
	position: relative;
}
.wpcc_image {
	max-width: 100%;
}
.wpcc_delete_image {
	position: absolute;
	top: -15px;
	right: -15px;
	background-color: #ff1818;
	cursor: pointer;
	border-radius: 50%;
	width: 30px;
	height: 30px;
	display: flex;
	align-items: center;
	justify-content: center;
	transition: $transition;
	opacity: 0;
	transform: scale(0.8);
    svg {
		width: 15px;
	}
}
.wpcc_delete_image.active {
	opacity: 1;
	transform: scale(1);
}



/*New Styles*/

/*General*/
::-webkit-input-placeholder { 
  font-weight: 300;
  font-size: 0.8rem;
}
::-moz-placeholder { 
  font-weight: 300;
  font-size: 0.8rem;
}
:-ms-input-placeholder { 
  font-weight: 300;
  font-size: 0.8rem;
}
:-moz-placeholder { 
  font-weight: 300;
  font-size: 0.8rem;
}
.mw-150 {
	min-width: 150px;
}
.nav-pills .nav-link {
	border-radius: 1.25rem !important;
}
.theme-sticky {
	position: sticky;
	top: 50px;
}
.theme-round {
	border-radius: 15px;
}
.btn-group {
	.btn-warning {
		background-color: #ffe289;
	    border-color: #ffd75d;
    	&.active {
    		background-color: #fbad00;
		    border-color: #ffaa10;
		    box-shadow: none !important;
    	}
	}
}
.theme-col-6 {
    width: calc(100% / 6) !important;
    padding: 0 2px;
}
.theme-col-5 {
    width: calc(100% / 5) !important;
    padding: 0 2px;
}
.inline-lable {
	min-width: max-content;
	padding-right: 20px;
}

/*Vertical Orientation Offset Type*/
.vertical-orientation-offset-type {
	cursor: pointer;
	&.active {
		color: red;
	}
}

/*Horizontal Orientation Offset Type*/
.horizontal-orientation-offset-type {
	cursor: pointer;
	&.active {
		color: red;
	}
}


/*Replace Image List*/
.gn_replaced_image_container {
	img {
		max-width: 200px;
		max-height: 150px;
	}
}
.gn-replace-image-del-btn {
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
    height: 100%;
    display: flex;
    align-items: center;
    justify-content: center;
    button {
    	transition: $transition;
    	transform: scale(1.2);
    	opacity: 0;
    }
    &:hover, &:focus {
    	button {
    		transform: scale(1);
    		opacity: 1;
    	}
    }
}

/*Button Style*/
.gn-button-style {
	&:checked {
		&+label {
			border: 2px solid $blue;
		}
	}
	&+label {
		border: 2px solid $gray;
		border-radius: 5px;
	}
}
.gn-button-style-wrapper {
	.active-img {
		position: absolute;
		top: 0;
		left: 0;
		width: 100%;
		opacity: 0;
	}
	&:hover {
		.active-img {
			opacity: 1;
		}
	}
}


/*Color Palette*/
.gn-color-palette {
	&:checked {
		&+label {
			border: 2px solid $blue;
		}
	}
	&+label {
		border: 2px solid $gray;
		border-radius: 5px;
	}
}

/*Shortcode*/
.gn-shortcode {
    max-width: 100%;
    overflow-x: auto;
    border-top-left-radius: 5px;
    border-bottom-left-radius: 5px;
    height: 40px;
    background-color: #e8e8e8;
    span {
    	display: inline-block;
    	min-width: fit-content;
    	&[id] {
    		padding-right: 5px;
    	}
    }
}
.gn-copy-btn {
	border-top-right-radius: 5px;
    border-bottom-right-radius: 5px;
    cursor: pointer;
}



/*Tippy Animations*/
.tippy-box[data-animation=scale-subtle][data-placement^=top]{transform-origin:bottom}.tippy-box[data-animation=scale-subtle][data-placement^=bottom]{transform-origin:top}.tippy-box[data-animation=scale-subtle][data-placement^=left]{transform-origin:right}.tippy-box[data-animation=scale-subtle][data-placement^=right]{transform-origin:left}.tippy-box[data-animation=scale-subtle][data-state=hidden]{transform:scale(.8);opacity:0}




/* ---------------------Admin Panel Dark Styles--------------------- */
/*$dark-1: #000E14;
$dark-2: #001D29;
$dark-3: #002433;
$dark-4: #002B3D;

$border-1: #022A3C;
$border-2: #EAE2B7;

$links: #FCBF49;

html.gn-dark-mode {
	body, h1, h2, h3, h4, h5, h6, #screen-meta-links .show-settings:active, #screen-meta-links .show-settings:focus, #screen-meta-links .show-settings:hover, input[type=checkbox], input[type=color], input[type=date], input[type=datetime-local], input[type=datetime], input[type=email], input[type=month], input[type=number], input[type=password], input[type=radio], input[type=search], input[type=tel], input[type=text], input[type=time], input[type=url], input[type=week], select, textarea, .widefat tfoot tr td, .widefat tfoot tr th, .widefat thead tr td, .widefat thead tr th, .widefat ol, .widefat p, .widefat ul, .edit-post-sidebar__panel-tab, .components-panel__body-toggle.components-button, .editor-styles-wrapper, .editor-block-types-list__item, .edit-post-layout .components-notice-list, .components-menu-item__button, .components-menu-item__button.components-icon-button, .theme-overlay .theme-tags span, .theme-overlay .theme-description, .menu-item-handle, .widget .widget-top, .plugins, .plugins td, .plugins th, .form-table th, .form-wrap label, .form-wrap p, p.description {
		color: #fff !important;
	}
	a {
		color: $links !important;
	}
	body, .nav-tab-active, .nav-tab-active:focus, .nav-tab-active:focus:active, .nav-tab-active:hover, #wpcontent, #wpcontent div:not(.update-nag):not(#wpadminbar):not(#wpadminbar *):not(.welcome-panel):not(#screen-options-link-wrap):not(#contextual-help-link-wrap):not(.welcome-panel *):not(.postbox):not(.postbox *):not(#screen-meta):not(#screen-meta *):not(.notice):not(.error):not(.updated):not(.row-actions):not(.post-com-count-wrapper):not(.components-notice.is-warning):not(.components-notice.is-warning *):not(.response-links):not(.submitted-on):not(.theme-wrap):not(.theme-wrap *):not(.menu-item-handle):not(.wp-list-table.plugins .column-description *):not(.update-message *):not(.toggler-wrapper):not(.toggler-wrapper *) {
		background-color: $dark-1 !important;
	}
	#update-nag, .update-nag, #contextual-help-link-wrap, #screen-options-link-wrap, .welcome-panel, .postbox, input[type=checkbox], input[type=color], input[type=date], input[type=datetime-local], input[type=datetime], input[type=email], input[type=month], input[type=number], input[type=password], input[type=radio], input[type=search], input[type=tel], input[type=text], input[type=time], input[type=url], input[type=week], select, textarea:not(.editor-post-title__input), #screen-meta, .notice, div.error, div.updated, .comment-ays, .feature-filter, .imgedit-group, .popular-tags, .stuffbox, .widgets-holder-wrap, .wp-editor-container, p.popular-tags, table.widefat, .plugins tr, .components-notice.is-warning, .media-frame-content, .media-modal-content, .theme-overlay .theme-actions, .nav-tab:not(.nav-tab-active), .js .control-section .accordion-section-title:focus, .js .control-section .accordion-section-title:hover, .js .control-section.open .accordion-section-title, .js .control-section:hover .accordion-section-title, .control-section .accordion-section-title, .customize-pane-child .accordion-section-title, .menu-item-handle, .widget .widget-top, .wp-tab-active, ul.add-menu-item-tabs li.tabs, ul.category-tabs li.tabs {
		background-color: $dark-3 !important;
	}
	#activity-widget #the-comment-list .comment-item, .edit-attachment-frame .attachment-info, #elementor-go-to-edit-page-link, #templateside>ul, .select2-container--default .select2-selection--multiple .select2-selection__choice {
		background-color: $dark-2 !important;
	}
	.welcome-panel, .postbox, .postbox .hndle, .stuffbox .hndle, input[type=color], input[type=date], input[type=datetime-local], input[type=datetime], input[type=email], input[type=month], input[type=number], input[type=password], input[type=radio], input[type=search], input[type=tel], input[type=text], input[type=time], input[type=url], input[type=week], select, textarea, #e-dashboard-overview .e-overview__feed .e-overview__heading, #e-dashboard-overview .e-overview__recently-edited .e-overview__heading, #e-dashboard-overview .e-overview__footer, .community-events-footer, .activity-block, #dashboard_activity .subsubsub, #contextual-help-link-wrap, #screen-options-link-wrap, #menu-management .menu-edit, #menu-settings-column .accordion-container, .comment-ays, .feature-filter, .imgedit-group, .manage-menus, .menu-item-handle, .popular-tags, .stuffbox, .widget-inside, .widget-top, .widgets-holder-wrap, .wp-editor-container, p.popular-tags, table.widefat, #menu-management .menu-edit, #menu-settings-column .accordion-container, .comment-ays, .feature-filter, .imgedit-group, .manage-menus, .menu-item-handle, .popular-tags, .stuffbox, .widget-inside, .widget-top, .widgets-holder-wrap, .wp-editor-container, p.popular-tags, table.widefat, .media-frame-content, .edit-attachment-frame .attachment-info, .edit-attachment-frame .edit-media-header .left, .edit-attachment-frame .edit-media-header .right, .upload-php .media-modal-close, .edit-attachment-frame .attachment-info .details, .edit-attachment-frame .attachment-info .settings, .theme-overlay .theme-header, .theme-overlay .theme-actions, .theme-overlay .theme-header .left, .theme-overlay .theme-header .right, .theme-overlay .theme-header .close, .theme-overlay .theme-tags, .nav-tab, .nav-tab-wrapper, .wrap h2.nav-tab-wrapper, h1.nav-tab-wrapper, .menu-item-settings, .link-to-original, .menu-settings, .nav-menus-php #post-body, .accordion-section, .categorydiv div.tabs-panel, .customlinkdiv div.tabs-panel, .posttypediv div.tabs-panel, .taxonomydiv div.tabs-panel, .wp-tab-panel, #nav-menu-header, .wp-tab-active, ul.add-menu-item-tabs li.tabs, ul.category-tabs li.tabs, .control-section.open .accordion-section-title, .widefat thead td, .widefat thead th, .select2-container--default .select2-selection--multiple, .select2-container--default .select2-selection--multiple .select2-selection__choice {
		border-color: $border-1 !important;
	}
	input[type=checkbox] {
		border-color: $border-2 !important;
	}
	#activity-widget #the-comment-list .comment, #activity-widget #the-comment-list .pingback, .wp-core-ui .button, .wp-core-ui .button-secondary, .plugin-install #the-list td, .plugins .active td, .plugins .active th, .plugins .inactive td, .plugins .inactive th, .upgrade .plugins td, .upgrade .plugins th {
		box-shadow:  0 1px 0 $border-1 !important;
	}
	#contextual-help-back, .contextual-help-tabs .active, .alternate, .striped>tbody>:nth-child(odd), ul.striped>:nth-child(odd), .components-panel__body>.components-panel__body-title:hover, .edit-post-last-revision__panel>.components-icon-button:not(:disabled):not([aria-disabled=true]):not(.is-default):hover, .components-button:focus:enabled, .theme-overlay .theme-wrap, .plugins .active td, .plugins .active th, .select2-container--default .select2-selection--multiple {
		background-color: $dark-4 !important;
	}
	.nav-tab-active, .nav-tab-active:focus, .nav-tab-active:focus:active, .nav-tab-active:hover {
		border-bottom-color: $dark-1 !important;
	}
}*/