/* Title Styles
-------------------------------------------------------------- */

body.calendar_page_sc-settings .wrap h1.wp-heading-inline {
	display: none;
}


/* Settings
-------------------------------------------------------------- */

/* Sidebar */
.sc-settings-sidebar {
	padding-top: 27px;
}

.sc-settings-sidebar-content {
	background-color: #fff;
	text-align: center;
	border: 1px solid #ddd;
	box-sizing: border-box;
	max-width: 350px;
}

.sc-settings-sidebar-content p {
	font-size: 14px;
	line-height: 1.5;
	margin-top: 0;
}

/* Sidebar header section */
.sc-sidebar-header-section {
	background-color: #253b51;
	line-height: 1;
	padding: 26px 20px 24px;
	border-bottom: 3px dashed #fafafa;
}

/* Sidebar description section */
.sc-sidebar-description-section {
	background-color: #fafafa;
	padding: 16px 20px;
	border-bottom: 1px solid #ddd;
}

.sc-sidebar-description-section .sc-sidebar-description {
	margin: 0;
}

/* Sidebar coupon section */
.sc-sidebar-coupon-section {
	font-size: 14px;
	padding: 16px 20px;
}

.sc-sidebar-coupon-section label {
	display: block;
	line-height: 1.4;
	margin-bottom: 6px;
}

.sc-sidebar-coupon-section label strong {
	color: #253b51;
	font-weight: 700;
}

.sc-sidebar-coupon-section input {
	background: #fffaf6;
	font-size: 22px;
	font-weight: 600;
	text-align: center;
	padding: 10px;
	border: 2px dashed #f27100;
	border-radius: 4px;
	margin-bottom: 16px;
	box-shadow: none;
	width: 100%;
}

.sc-sidebar-coupon-section input:focus {
	border: 2px dashed #f27100;
	box-shadow: none;
}

.sc-settings-sidebar-content .sc-coupon-note {
	color: #6c7883;
	font-size: 13px;
	font-style: italic;
	margin: 0;
}

.sc-settings-sidebar-content .sc-coupon-note a {
	color: #253b51;
}

.sc-settings-sidebar-content .sc-coupon-note a:hover {
	text-decoration: none;
}

/* Sidebar footer section */
.sc-sidebar-footer-section {
	background-color: #fafafa;
	padding: 16px 20px;
	border-top: 1px solid #ddd;
}

.sc-sidebar-footer-section .sc-cta-button {
	display: block;
	background-color: #f27100;
	color: #fff;
	text-decoration: none;
	font-size: 20px;
	font-weight: 700;
	text-transform: uppercase;
	padding: 17px 10px;
	border: none;
	border-radius: 4px;
	width: 100%;
	box-sizing: border-box;
	box-shadow: none;
	transition: background-color .2s;
}

.sc-sidebar-footer-section .sc-cta-button:hover {
	background-color: #e16900;
}

/* Sidebar after */
.sc-sidebar-logo-section .sc-logo-wrap {
	padding-top: 1em;
	text-align: left;
	margin-left: 20px;
	max-width: 350px;
}

.sc-sidebar-logo-section .sc-logo {
	max-width: 115px;
}

/* Sidebar responsive behavior */
@media all and ( min-width: 960px ) {

	.sc-has-sidebar .sc-settings-content {
		float: right;
		width: 65%;
	}

	.sc-has-sidebar .sc-settings-sidebar {
		float: left;
		width: 33%;
	}
}

@media all and ( min-width: 1200px ) {

	.sc-has-sidebar .sc-settings-content {
		width: 72%;
	}

	.sc-has-sidebar .sc-settings-sidebar {
		width: 26%;
	}
}


/* Toggle Styles
-------------------------------------------------------------- */

.sc-toggle {
	position: relative;
	display: inline-block;
	overflow: visible;
}

.sc-toggle input[type="checkbox"] {
	display: inline-block;
	vertical-align: middle;
	position: relative;
	margin: 0;
	padding: 0;
	width: 42px;
	height: 24px;
	background-color: #ccc;
	-webkit-transition: .4s;
	transition: .4s;
	border-radius: 34px;
	box-shadow: none;
	border: none;
}

