@charset "UTF-8";
/**!
 * Settings Menu CSS.
 *
 * @link              https://github.com/demispatti/nicescrollr
 * @since             0.1.0
 * @package           nicescrollr
 * @subpackage        nicescrollr/admin/css
 * Author:            Demis Patti <wp@demispatti.ch>
 * Author URI:        https://demispatti.ch
 * License:           GPL-2.0+
 * License URI:       http://www.gnu.org/licenses/gpl-2.0.txt
 * Copyright:		  Demis Patti © 2023
 */
/************************************************************\
 *   Admin Notice
\************************************************************/
.nsr-settings-page .notice {
  box-sizing: border-box;
  width: 100%;
  max-width: 480px;
}

/************************************************************\
 *   Table
\************************************************************/
.nsr-settings-page .form-table {
  margin-top: 3px;
  background: #fff;
  border: 1px solid #dfdfdf;
}

#nsr_form table {
  width: inherit;
  table-layout: fixed;
  box-sizing: content-box;
}

#nsr_form tbody {
  width: 100%;
  min-width: 100%;
  display: table;
}

#nsr_form tr {
  box-sizing: border-box;
  display: table;
  width: 100%;
  height: 48px;
  clear: both;
  border-radius: 2px;
  border-bottom: 1px solid #f4f4f4;
}

.nsr-settings-page .form-table td > div,
.nsr-settings-page .form-table th {
  box-sizing: border-box;
  display: inline-block;
  position: relative;
  width: 200px;
}

#nsr_form .form-table th {
  float: left;
  box-sizing: border-box;
  height: auto;
  font-size: 12px;
  font-weight: 400;
  padding: 16px 0 10px 16px;
}

#nsr_form .form-table td {
  float: left;
  top: 25px;
  box-sizing: border-box;
  height: auto;
  font-size: 12px;
  font-weight: 400;
  padding: 4px 0 0 16px;
  margin-bottom: 0;
}

#nsr_form .form-table td > div {
  padding: 0;
  margin: 0;
  top: 0;
}

/************************************************************\
 *   Navigation
\************************************************************/
.nsr-settings-page .nav-tab-wrapper {
  padding: 30px 0 0 0;
  margin: 0;
}

.nsr-settings-page .nav-tab-wrapper {
  border-bottom: none;
}

.nsr-settings-page .wrap a.nav-tab {
  font-weight: 500;
  color: #0a1318;
  padding-bottom: 8px;
  border: 1px solid #e5e5e5;
  border-bottom: 2px solid #e5e5e5;
  background: #fff;
  transition: all .2s ease-in-out;
  z-index: 1;
}

.nsr-settings-page .wrap a.nav-tab:first-of-type {
  margin-left: 0;
}

.nsr-settings-page .nav-tab-active,
.nsr-settings-page .nav-tab-active:hover {
  background-color: #fff;
  transition: .2s all;
}

.nsr-settings-page .nav-tab-active {
  color: #0a1318;
  border-bottom: 2px solid #47a8d8 !important;
  z-index: 1;
}

.nsr-settings-page .wrap a.nav-tab:before {
  color: #24465a;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
  font-size: 16px;
  margin-right: 5px;
  right: 8px;
  text-shadow: -0.6px -0.6px 0 rgba(241, 241, 241, 0.8), 1px 1px 1px #5c5c5c;
}

/************************************************************\
 *   Settings Toggle
\************************************************************/
.nicescrollr_settings_toggle {
  font-size: 13px;
  font-weight: 400;
  padding: 10px 0 10px 22px;
  box-sizing: border-box;
  max-width: 480px;
  margin-top: 0;
  margin-bottom: 0;
  border: 1px solid #e5e5e5;
  background: #fff;
  transition: all .2s ease-in-out;
  z-index: 2;
  cursor: pointer;
  position: relative;
}

.nicescrollr_settings_toggle::after {
  content: '';
  position: absolute;
  right: 16px;
  top: 50%;
  width: 8px;
  height: 8px;
  border-right: 2px solid #24465a;
  border-bottom: 2px solid #24465a;
  transform: translateY(-50%) rotate(45deg);
  transition: transform .2s ease-in-out;
}

.nicescrollr_settings_toggle.is-open::after {
  transform: translateY(-25%) rotate(-135deg);
}

.nicescrollr_settings_toggle span {
  box-sizing: border-box;
  margin-right: 4px;
}

#nsr_form tr,
#nsr_form tr:hover,
.nsr-settings-page .validation-error-focus:focus,
input {
  transition: all .12s ease-in-out;
}

.validation-error-focus {
  display: block;
  box-sizing: border-box;
  border: 2px solid #0073AA !important;
}

