// Core variables and mixins
@import "bootstrap3/variables.less";
@import "bootstrap3/mixins.less";

// Reset and dependencies
// @import "bootstrap3/normalize.less";
// @import "bootstrap3/print.less";

// Core CSS
// @import "bootstrap3/scaffolding.less";
// @import "bootstrap3/type.less";
// @import "bootstrap3/code.less";
@import "bootstrap3/grid.less";
@import "bootstrap3/tables.less";
// @import "bootstrap3/forms.less";
// @import "bootstrap3/buttons.less";

// Components
@import "bootstrap3/component-animations.less";
@import "bootstrap3/dropdowns.less";
// @import "bootstrap3/button-groups.less";
// @import "bootstrap3/input-groups.less";
@import "bootstrap3/navs.less";
// @import "bootstrap3/navbar.less";
// @import "bootstrap3/breadcrumbs.less";
// @import "bootstrap3/pagination.less";
// @import "bootstrap3/pager.less";
// @import "bootstrap3/labels.less";
// @import "bootstrap3/badges.less";
// @import "bootstrap3/jumbotron.less";
// @import "bootstrap3/thumbnails.less";
// @import "bootstrap3/alerts.less";
// @import "bootstrap3/progress-bars.less";
// @import "bootstrap3/media.less";
// @import "bootstrap3/list-group.less";
// @import "bootstrap3/panels.less";
// @import "bootstrap3/responsive-embed.less";
@import "bootstrap3/wells.less";
// @import "bootstrap3/close.less";

// Components w/ JavaScript
// @import "bootstrap3/modals.less";

// Utility classes
@import "bootstrap3/utilities.less";
@import "bootstrap3/responsive-utilities.less";

// Core variables and mixins separate from frontend variables and mixins
@import "dashboard/variables.less";
@import "dashboard/mixins.less";
@import "dashboard/alerts.less";
@import "dashboard/base.less";
// @import "dashboard/buttons.less";
@import "dashboard/button-groups.less";
@import "dashboard/datetimepicker.less";
@import "dashboard/dropdowns.less";
@import "dashboard/navbar.less";
@import "dashboard/forms.less";
// @import "dashboard/tables.less";
@import "dashboard/login.less";
@import "dashboard/index.less";
@import "dashboard/catalogue.less";
// @import "dashboard/order.less";
// @import "dashboard/sortable.less";

// // Components: Icons / Fonts
@import "font-awesome/mixins.less";
@import "font-awesome/font-awesome.less"; // Replaced sprites with font-awesome

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
    }
}

/* Footer in settings menu fix */
.nav-submenu ul .footer{ position: unset !important; }

.pagination{
  display: flex;
}
.pagination li{
  margin-right: .5rem;
}

#page-reorder-form {
    table.listing {
        colgroup {
            col:first-child {
                width: 4%;
            }
        }
    }
}