.sc-toggle .label {
	display: inline-block;
	vertical-align: middle;
	white-space: nowrap;
}

.sc-toggle input[type="checkbox"]:before {
	position: absolute;
	content: "";
	height: 18px;
	width: 18px;
	right: 3px;
	bottom: 3px;
	background-color: white;
	-webkit-transition: .4s;
	transition: .4s;
	border-radius: 50%;
}

.sc-toggle input[type="checkbox"]:checked {
	background-color: #0096dd;
}

.sc-toggle input[type="checkbox"]:active,
.sc-toggle input[type="checkbox"]:focus {
	outline: auto 3px -webkit-focus-ring-color;
}

.sc-toggle input[type="checkbox"]:checked:before {
	-webkit-transform: translateX(-22px);
	-ms-transform: translateX(-22px);
	transform: translateX(-22px);
}

.sc-toggle input + .label,
.sc-toggle .label + input {
	margin-right: 5px;
}

/* License Styles
-------------------------------------------------------------- */

.sc-license-wrapper {
	width: 80%;
	max-width: 700px;
	min-width: 460px;
	margin: 20px 0;
}

.sc-license-wrapper .sc-license-header {
	background: #fff;
	border: 1px solid #ddd;
	padding: 12px 20px;
	margin: 0;
}

.sc-license-wrapper .sc-license-header h3,
.sc-license-wrapper .sc-license-header span {
	padding: 0;
	margin: 5px;
}

.sc-license-wrapper .sc-license-header span {
	font-size: 12px;
	color: #aaa;
}

.sc-license-content {
	background: #fafafa;
	border: 1px solid #ddd;
	border-top: none;
	padding: 25px;
}

.sc-license-content p,
.sc-license-input-wrapper {
	margin: 0 0 15px 0;
}

.sc-license-input {
	width: 69%;
	display: inline-block;
	position: relative;
	margin-left: 2px;
}

.sc-license-input-wrapper input[type="text"],
.sc-license-input-wrapper input[type="password"] {
	width: 100%;
	font-family: caption;
	font-size: 18px;
	line-height: 18px;
	letter-spacing: 3px;
	padding: 5px 30px 5px 5px;
}

.sc-license-content .sc-license-input-wrapper button {
	vertical-align: baseline;
}

input.sc-license-key::-webkit-credentials-auto-fill-button {
	display: none;
	visibility: hidden;
	pointer-events: none;
	position: absolute;
	left: 0;
}

span.sc-license-input span.sc-license-status {
	border: none;
	background: transparent;
	position: absolute;
	display: inline-block;
	top: 5px;
	right: 5px;
	padding: 0;
	margin: 0;
	color: #aaa;
	vertical-align: middle;
	text-align: center;
	height: 25px;
	width: 25px;
	font: 400 20px/25px dashicons !important;
}

span.sc-license-status.empty:after {
	content: "\f112"; /* Key */
	color: #aaa;
	font-size: 17px;
}

span.sc-license-status.inactive:after {
	content: "\f112"; /* Key */
	color: #aaa;
	font-size: 17px;
}

span.sc-license-status.valid:after {
	content: "\f147"; /* Check */
	color: #008000;
	font-size: 23px;
}

span.sc-license-status.invalid:after {
	content: "\f534"; /* Not Valid */
	color: #ca4a1f;
	font-size: 20px;
}

span.sc-license-status.verifying {
	font-size: 17px;
	-webkit-animation: rotating 2s linear infinite;
	 -moz-animation: rotating 2s linear infinite;
	 -ms-animation: rotating 2s linear infinite;
	 -o-animation: rotating 2s linear infinite;
	 animation: rotating 2s linear infinite;
}

span.sc-license-status.verifying:after {
	content: "\f463"; /* Refreshing */
	color: #0085ba;
}

button.sc-license-refresh {
	border: none;
	background: transparent;
	padding: 0;
	margin: 0;
	cursor: pointer;
	color: #444;
	text-decoration: underline;
}