.nicescrollr_settings_toggle span:before {
  color: #24465a;
  font-size: 24px;
  position: relative;
  top: -3px;
  left: -6px;
}

.nicescrollr_settings_toggle span:after,
.nicescrollr_settings_toggle span:before {
  -moz-border-radius: 100px/10px;
  border-radius: 100px/10px;
}

.nicescrollr_settings_toggle span:after {
  transform: skew(8deg) rotate(3deg);
}

#nsr_form tr:after,
.nicescrollr_settings_toggle span:after {
  -webkit-transform: skew(8deg) rotate(3deg);
  -moz-transform: skew(8deg) rotate(3deg);
  -ms-transform: skew(8deg) rotate(3deg);
  -o-transform: skew(8deg) rotate(3deg);
}

.nicescrollr_settings_toggle span:hover {
  border: 1px solid #e5e5e5;
  background: #fff;
  cursor: pointer;
}

/************************************************
 * Switch
 ***********************************************/
/*
 * Copyright (c) 2013 Thibaut Courouble
 * http://www.cssflow.com
 *
 * Licensed under the MIT License:
 * http://www.opensource.org/licenses/mit-license.php
 */
.nsr-settings-page .container > .nsr-switch {
  display: block;
  margin: 12px auto;
}

.nsr-switch {
  position: relative;
  display: inline-block;
  vertical-align: top;
  width: 40px;
  height: 16px;
  padding: 3px;
  margin-top: 6px;
  background-color: #fff;
  border-radius: 8px;
  box-shadow: inset 0 -1px #fff, inset 0 1px 1px rgba(0, 0, 0, 0.05);
  cursor: pointer;
  background-image: -webkit-linear-gradient(top, #eee, #fff 25px);
  background-image: -moz-linear-gradient(top, #eee, #fff 25px);
  background-image: -o-linear-gradient(top, #eee, #fff 25px);
  background-image: linear-gradient(to bottom, #eee, #fff 25px);
}

.nsr-switch-input {
  position: absolute;
  top: 0;
  left: 0;
  opacity: 0;
}

.nsr-switch-label {
  position: relative;
  display: block;
  height: inherit;
  font-size: 8px;
  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);
  -webkit-transition: .15s ease-out;
  -moz-transition: .15s ease-out;
  -o-transition: .15s ease-out;
  transition: .15s ease-out;
  -webkit-transition-property: opacity;
  -moz-transition-property: opacity;
  -o-transition-property: opacity;
  transition-property: opacity;
}

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

.nsr-switch-label:before {
  content: attr(data-off);
  font-size: 9px;
  top: 8px;
  right: 5px;
  color: #aaa;
  text-shadow: 0 1px rgba(255, 255, 255, 0.5);
}

.nsr-switch-label:after {
  content: attr(data-on);
  font-size: 9px;
  top: 8px;
  left: 8px;
  color: #fff;
  text-shadow: 0 1px rgba(0, 0, 0, 0.2);
  opacity: 0;
}

.nsr-switch-input:checked ~ .nsr-switch-label {
  background: #87d37c;
  box-shadow: inset 0 1px 2px rgba(0, 0, 0, 0.15), inset 0 0 3px rgba(0, 0, 0, 0.2);
}

.nsr-switch-input:checked ~ .nsr-switch-label:before {
  opacity: 0;
}

.nsr-switch-input:checked ~ .nsr-switch-label:after {
  opacity: 1;
}

.nsr-switch-handle {
  position: absolute;
  top: 4px;
  left: 4px;
  width: 14px;
  height: 14px;
  background: #fff;
  border-radius: 50%;
  box-shadow: 1px 1px 5px rgba(0, 0, 0, 0.2);
  background-image: -webkit-linear-gradient(top, #fff 40%, #f0f0f0);
  background-image: -moz-linear-gradient(top, #fff 40%, #f0f0f0);
  background-image: -o-linear-gradient(top, #fff 40%, #f0f0f0);
  background-image: linear-gradient(to bottom, #fff 40%, #f0f0f0);
  -webkit-transition: left .15s ease-out;
  -moz-transition: left .15s ease-out;
  -o-transition: left .15s ease-out;
  transition: left .15s ease-out;
}

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

.nsr-switch-input:checked ~ .nsr-switch-handle {
  left: 30px;
  box-shadow: -1px 1px 5px rgba(0, 0, 0, 0.2);
}

.nsr-switch-green > .nsr-switch-input:checked ~ .nsr-switch-label {
  background: #4fb845;
}

#nsr_form .nsr-switch {
  pointer-events: initial;
}

/************************************************************\
 *   Validation Errors
\************************************************************/
.nsr-validation-error {
  color: #5b9dd9;
  text-decoration: underline;
}

.nsr-validation-error:hover {
  color: #69b9ff;
  text-decoration: none;
  cursor: pointer;
}

.nsr-settings-page .notice-error {
  border-color: #e74c3c !important;
}

.nsr-settings-page .notice-warning {
  border-color: #e67e22 !important;
}

.nsr-settings-page .notice-correction {
  border-color: rgba(91, 157, 217, 0.98) !important;
}

#nsr_form .color-alpha {
  display: block;
  box-sizing: border-box;
  width: 100%;
  height: 100% !important;
  border-bottom: 1px solid #ccc !important;
}

.wp-picker-container button {
  border: 1px solid #ccc !important;
}

@media all and (max-width: 782px) {
  .color-alpha {
    width: 40px !important;
    height: 29px !important;
  }
}

.preview-window-container {
  width: 100%;
  max-width: 360px;
  height: 100%;
  max-height: 720px;
}

.preview-window-container #preview_window {
  overflow: scroll !important;
}

/************************************************************\
 *   Page
\************************************************************/
html.nsr-is-msie {
  overflow-y: visible !important;
}

body.nsr-settings-page {
  background-color: #f2f2f2 !important;
}

#nsr_form {
  overflow: visible;
}

.nicescrollr_settings_toggle:first-of-type {
  display: block;
  margin-top: 0;
  margin-bottom: 0;
}

.nicescrollr_settings_toggle:not(:first-of-type) {
  display: block;
  margin-top: 0;
  margin-bottom: 0;
}

.nsr-settings-page .form-table-wrap,
.nsr-settings-page .form-table-wrap tbody,
.nsr-settings-page .form-table-wrap tbody tr,
.nicescrollr_settings_toggle,
form#nsr_form,
form#nsr_form table,
.nsr-settings-page .nav-tab-wrapper {
  box-sizing: border-box;
  width: 100%;
  max-width: 480px;
}

.nsr-settings-page h2:first-of-type,
.form-table.upper-panel + h2 {
  display: none;
}

.nsr-settings-page h2 i.fa,
.nsr-settings-page h3 i.fa {
  padding-left: 0;
  margin-right: 8px;
}

.nsr-settings-page a i.fa {
  padding-left: 0;
  margin-right: 4px;
}

.dp-submit-button-wrap,
.dp-submit-button-wrap-2,
.settings_page_nicescrollr_settings .submit {
  box-sizing: border-box;
  width: 100%;
  max-width: 480px;
}

.settings_page_nicescrollr_settings .submit {
  height: 20px;
  padding-right: 12px;
}

.dp-submit-button-wrap {
  margin-bottom: 30px;
  right: 6px;
}

.dp-submit-button-wrap-2 {
  position: relative;
  right: 6px;
}

.settings_page_nicescrollr_settings .submit input {
  display: block;
  float: right;
  position: relative;
  right: 0;
  height: auto;
}

/************************************************************\
 *   Reset Button
\************************************************************/
.label-for-nsr-reset-button {
  text-align: center;
  width: 126px;
  margin-top: 40px;
}

.nsr-settings-page .wp-core-ui .button {
  text-align: center;
}

/************************************************************\
 *   Inputs
\************************************************************/
.nsr-settings-page .wp-picker-input-wrap,
.nsr-settings-page .wp-picker-input-wrap input {
  padding-top: 6px;
}

.nsr-settings-page .wp-picker-container .iris-picker {
  background-color: #fff;
}

.nsr-settings-page .wp-color-result.button {
  margin-top: 6px;
}

#nsr_form input {
  box-shadow: 0 1px 3px rgba(0, 0, 0, 0.03), 0 1px 2px rgba(0, 0, 0, 0.12) inset;
}

#nsr_form input[type=text],
#nsr_form select {
  min-height: 29px;
  width: 100%;
  max-width: 200px;
}

#nsr_form input[type=text]:active,
#nsr_form input[type=text]:focus {
  border: 1px solid #cdcdcd;
  transition: all .12s ease-in-out;
}

.nsr-color-picker {
  z-index: 10000;
}

/************************************************************\
 *   Placeholder
\************************************************************/
#nsr_form ::-webkit-input-placeholder {
  color: #a0a9b9;
}

#nsr_form :-moz-placeholder {
  color: #a0a9b9;
}

#nsr_form ::-moz-placeholder {
  color: #a0a9b9;
}

#nsr_form :-ms-input-placeholder {
  color: #a0a9b9;
}

@media all and (max-width: 782px) {
  #nsr_form .form-table th {
    font-size: 12px;
  }
  #nsr_form .form-table td {
    font-size: 12px;
  }
}