/* Generic settings */

body {
    padding-top: 70px;
}

.background-picture {
    background: url("bg.jpg") no-repeat center center fixed;
    background-size: cover;
}

.no-padding-top {
    padding-top: 0;
}

.no-margin-top {
    margin-top: 0;
}

h3.no-margin-top {
    /*border-bottom: 2px solid #c76b6b;*/
    margin-bottom: 1em;
}

.navbar {
    box-shadow: 0 0 3px rgba(0, 0, 0, 0.4);
}

.navbar-brand {
    padding: 8px 18px 0 15px;
    color: #e65955;
}

@media (max-width: 991px) {
    .nav > li > a {
        padding: 15px 5px;
    }
}

.nowrap {
    white-space: nowrap;
}

.wordbreak {
    word-break: break-all;
}

/* Transaction status colors */

.status-accept {
    color: green;
}

.status-reject {
    color: red;
}

.status-chargeback {
    color: red;
}

.status-pending {
    color: orange;
}

/* HERE Map */

.map {
    width: 100%;
    height: 240px;
}

@media (min-width: 768px) { .map { height: 480px; } }
@media (min-width: 1280px) { .map { height: 800px; } }

/* HERE Map Info Bubble */

.H_ib {
    font-size: 10px !important;
}

.H_ib_content {
    padding: 5px !important;
}

/* Styling for graph panel */
.panel-body.graph {
    padding: 15px 0 0 0;
}

h3.panel-title + a.pull-right {
    margin-top: -19px;
    margin-right: -7px;
}


/* Form styling */
.doubleconfirm .checkbox, .inline-checkboxes .checkbox {
    display: inline-block;
    margin-right: 1em;
}

.monospace {
    font-family: monospace;
}

.split-50 {
    width: 50%;
    display: inline-block;
}

.split-50 h4 {
    margin: 0;
}

@media (max-width: 768px) {
    .split-50 {
        display: block;
        width: 100%;
    }
}

.label + .label, .label + .tooltip + .label {
    margin-left: 0.5em;
}

.right1em {
    margin-right: 1em;
}

.padright1em {
    padding-right: 1em !important;
}

.intrusive {
    display: block;
    margin-top: -4px;
}

.color-dot {
    text-shadow: 0 0 1px rgba(0, 0, 0, 0.9);
}

.color-dot.transparent {
    opacity: 0;
}

.table-condensed > tbody > tr > td.amount {
    padding-top: 2px;
    padding-bottom: 2px;
}

.bottom05em, label.bottom05em {
    margin-bottom: 0.5em;
}

.form-group + .help-block {
    margin-top: -0.6em;
}

/* Logging */
#log.show-workerid {
    padding-left: 1.5em;
}
#log span {
    color: black;
    display: block;
}

#log span:nth-child(even) {
    color: #008080;
}

#log-wrap {
    position: relative;
}

#log-wrap #menu {
    position: absolute;
    top: 10px;
    right: 10px;
}

#log-wrap #menu.affix {
    position: fixed;
    top: 60px;
}

.loading-msg {
    display: none;
}

#log-wrap.loading .loading-msg {
    display: inline-block;
}

#log .log-warn, .log-error {
    color: red;
}

#log .log-critical {
    font-weight: bold;
    color: red;
}

#log .log-critical:nth-child(even), #log .log-warn:nth-child(even) {
    color: darkred;
}

#log.show-workerid span:before {
    content: attr(data-workerid);
    position: absolute;
    margin-top: 3px;
    margin-left: -2em;
    font-size: 70%;
    opacity: 0.6;
}

#log.fullLog span[data-transaction]:after {
    font-family: "Font Awesome 5 Pro";
    content: "\f0ec";
    float: right;
    color: grey;
}

#log .log {
    overflow: hidden;
    position: relative;
}

@media (max-width: 1024px) {
    #log .log {
        overflow: initial;
    }
    #log .log:after {
        display: none;
    }
}

#log .truncated {
    height: 100px;
    opacity: 0.7;
}

#log .truncated:before {
    content: 'Truncated.. doubleclick to expand';
    background: white;
    color: black;
    padding: 5px 10px;
    position: absolute;
    left: 50%;
    margin-left: -125px;
    top: 40px;
    border-radius: 1em;
    cursor: pointer;
}