.sc-license-content p:last-child {
	margin-bottom: 0;
}

/* Sortable Lists
-------------------------------------------------------------- */

.sc-sortable-list {
	margin: 0;
	width: 300px;
	position: relative;
}

.sc-sortable-list li {
	margin: 0;
	padding: 5px 7px 5px 10px;
	position: relative;
	border: 1px solid transparent;
}

.sc-sortable-list li:hover {
	background-color: #fafafa;
	border: 1px solid #ddd;
	border-radius: 3px;
}

.sc-sortable-list li,
.sc-sortable-list li label {
	cursor: move;
}

.sc-sortable-list li label input[type="checkbox"] {
	margin-top: -2px;
}

.sc-sortable-list li label:after {
	display: block;
	width: 17px;
	height: 17px;
	position: absolute;
	margin: auto;
	left: 6px;
	top: -5px;
	bottom: 0;
	color: #aaa;
	font-family: dashicons;
	font-size: 18px;
	content: '\f228';
	cursor: move;
}

.form-table .sc-sortable-list li label {
	display: block;
	margin: 0;
}

.sc-check-wrapper {
	clear: both;
}

.sc-check-wrapper label {
	margin: -2px 0 3px 0;
	display: inline-block;
	vertical-align: initial;
}

/* Formatting
-------------------------------------------------------------- */

span.date-time-text {
	display: inline-block;
	min-width: 10em;
}

.calendar_page_sc-settings input.small-text {
	width: 75px;
	margin: -2px 0;
}

.calendar_page_sc-settings .spinner {
	float: none;
	margin: -3px 3px 0;
}

.sc-date-time-format-table {
	width: calc(100% + 45px);
	margin: 10px -12px -5px -40px;
	border-spacing: 0;
}

.sc-date-time-format-table pre {
	margin: 0;
}

.sc-date-time-format-table thead th {
	text-align: right;
	font-style: normal;
	margin-bottom: 5px;
	padding: 6px 12px 6px 6px;
}

.sc-date-time-format-table tbody tr:hover {
	background-color: #eee;
	cursor: pointer;
}

.sc-date-time-format-table tbody th,
.sc-date-time-format-table tbody td {
	vertical-align: top;
	padding: 6px;
	border-bottom: 1px solid #eee;
}

.sc-date-time-format-table tbody:last-of-type tr:last-child th,
.sc-date-time-format-table tbody:last-of-type tr:last-child td {
	border-bottom: none;
}

.sc-date-time-format-table tbody th {
	font-weight: normal;
	width: 40px;
}

.sc-date-time-format-table tbody tr td + td {
	width: 200px;
}

.sc-settings-content .form-table a.button,
.sc-settings-content .form-table a.screen-options {
	margin: 0;
	min-height: 28px;
	min-width: 28px;
}

.sc-settings-content .form-table a.screen-options {
	padding: 0;
	text-decoration: none;
	text-align: center;
}

.sc-settings-content .form-table a.screen-options .dashicons {
	color: #b4b9be;
	padding: 5px;
	vertical-align: middle;
	margin-top: -7px;
	font-size: 25px;
}

.sc-settings-content .form-table a.screen-options:hover .dashicons {
	color: #727272;
}


/* Keyframes
-------------------------------------------------------------- */

@-webkit-keyframes rotating /* Safari and Chrome */ {
  from {
    -webkit-transform: rotate(0deg);
    -o-transform: rotate(0deg);
    transform: rotate(0deg);
  }
  to {
    -webkit-transform: rotate(-360deg);
    -o-transform: rotate(-360deg);
    transform: rotate(-360deg);
  }
}
@keyframes rotating {
  from {
    -ms-transform: rotate(0deg);
    -moz-transform: rotate(0deg);
    -webkit-transform: rotate(0deg);
    -o-transform: rotate(0deg);
    transform: rotate(0deg);
  }
  to {
    -ms-transform: rotate(-360deg);
    -moz-transform: rotate(-360deg);
    -webkit-transform: rotate(-360deg);
    -o-transform: rotate(-360deg);
    transform: rotate(-360deg);
  }
}
