﻿.form-hidden { background-color: #ccc; opacity: .4; display: none !important; }

.accident-main { max-width: 960px; margin: 0 auto; }

.accident-form-header {  }

.accident-form {  }
.accident-form fieldset {  }

.field-validation-valid { margin: 0 !important; }
.field-validation-error { color: #f00; }
.input-validation-error:not([type="checkbox"]):not([type="radio"]) { border-color: #f00; }

.loading { position: relative; }
.loading > * { opacity: .5; }
.loading::after { content: 'Hämtar information...'; opacity: 1; font-weight: bold; position: absolute; left: 50%; top: 20%; transform: translate(-50%, 0); }

.row-icon { position: absolute; left: 6px; top: 10px; width: 30px; height: 30px; }


/***************************
    FLATPICKR
***************************/
.flatpicker-clearable { position: relative; display: block; display: flex; }
.flatpicker-clearable button { cursor: pointer; font-size: 20px; line-height: 28px; font-family: sans-serif; top: 50%; transform: translateY(-50%); border-radius: 3px; position: absolute; right: 3px; background-color: transparent; width: 28px; height: 28px; appearance: none; -webkit-appearance: none; -moz-appearance: none; border: 0; }
.flatpicker-clearable button:hover { background-color: #eee; }
.flatpicker-clearable.inline { display: inline-block; }
/*.flatpicker-clearable input { flex: 1 }*/
input[type="date"].flatpickr-mobile,
input[type="text"].date-time.flatpickr-input,
input[type="datetime-local"].flatpickr-mobile,
input[type="datetime"].flatpickr-mobile { min-height: 32px; line-height: 1em !important; }
input[type="date"].flatpickr-mobile { min-width: 120px; }

.flatpickr-mobile + button { display: none; }

.saved::after { content: 'Sparat'; color: #059669; display: inline-block; transition: ease opacity .2s; opacity: 0; margin-left: 5px; }
.saved-show::after { opacity: 1; }

/*.mox-datatable th > span,
.mox-datatable td > span,
.mox-datatable th > a,
.mox-datatable td > a { padding: 2px 10px; display: block }
.mox-datatable td { border-top: 1px solid #eee; }
.mox-datatable th { font-weight: bold }
.mox-datatable { border: 1px solid #eee; width: 100% }*/

.text-green-700 { background-color: #283e03; }
.border-green-500 { border-color: #6ea80b; }
.bg-green-50 { background-color: #e2eece; }
/*.hidden { display: none;}*/

@media (pointer: coarse) {
    .mouse-only { display: none; }
}

@media (pointer: none) {
    .mouse-only { display: none; }
}

@media (pointer: fine) {
    .touch-only { display: none; }
}