﻿/* Start HKTooltip styles */

.hk-tooltip { background: #333; color: #ebebeb; font-weight: bold; padding: 4px 8px; font-size: 12px; border-radius: 4px; z-index:99999999; display: none; }
.hk-tooltip[data-show] { display: block; }

.hk-tooltip h6 { font-size: 14px; color: #ffffff; margin: 0; }

.hk-tooltip-arrow,
.hk-tooltip-arrow::before { position: absolute; width: 8px; height: 8px; background: inherit; }

.hk-tooltip-arrow { visibility: hidden; }
.hk-tooltip-arrow::before { visibility: visible; content: ''; transform: rotate(45deg); }

.hk-tooltip[data-popper-placement^='top'] > .hk-tooltip-arrow { bottom: -4px; }
.hk-tooltip[data-popper-placement^='bottom'] > .hk-tooltip-arrow { top: -4px; }
.hk-tooltip[data-popper-placement^='left'] > .hk-tooltip-arrow { right: -4px; }
.hk-tooltip[data-popper-placement^='right'] > .hk-tooltip-arrow { left: -4px; }

/* End HKTooltip styles */

/* Start HKSelect styles */

.invalid { border-color: red !important; }

.hk-select { position: relative; width: 100%; border: 1px solid #bfbfbf; border-radius: 5px; }
.hk-select .valid.modified { outline: none !important; border: 1px solid #26b050; }
.hk-select .invalid { outline: none !important; border: 1px solid red; }
.hk-select-controls { position: relative; cursor: text; display: flex; }
.hk-select-input { flex: 1; max-width: 100%; border: none; padding: .5rem; border-radius: 5px; }
.hk-select:focus-within { box-shadow: 0 0 0 0.2rem rgba(38,143,255,.5); }
.hk-select-input:focus { outline: none; }
.hk-select-input-multi:focus { outline: none; box-shadow: none; }
.hk-select-input-hidden { display: none; }

.hk-select-input-mask-wrapper { display: flex; width: 100%; }
.hk-select-input-multiselect-wrapper { display: flex; flex-direction: row; width: 100%; flex-wrap: wrap; }
.hk-select-input-mask-wrapper-disabled { background-color: #e9ecef; cursor: not-allowed; border-radius: 5px 0 0 5px; color: grey; min-height: 40px; }
.hk-select-input-mask-wrapper-disabled:focus { border: none; }
.hk-select-input-mask { display: flex; align-items: center; flex: 1; border-radius: 5px 0 0 5px; padding: .5rem; }
.hk-select-input-mask:focus { outline: none; }
.hk-select-clear { width: 40px; display: flex; padding: .5rem; align-items: center; justify-content: center; cursor: pointer; color: #dbdbdb; }
.hk-select-clear:hover { color: #333333; }
.hk-select-down-arrow path { fill: #dbdbdb; }
.hk-select-input-icon { width: 40px; display: flex; border-radius: 0 5px 5px 0; padding: .5rem; cursor: pointer; background: none; }
.hk-select-input-icon:focus { outline: none; box-shadow: 0 0 0 0.2rem rgba(38,143,255,.5); }
.hk-select-input-icon:hover { background-color: #f5f5f5; }
.hk-select-input-icon:hover .hk-select-down-arrow path { fill: #333333; }
.hk-select-input-icon-disabled,
.hk-select-input-icon-disabled:hover { background-color: #e9ecef; cursor: not-allowed; }
.hk-select-input-icon-disabled .hk-select-down-arrow path,
.hk-select-input-icon-disabled:hover .hk-select-down-arrow path { fill: #9c9c9c; }

.hk-select-multi-value { background-color: #ebebeb; display: flex; align-items: center; min-width: 0px; box-sizing: border-box; border-radius: 4px; margin: .4rem 0 .4rem .4rem; }
.hk-select-multi-value-label { color: rgb(51, 51, 51); font-size: 85%; text-overflow: ellipsis; white-space: nowrap; box-sizing: border-box; border-radius: 2px; overflow: hidden; padding: 3px 3px 3px 6px; }
.hk-select-multi-value-clear { -webkit-box-align: center; align-items: center; display: flex; padding: 4px; margin-right: 2px; box-sizing: border-box; border-radius: 4px; background-color: transparent; border: 0; outline: none; }
.hk-select-multi-value-clear:focus { outline: none; }
.hk-select-multi-value-clear:hover { background-color: rgb(212, 212, 212); color: rgb(222, 53, 11); }
.hk-select-results { position: absolute; box-shadow: 0 5px 10px rgba(0,0,0,.2); border: 1px solid #dbdbdb; min-height: 2rem; max-height: 30rem; overflow-y: auto; z-index: 10; width: 100%; background: #fff; }

.hk-select-result,
.hk-select-notfound,
.hk-select-results-help-template,
.hk-select-results-header,
.hk-select-results-footer { padding: .5rem; border-top: 1px solid #fff; border-bottom: 1px solid #fff; }

.hk-select-selected-item { background-color: #dbdbdb; }
.hk-select-selected-item-highlighted { background-color: #d3e2f2; }

.hk-select-active-item,
.hk-select-result:hover,
.hk-select-result:focus { background-color: #007bff; border-top: 1px solid #007bff; border-bottom: 1px solid #007bff; color: #fff; cursor: pointer; }
.hk-select-loader { width: 24px; height: 24px; background-color: #333; border-radius: 100%; -webkit-animation: hk-select-scaleout 1.0s infinite ease-in-out; animation: hk-select-scaleout 1.0s infinite ease-in-out; }

@-webkit-keyframes hk-select-scaleout {
    0% { -webkit-transform: scale(0) }
    100% { -webkit-transform: scale(1.0); opacity: 0; } 
}

@keyframes hk-select-scaleout {
    0% { -webkit-transform: scale(0); transform: scale(0); }
    100% { -webkit-transform: scale(1.0); transform: scale(1.0); opacity: 0; }
}

/* End HKSelect styles */

/* Start HKModal styles */

.hk-modal-container { display: block; position: fixed; top: 0; left: 0; width: 100%; height: 100%; z-index: 100; overflow-x: hidden; overflow-y: auto; outline: 0; background-color: rgba(0,0,0,0.5); }

.hk-modal { display: flex; flex-direction: column; background-color: #fff; border-radius: 4px; border: 1px solid #fff; padding: 1.5rem; box-shadow: 0 2px 2px rgba(0,0,0,.25); margin: 1.75rem; }
.hk-modal-focus-trap {min-height: 100%}
.size-small { max-width: 300px; margin-left: auto; margin-right: auto; }
.size-medium { max-width: 500px; margin-left: auto; margin-right: auto; }
.size-large { max-width: 800px; margin-left: auto; margin-right: auto; }
.size-extra-large { max-width: 1140px; margin-left: auto; margin-right: auto; }
.size-full-height { max-width: 500px; height: 100%; }
.size-automatic { width: -moz-fit-content; width: fit-content; margin-left: auto; margin-right: auto; }

.hk-modal-header { display: flex; align-items: flex-start; justify-content: space-between; padding: 0 0 2rem 0; }
.hk-modal-title { margin-bottom: 0; }
.hk-modal-close { padding: 1rem; margin: -1rem -1rem -1rem auto; background-color: transparent; border: 0; -webkit-appearance: none; cursor: pointer; font-size: 1.5rem; font-weight: bold; }

.position-topleft .hk-modal { margin-left: 1.75rem; }
.position-topright .hk-modal { margin-right: 1.75rem; }
.position-bottomleft .hk-modal { position: absolute; bottom: 0; left: 1.75rem; }
.position-bottomright .hk-modal { position: absolute; bottom: 0; right: 1.75rem; }
.position-middle { display: flex; flex-direction: column; justify-content: center; }

.position-fullright .hk-modal-focus-trap { height: 100%; }
.position-fullright .hk-modal { right: 0; top:0; margin: 0 0 0 auto; border-top-right-radius: 0; border-bottom-right-radius: 0; }

.fade-in { animation: 300ms ease-out 0s hk-modal-fade-in; }
.fade-out { animation: 300ms ease-out 0s hk-modal-fade-out; opacity: 0; }

@keyframes hk-modal-fade-in {
    0% { opacity: 0; }
    100% { opacity: 1; }
}

@keyframes hk-modal-fade-out {
    0% { opacity: 1; }
    100% { opacity: 0; }
}

/* End HKModal styles */

/* Start HKUpload styles */

.hk-file-uploader {display:block;max-width:300px}
.hk-file-uploader .hidden { display: none !important; }
.hk-file-uploader .hk-upload-area{display:block; position:relative; border:2px dashed blue; padding: 40px 20px; background-color:transparent; transition:0.3s; cursor:pointer;}
.hk-file-uploader .hk-upload-area:hover {background-color:cornflowerblue; }
.hk-file-uploader .hk-upload-area label{font-size:14px; color:black; pointer-events:none}
.hk-file-uploader .hk-upload-area  input{position:absolute; top:0; left:0; width:100%; height:100%; opacity:0; cursor:pointer;}
.hk-file-uploader .hk-start-upload-button{padding: 10px;}

.hk-file-uploader .hk-upload-error { color:red;}
.hk-file-uploader .hk-upload-results { padding-left: 0; list-style-type: none;}  
.hk-file-uploader .hk-upload-children { padding-left: 15px; list-style-type: none; }

.hk-file-uploader .hk-upload-results .hk-upload-result { text-decoration: none; margin-bottom: 5px;  }
.hk-file-uploader .hk-upload-results .hk-upload-result .hk-upload-result-row { display: flex; justify-content: space-between; }
.hk-file-uploader .hk-upload-results .hk-upload-result p { margin: 0; }

.hk-file-uploader .hk-upload-results .hk-upload-result .hk-upload-result-preview { width:40px; height:40px; margin: 5px 0; }
.hk-file-uploader .hk-upload-results .hk-upload-result .hk-upload-result-preview img { display:block; width:40px; height:40px; object-fit:cover; object-position:center; }
.hk-file-uploader .hk-upload-results .hk-upload-result .hk-upload-result-content { flex: auto; }

.hk-file-uploader .hk-upload-results .hk-upload-result button { height: 30px; color: red; }

.hk-file-uploader .hk-upload-results .hk-upload-result .hk-upload-result-error  { flex: 1 1 auto; width:100%; color:red; }

.hk-file-uploader .hk-upload-progress  {width:100%; height:4px; }
.hk-file-uploader .hk-upload-progress span{ background-color:blue; display:block; height:100%;max-width:100%; min-width:0; }

.hk-file-uploader.hk-file-uploader-in-progress .hk-upload-area { opacity:0; }

/* End HKUpload styles */