.btn + .btn {
    margin-left: 1em;
}

/* Table headers */
thead tr, tr.merchant {
    background-color: #f2fcff !important;
    border-top: 1px solid grey;
    font-size: 16px;
}

.table > thead > tr > th, .table > tbody > tr.merchant > th {
    border-top: 1px solid grey;
    border-bottom: 2px solid grey;
    vertical-align: bottom;
}

.th-width-40 {
    width: 40%;
}

.th-width-30 {
    width: 30%;
}

.th-width-20 {
    width: 20%;
}

.th-width-15 {
    width: 15%;
}

.th-width-10 {
    width: 10%;
}

/* Table stripe colors */
.table-striped>tbody>tr:hover {
    background-color: #eff5ef;
}

/* AlpacaJS */
.alpaca-enter-submit-workaround {
    border: 0;
    padding: 0;
    font-size: 0
}

.alpaca-form > .alpaca-field {
    padding: 0;
}

.alpaca-field-array, .alpaca-form {
    background-color: whitesmoke;
}

.alpaca-form {
    padding: 10px;
    border: 1px solid grey !important;
    border-radius: 4px;
}

.alpaca-field-array .alpaca-field-array {
    background-color: #eaf5db;
    border: 1px solid grey;
}

.alpaca-field-object {
    border: 1px solid grey !important;
}

.alpaca-array-actionbar {
    margin-bottom: -10px;
}

.schedule .alpaca-array-actionbar > * {
    float: right !important;
}

.alpaca-container .form-group {
    margin-right: 0;
    margin-left: 0;
}

.schedule .alpaca-container-item {
    position: relative;
}

.schedule .alpaca-container-item .col-sm-9 {
    width: 60%;
}

.schedule .alpaca-array-actionbar {
    margin-bottom: 0;
    position: absolute;
    top: 0;
    right: 0;
}

/* Custom checkboxes styling doesnt work with Alpaca markup */
.alpaca-control.radio input[type="radio"], .alpaca-control.checkbox input[type="checkbox"] {
    opacity: 1;
}

.alpaca-control.radio label::before, .alpaca-control.checkbox label::before {
    content: none;
}

.langtabs {
    margin-bottom: 0;
}

.langtabs ul > li > a {
    padding-top: 6px;
    padding-bottom: 4px;
}

.tt-left .tooltip-inner {
    text-align: left;
}

tr.success > td {
    background-color: #dff0d8 !important;
}

/* Datatables style overrides */
div table.dataTable.table-condensed > thead > tr > th {
    padding-right: 25px;
}

/* Safari date input styling override bootstrap */
@media screen and (-webkit-min-device-pixel-ratio: 0) {
    input[type=date].form-control, input[type=time].form-control, input[type=datetime-local].form-control, input[type=month].form-control {
        line-height: 1em;
    }
}

a.notactive {
    text-decoration: line-through;
}

@media screen and (min-width: 768px) {
    .container {
        width: 100%;
    }
}

@media screen and (min-width: 1200px) {
    .container {
        width: 1170px;
    }
}

.bootstrap-select {
    max-width: 100%
}


.bootstrap-select .dropdown-menu > li > a {
    white-space: inherit;
}

.bootstrap-select .dropdown-menu > li > a small {
    white-space: nowrap;
}

.barcode {
    display: inline-block;
    background: url('barcodetypes.png') no-repeat;
    width: 84px;
    height: 84px;
    transform: scale(0.7);
}

.barcode.aztec {
    background-position: 0 0;
}

.barcode.qr {
    background-position: -84px 0;
}

.barcode.datamatrix {
    background-position: -168px 0;
}

.barcode.code128 {
    display: none;
}

.barcode.code39 {
    display: none;
}

/*!
 * Generated with CSS Flag Sprite generator (https://www.flag-sprites.com/)
 */
.flag {
    display: inline-block;
    width: 16px;
    height: 11px;
    background: url('flags.png') no-repeat
}

.flag.flag-se {
    background-position: -16px -11px
}

.flag.flag-gb {
    background-position: -16px 0
}

.flag.flag-ru {
    background-position: 0 -11px
}

.flag.flag-fi {
    background-position: 0 0
}