@import 'settings-mixins';
@import 'colors';

#sln-salon,
.sln-checkbox input + label:before,
.sln-checkbox input[type="checkbox"][disabled] + label:before,
.sln-radiobox input + label:before,
.sln-radiobox input + label:after,
.sln-radiobox input[type="radio"][disabled] + label:before,
#sln-salon .sln-input input,
#sln-salon .sln-input textarea,
#sln-salon .sln-input .sln-input--addon:after,
#sln-notifications .sln-loader-wrapper {
	// background-color: $sln-color--background;
	background-color: #{'{color-background-a}'};
}
#sln-salon .sln-panel .sln-panel-heading .sln-btn--borderonly,
#sln-salon .sln-panel .sln-panel-heading .sln-btn--nobkg,
.datetimepicker.sln-datetimepicker table tr td.day.active:not(.disabled),
.datetimepicker.sln-datetimepicker table tr td span.hour.active:not(.disabled),
.datetimepicker.sln-datetimepicker table tr td span.minute.active:not(.disabled),
.datetimepicker.sln-datetimepicker table tr td span.month.active:not(.disabled),
.datetimepicker.sln-datetimepicker table tr td span.year.active:not(.disabled),
.sln-radiobox input:checked + label:after,
.sln-radiobox input:checked + label:hover:after,
.sln-btn--emphasis,
.sln-bootstrap .sln-btn--emphasis,
.sln-stepper .step.step--active .step-number {
	// background-color: $sln-color--main;
	background-color: #{'{color-main-a}'};
}
#sln-salon .sln-panel .sln-panel-heading .sln-btn--borderonly:hover,
#sln-salon .sln-panel .sln-panel-heading .sln-btn--nobkg:hover,
#sln-salon .sln-panel .sln-panel-heading.collapsed .sln-btn--borderonly:hover,
#sln-salon .sln-panel .sln-panel-heading.collapsed .sln-btn--nobkg:hover,
.datetimepicker.sln-datetimepicker table tr td.day:not(.disabled):hover,
.datetimepicker.sln-datetimepicker table tr td span.hour:not(.disabled):not(.active):hover,
.datetimepicker.sln-datetimepicker table tr td span.minute:not(.disabled):not(.active):hover,
.datetimepicker.sln-datetimepicker table tr td span.month:not(.disabled):not(.active):hover,
.datetimepicker.sln-datetimepicker table tr td span.year:not(.disabled):not(.active):hover,
.datetimepicker.sln-datetimepicker table tr td.day.active:not(.disabled):hover,
.datetimepicker.sln-datetimepicker table tr td span.hour.active:not(.disabled):hover,
.datetimepicker.sln-datetimepicker table tr td span.minute.active:not(.disabled):hover,
.datetimepicker.sln-datetimepicker table tr td span.month.active:not(.disabled):hover,
.datetimepicker.sln-datetimepicker table tr td span.year.active:not(.disabled):hover,
.datetimepicker.sln-datetimepicker .switch:hover,
.datetimepicker.sln-datetimepicker .prev:hover,
.datetimepicker.sln-datetimepicker .next:hover,
.datetimepicker.sln-datetimepicker .today:hover,
.sln-radiobox input + label:hover:after,
.sln-btn--emphasis:hover,
.sln-btn--emphasis:focus,
.sln-btn--emphasis:active,
.sln-bootstrap .sln-btn--emphasis:hover,
.sln-bootstrap .sln-btn--emphasis:focus,
.sln-bootstrap .sln-btn--emphasis:active,
.sln-btn--nobkg:hover,
.sln-btn--nobkg:focus,
.sln-btn--nobkg:active,
.sln-bootstrap .sln-btn--nobkg:hover,
.sln-bootstrap .sln-btn--nobkg:focus,
.sln-bootstrap .sln-btn--nobkg:active,
.sln-btn--borderonly:hover,
.sln-btn--borderonly:focus,
.sln-btn--borderonly:active,
.sln-bootstrap .sln-btn--borderonly:hover,
.sln-bootstrap .sln-btn--borderonly:focus,
.sln-bootstrap .sln-btn--borderonly:active {
	// background-color: $sln-color--main--alpha75;
	background-color: #{'{color-main-b}'};
}
#sln-salon .sln-salon-title,
.sln-text--contrast,
.sln_datepicker:after,
.sln_timepicker:after,
#sln-salon .sln-input .help-block,
#sln-salon .sln-input .help-block a,
#sln-salon .sln-input .sln-input--addon,
.sln-btn--nobkg,
.sln-bootstrap .sln-btn--nobkg,
.sln-btn--nobkg input,
.sln-btn--nobkg button,
.sln-bootstrap .sln-btn--nobkg input,
.sln-bootstrap .sln-btn--nobkg button,
.sln-btn--borderonly,
.sln-bootstrap .sln-btn--borderonly,
.sln-alert,
#sln-salon .alert,
.sln-stepper .step.step--active .step-label,
#sln-salon,
#sln-salon .sln-attendant-list--multiple .sln-steps-name.sln-service-name,
#sln-salon .sln-thankyou--okbox h1,
#sln-salon .sln-thankyou--okbox h2,
#sln-salon .sln-thankyou--okbox h3,
#sln-salon .sln-thankyou--okbox .sln-icon-wrapper .sln-icon,
.sln-payment-actions h4,
// NEW
#sln-salon .sln-input input,
#sln-salon .sln-input textarea,
.sln-text--emphasis,
.sln-loader:after,
#sln-salon .sln-panel .sln-panel-heading,
#sln-salon .sln-panel .sln-panel-heading.collapsed .sln-btn--borderonly,
#sln-salon .sln-panel .sln-panel-heading.collapsed .sln-btn--nobkg,
.sln_datepicker:hover:after,
.sln_timepicker:hover:after,
.sln-checkbox input:checked + label:after,
.sln-checkbox input:checked + label:hover:after,
.sln-alert a,
#sln-salon .alert a,
.sln-alert.sln-alert--wait:after,
.sln-alert--wait:after,
.sln-steps-name {
	// color: $sln-color--main;
	color: #{'{color-main-a}'};
}
#sln-salon .sln-input input,
#sln-salon .sln-input textarea {
	// @include placeholder-color($sln-color--main--alpha50);
	@include placeholder-color(#{'{color-main-c}'});
}
#sln-salon .sln-input label,
.sln-text--emphasis--hoverk,
.sln-checkbox input + label:hover:after,
.sln-alert a:hover,
#sln-salon .alert a:hover,
.sln-steps-name:hover {
	// color: $sln-color--main--alpha75;
	color: #{'{color-main-b}'};
}
.datetimepicker.sln-datetimepicker.datetimepicker-dropdown-bottom-right,
#sln-salon .sln-input input,
#sln-salon .sln-input textarea,
.sln-btn--borderonly,
.sln-bootstrap .sln-btn--borderonly,
.snl-error-list-item,
.sln-steps-description hr,
.sln-list--dashed li,
ul.sln-list--dashed li,
#sln-salon .sln-list--dashed li,
#sln-salon ul.sln-list--dashed li,
#sln-salon .sln-attendant-list--multiple .sln-steps-name.sln-service-name,
.sln-attendant hr,
.sln-summary-row hr,
#sln-salon .sln-thankyou--okbox hr,
#sln-salon .sln-panel .sln-panel-heading .sln-btn--borderonly:hover,
.sln-checkbox input + label:hover:before,
.sln-btn--borderonly:hover,
.sln-btn--borderonly:focus,
.sln-btn--borderonly:active,
.sln-bootstrap .sln-btn--borderonly:hover,
.sln-bootstrap .sln-btn--borderonly:focus,
.sln-bootstrap .sln-btn--borderonly:active,
.sln-alert a:hover,
#sln-salon .alert a:hover {
	// border-color: $sln-color--main--alpha50;
	border-color: #{'{color-main-c}'};
}
#sln-salon .sln-panel .sln-panel-heading .sln-btn--borderonly,
.sln-checkbox input + label:before,
.sln-radiobox input + label:before {
	// border-color: $sln-color--main;
	border-color: #{'{color-main-a}'};
}
.sln-checkbox input[type="checkbox"][disabled] + label:before,
.sln-radiobox input[type="radio"][disabled] + label:before {
	// border-color: $sln-color--text--alpha50;
	border-color: #{'{color-text-c}'};
}
#sln-salon {
	border-color: transparent;
}

