input[name="reference"],
input[name="amount"] {
    padding: 8px;
}

div.oscar {
    overflow-x: scroll;
}

.oscar .help-block {
    display: block;
    padding: 0;
}

label[for] {
	cursor: pointer;
}
.sortable-handle {
	cursor: grab;
}
.oscar .sortable-handle label {
    width: 1px;
    margin-right: 10px;
}
.oscar .sortable-handle input[type="checkbox"] {
    margin-left: 24px;
    margin-top: 1.2em;
}

table {
    &.listing {
        table-layout:fixed;
        thead {
            th {
                overflow: hidden; 
                text-overflow: ellipsis; 
                word-wrap: break-word;
            }
        }
    }
}

.form-inline {
    #id_q.form-control {
        display: block;
        width: initial;
    }
}

form.order_table {
    table {
        tbody {
            tr {
                td {
                    word-wrap: break-word;
                }
            }
        }
    }
}

.orderstatus_bubble{
    width:50px ;
    height:50px ;
    border-radius:10px ;
    display: flex ;
    position:relative;
    >input{
        position: absolute;
        top: 50%;
        left: 50%;
        transform: translate(-50%, -50%);
        margin: 0;
        width: 20px;
    }
    &.paid{
        background-color: #fff3cd
    }
    &.complete{
        background-color: #d4edda
    }

    &.cancelled{
        background-color: #f8d7da
    }

    &.new{
        background-color: #00a9ff
    }

    &.pending-payment{
        background-color: #ff9d00
    }

    &.delayed-payment{
        background-color: #ce84ff
    }

    &.refund{
        background-color: #ff9859
    }
}