/* ----------------------- Default ----------------------- */
input[type="checkbox"], input[type="radio"] { display: inline-block; margin-right: 7px; }

/* ----------------------- Settings ----------------------- */
.e-select:focus, .checker:focus, .radio:focus, .uploader:focus { outline: none; }

/* ----------------------- Select ----------------------- */
.e-select { position: relative; z-index: auto; -moz-box-sizing: border-box; -webkit-box-sizing: border-box; box-sizing: border-box; }
.e-select select { position: absolute; z-index: 5; top: 0; left: 0; right: 0; bottom: 0; height: 100%; width: 100%; filter: alpha(opacity=0); -moz-opacity: 0; opacity: 0; border: none; background: none; -moz-box-sizing: border-box; -webkit-box-sizing: border-box; box-sizing: border-box; }

/* ----------------------- Radio-buttons and checkboxes ----------------------- */
.radio,
.checker { display: inline-block; position: relative; width: 16px; height: 16px; color: #ff7800; background: #fff; border: 1px solid #c3c3c3; cursor: pointer; -webkit-box-sizing: border-box; -moz-box-sizing: border-box; box-sizing: border-box; -webkit-transition: all 250ms; -moz-transition: all 250ms; -o-transition: all 250ms; transition: all 250ms; overflow: hidden; backface-visibility: hidden; transform: translateZ(0); }

.radio input,
.checker input { position: absolute !important; z-index: 50; left: 0 !important; top: 0 !important; width: 100% !important; height: 100% !important; filter: alpha(opacity=0) !important; -moz-opacity: 0 !important; opacity: 0 !important; border: none; background: none; cursor: pointer; }

.radio span,
.checker span { display: block; position: relative; text-align: center; }

.radio span:before,
.checker span:before { -webkit-transition: all 250ms; -moz-transition: all 250ms; -o-transition: all 250ms; transition: all 250ms; }

.radio.hover, label:hover .radio {  }
.checker.hover, label:hover .checker {  }

.radio.focus,
.checker.focus {  }

.m-error .radio,
.m-error .checker { border-color: #ff3c00 !important; }

.radio.disabled,
.checker.disabled { cursor: default !important; pointer-events: none; }

.radio.disabled input,
.checker.disabled input { cursor: default; }


/* ----------------------- Checkboxes states ----------------------- */
.checker { width: 14px; height: 14px; border: none; border-radius: 2px; }

.checker span { position: absolute; z-index: 1; left: 0; top: 0; right: 0; bottom: 0; background: #fff; border: 1px solid #dfdfdf; }
.checker span:before { display: block; position: relative; width: 12px; height: 12px; content: ''; visibility: hidden; opacity: 0; background: #ff7800 url(data:image/svg+xml;base64,PHN2ZyB3aWR0aD0iMTRweCIgaGVpZ2h0PSIxNHB4IiB2aWV3Qm94PSIwIDAgMTQgMTQiIHZlcnNpb249IjEuMSIgeG1sbnM9Imh0dHA6Ly93d3cudzMub3JnLzIwMDAvc3ZnIj48cGF0aCBkPSJNNS44NDQ0MDYwNywxMSBMMTIsNC41OTg1NzkwNCBMMTAuNDYxMzI4NywzIEM3LjM4NDA3ODUzLDYuMjAwMTQxODggNS44NDU0NTM0Myw3LjgwMDIxMjgyIDUuODQ1NDUzNDMsNy44MDAyMTI4MiBDNS44NDU0NTM0Myw3LjgwMDIxMjgyIDUuMDc1NjE3Miw2Ljk5OTQzMTQgMy41MzU5NDQ3NCw1LjM5Nzg2ODU2IEwyLDcuMDAzNTUyNCBMNS44NDQ0MDYwNywxMSBaIiBmaWxsPSIjRkZGRkZGIj48L3BhdGg+PC9zdmc+) center center no-repeat; }

.checker span.checked { border-color: #ff7800; }
.checker span.checked:before { visibility: visible; opacity: 1; }

.checker.disabled span:before { background-image: url(data:image/svg+xml;base64,PHN2ZyB3aWR0aD0iMTVweCIgaGVpZ2h0PSIxNXB4IiB2aWV3Qm94PSIwIDAgMTUgMTUiIHZlcnNpb249IjEuMSIgeG1sbnM9Imh0dHA6Ly93d3cudzMub3JnLzIwMDAvc3ZnIj48cGF0aCBkPSJNNi4yMywxMyBMMiw4LjUwNDk5NDQ1IEwzLjY5LDYuNjk3MDAzMzMgQzUuMzg0NjAzNDIsOC41MDEwOTc0NSA2LjIzMTU4NzYxLDkuNDAzMTQ0NTEgNi4yMzA5NTI1Nyw5LjQwMzE0NDUxIEM2LjIzMDMxNzUyLDkuNDAzMTQ0NTEgNy45MjMzMzMzMyw3LjYwMjA5NjM0IDExLjMxLDQgTDEzLDUuNzk4MDAyMjIgTDYuMjMsMTMgWiIgZmlsbD0iI0M4QzhDOCI+PC9wYXRoPjwvc3ZnPg==); }


/* ----------------------- Radio-buttons states ----------------------- */
.radio { border-radius: 50%; }

.radio span { position: absolute; z-index: 1; left: 0; top: 0; right: 0; bottom: 0; }
.radio span:before { display: block; margin: 3px; width: 8px; height: 8px; background: #ff7800; border-radius: 50%; content: ''; visibility: hidden; opacity: 0; }

.radio span.checked:before { visibility: visible; opacity: 1; }

.radio.disabled span:before { background: #c8c8c8; }


/* ----------------------- Uploader ----------------------- */
.e-uploader { display: inline-block !important; position: relative; margin: 0 !important; padding: 0 !important; cursor: pointer; white-space: normal; }
.e-uploader input { visibility: hidden; position: absolute !important; z-index: 5; top: 0; left: 0; right: 0; bottom: 0; height: 100%; width: 100%; filter: alpha(opacity=0); -moz-opacity: 0; opacity: 0; border: none; background: none; -moz-box-sizing: border-box; -webkit-box-sizing: border-box; box-sizing: border-box; }

.e-uploader_btn { position: absolute; left: 0; top: 0; padding: 0; height: 26px; width: 24px; color: #e767a2; border: none; transition: all 250ms !important; }
.e-uploader_btn svg { display: block; fill: currentColor; }

.e-uploader_file { display: inline-block; vertical-align: middle; padding: 2px 0 1px 34px; font: 500 18px 'Roboto', sans-serif; color: #e767a2; box-sizing: border-box; }