#sln-salon .salon-step-title,
.sln-text--dark,
.sln-btn--borderonly input,
.sln-btn--borderonly button,
.sln-bootstrap .sln-btn--borderonly input,
.sln-bootstrap .sln-btn--borderonly button,
.sln-steps-description,
#sln-salon .sln-data-desc,
#sln-salon .sln-data-desc .label,
.sln-summary-row .label,
.sln-total-label,
.sln-total-price,
.sln-steps-price {
	// color: $sln-color--text;
	color: #{'{color-text-a}'};
}
.sln-text--main,
.sln-btn--emphasis,
.sln-bootstrap .sln-btn--emphasis,
.sln-btn--emphasis input,
.sln-btn--emphasis button,
.sln-btn--emphasis a,
.sln-bootstrap .sln-btn--emphasis input,
.sln-bootstrap .sln-btn--emphasis button,
.sln-bootstrap .sln-btn--emphasis a,
.sln-btn--emphasis:hover,
.sln-btn--emphasis:focus,
.sln-btn--emphasis:active,
.sln-bootstrap .sln-btn--emphasis:hover,
.sln-bootstrap .sln-btn--emphasis:focus,
.sln-bootstrap .sln-btn--emphasis:active,
.sln-btn--emphasis:hover input,
.sln-btn--emphasis:hover button,
.sln-btn--emphasis:hover a,
.sln-btn--emphasis:focus input,
.sln-btn--emphasis:focus button,
.sln-btn--emphasis:focus a,
.sln-btn--emphasis:active input,
.sln-btn--emphasis:active button,
.sln-btn--emphasis:active a,
.sln-bootstrap .sln-btn--emphasis:hover input,
.sln-bootstrap .sln-btn--emphasis:hover button,
.sln-bootstrap .sln-btn--emphasis:hover a,
.sln-bootstrap .sln-btn--emphasis:focus input,
.sln-bootstrap .sln-btn--emphasis:focus button,
.sln-bootstrap .sln-btn--emphasis:focus a,
.sln-bootstrap .sln-btn--emphasis:active input,
.sln-bootstrap .sln-btn--emphasis:active button,
.sln-bootstrap .sln-btn--emphasis:active a,
.sln-btn--nobkg:hover,
.sln-btn--nobkg:focus,
.sln-btn--nobkg:active,
.sln-bootstrap .sln-btn--nobkg:hover,
.sln-bootstrap .sln-btn--nobkg:focus,
.sln-bootstrap .sln-btn--nobkg:active,
.sln-btn--nobkg:hover input,
.sln-btn--nobkg:hover button,
.sln-btn--nobkg:focus input,
.sln-btn--nobkg:focus button,
.sln-btn--nobkg:active input,
.sln-btn--nobkg:active button,
.sln-bootstrap .sln-btn--nobkg:hover input,
.sln-bootstrap .sln-btn--nobkg:hover button,
.sln-bootstrap .sln-btn--nobkg:focus input,
.sln-bootstrap .sln-btn--nobkg:focus button,
.sln-bootstrap .sln-btn--nobkg:active input,
.sln-bootstrap .sln-btn--nobkg:active button,
.sln-btn--borderonly:hover,
.sln-btn--borderonly:focus,
.sln-btn--borderonly:active,
.sln-bootstrap .sln-btn--borderonly:hover,
.sln-bootstrap .sln-btn--borderonly:focus,
.sln-bootstrap .sln-btn--borderonly:active,
.sln-btn--borderonly:hover input,
.sln-btn--borderonly:hover button,
.sln-btn--borderonly:focus input,
.sln-btn--borderonly:focus button,
.sln-btn--borderonly:active input,
.sln-btn--borderonly:active button,
.sln-bootstrap .sln-btn--borderonly:hover input,
.sln-bootstrap .sln-btn--borderonly:hover button,
.sln-bootstrap .sln-btn--borderonly:focus input,
.sln-bootstrap .sln-btn--borderonly:focus button,
.sln-bootstrap .sln-btn--borderonly:active input,
.sln-bootstrap .sln-btn--borderonly:active button,
.sln-stepper .step .step-number,
.sln-stepper .step.step--active .step-number {
	// color: $sln-color--background;
	color: #{'{color-background-a}'};
}