/*
deliverit dashboard main styles
Author: ShopSystem AS

Theme colors:
color1 - #17242a, color2 - #2B7A78, color3 - #3AAFA9, lightgray - #DEF2F1, darkgray - #222

*/

body {font-size: .875rem;}
.h2, h2 {background: #ededed; margin: 0; padding: 20px 10px; width: 100%; font-size: 2rem;}

[role="main"] {padding-top: 48px;}
.feather {width: 16px; height: 16px; vertical-align: text-bottom;}
.sidebar {position: fixed; top: 0; bottom: 0; left: 0; z-index: 100;  padding: 48px 0 0; box-shadow: inset -1px 0 0 rgba(0, 0, 0, .1);}
.sidebar-sticky {position: relative; top: 0; height: calc(100vh - 48px); padding-top: .5rem; overflow-x: hidden; overflow-y: auto;}
.padding-10 {padding:10px;}
.padding-20 {padding:20px;}
.padding-30 {padding:30px;}
.margin-20 {margin:20px;}
.no-left-margin {margin-left:0;}
.no-right-margin {margin-right:0;}
.but-right {padding:20px 30px; margin:0 0 0 20px;}
.but-left {padding:20px 30px; margin:0;}
.list-control-buttons {position: absolute; bottom: 0; right: 0; margin:0 0 20px 10px;}
.list-control-buttons span {float:right; padding: 2px;}
button[name=delete-products] {margin:0 0 20px 10px;}
select#delete-selector {margin:0 0 20px;}
input#new_qty {height: 100%; padding: 22px; width: 130px; float: right;}
.right {float:right;}
form {width:100%;}

div#weight-container input, div#size-container input {width:100%; margin: 0 0 6px;}
a.store-name {color:#fff; font-size:1.8em;}
a.store-change {color:#fff; font-size:0.8em;}
a.store-name:hover, a.store-change:hover {color:#fff; text-decoration:none;}

/* Sidebar styling */
@supports ((position: -webkit-sticky) or (position: sticky)) {
    .sidebar-sticky {position: -webkit-sticky; position: sticky;}
}

.sidebar-left {
    padding-top: 0.5rem !important;
}

/* Dropdown menu styling */
.dropdown-menu-custom {
    transform: none !important;
    will-change:auto !important;
    background-color: #17242a !important;
    top:0 !important;
    left: 100% !important;
    margin: 0 !important;
    padding: 0 !important;
    border-radius: 0 !important;
    border: none !important;
    border-left: 1px solid #555 !important;
}

.dropdown-item-custom{
    color: #fff !important;
    font-size: 1.05rem !important;
    font-weight: 200 !important;
}

.dropdown-item-custom:hover, .dropdown-item-custom:active, .dropdown-item-custom:focus {
    background-color: #2B7A78 !important;
}

.sidebar .nav-link {font-weight:200; color: #fff; font-size: 1.2em; padding: 15px 20px; border-bottom: 1px solid #555; transition: all 0.2s ease;}
.sidebar .nav-link:hover {background-color:#2B7A78;}
.sidebar .nav-link .feather {margin-right: 4px; color: #fff;}
.sidebar .nav-link.active {color: #fff;}
.sidebar .nav-link:hover .feather, .sidebar .nav-link.active .feather {color: inherit;}
.sidebar-heading {font-size: .75rem; text-transform: uppercase;}

.navbar-nav .dropdown-menu {position: absolute !important;}
.navbar-dark .navbar-nav .nav-link:hover {cursor:pointer;}
.navbar .form-control {padding: .75rem 1rem; border-width: 0; border-radius: 0;}
.navbar-dark .navbar-nav .nav-link {color: #fff;}
.navbar-dark .navbar-brand {padding:9px 20px; background:#17242a; text-align:left;}
.navbar-brand img {vertical-align: middle; border-style: none; max-height: 40px; padding: 5px 0;}

.bg-light {background-color: #17242a !important;}
.bg-dark {background-color: #2B7A78 !important;}

.btn-primary {color: #fff; background-color: #2B7A78; border-color: #2B7A78; padding: .35rem .5rem;}
.btn-primary.print-btn {padding:20px 60px;}
.btn-primary:hover, .btn-primary:active, .btn-primary:focus {background-color:#3aafa9; border-color: #3aafa9;}
.btn.btn-default {background-color:#666; border-color: #666; color:#fff; transition: all 0.2s ease;}
.btn.btn-default:hover, .btn.btn-default:active, .btn.btn-default:focus {background-color:#999; border-color: #999;}

#weight-container, #shipment-type {width:100%;}
#weight-container input:nth-of-type(even) {background-color:#def2f1; border:1px solid #a9a9a9;}
#size-container input:nth-of-type(6n+4), #size-container input:nth-of-type(6n+5), #size-container input:nth-of-type(6n+6) {background-color:#def2f1; border:1px solid #a9a9a9;}
.s-type {padding: 0 10px 0 20px;}

.form-control:focus {outline: none; box-shadow:none;}

.card {border:0;}
.card-header {background-color: #DEF2F1; color: #2b7a78;}

.fixed-top {border-bottom:1px solid #2b7a77; min-height: 58px;}

.form-control-dark {color: #fff; background-color: rgba(255, 255, 255, .1); border-color: rgba(255, 255, 255, .1);}
.form-control-dark:focus {border-color: transparent; box-shadow: 0 0 0 3px rgba(255, 255, 255, .25);}

.text-right {text-align:right;}
p.teaser {text-indent: 30px;}

/* Logs */
.dataTables_wrapper {border: 1px solid #ccc; margin: 0 0 40px;}
.dataTables_wrapper .dataTables_info {padding: 0.755em !important;}
.dataTables_wrapper .dataTables_paginate {padding: 0.25em !important;}

.dataTables_wrapper .dataTables_paginate .paginate_button.current {background: #2B7A78; border: 1px solid #2B7A78; color: #fff !important;}

/* user reporting */
div.input-daterange.input-group {padding:0 10px 0 0;}
span.input-group-addon {padding:8px 6px;}
table#user-report-table thead th {padding:10px 20px;}
table#user-report-table tbody tr td {padding:10px 20px;}
.form-inline form {margin:0;}

/* Data tables general styling */
table.dataTable.hover tbody tr, table.dataTable.display tbody tr {transition: all 0.2s ease;}
table.dataTable.hover tbody tr:nth-child(even), table.dataTable.display tbody tr:nth-child(even) {background:#DEF2F1;}
table.dataTable.hover tbody tr:hover, table.dataTable.display tbody tr:hover {background:#2b7a77; color:#fff; cursor:pointer;}
table.dataTable.hover tbody tr:hover a, table.dataTable.display tbody tr:hover a {color:#fff !important; border:1px solid #DEF2F1;}
table.dataTable.hover tbody tr a, table.dataTable.display tbody tr a {color:#2b7a77 !important; border:1px solid #2b7a77;}

table.dataTable { width:100% !important;}
table.dataTable tbody td {padding:15px 5px;}

.card .dataTables_length {width:50%; height:50px; background:#2b7a77; color:#fff; padding: .75rem 1.25rem;}
.card .dataTables_filter {width:50%; height:50px; background:#2b7a77; color:#fff; padding: .75rem 1.25rem;}
.card .dataTables_filter label {width:100%;}
.card .dataTables_filter input {min-width:50%; border:0; padding:2px; border-radius:2px;}
.card .dataTables_length select {border:0; padding:2px; border-radius:2px;}
.card .dataTables thead tr th {text-align: left; padding: 20px 5px;}

.on-hold {background: rgba(0,0,0,0.4) !important;}
.on-hold:hover {background: rgba(0,0,0,0.6) !important;}
.btn-primary.disabled {background-color: rgba(0,0,0,0.6); border-color: rgba(0,0,0,0.6);}
.disabled-header {background-color: rgba(0,0,0,0.6);color: rgba(255,255,255,0.7);}
input[type=checkbox], input[type=radio] {transform: scale(1.7);}

/* Styling for checkbox as a button */
.checkbox-button {background-color:#EFEFEF;border-radius:4px;border:1px solid #D0D0D0;overflow:auto;float:left;padding: 0 !important;}
.checkbox-button:hover{background-color:#DDD;transition: background-color .15s ease-in;}
.checkbox-button label {float:left;width: 100%;margin: 0;}
.checkbox-button label span {text-align:center;padding:20px 0;display:block;}
.checkbox-button label span:hover {cursor: pointer;}
.checkbox-button label input {position:absolute;top:-20px;}
.checkbox-button input:checked + span {background-color:#4BB543;transition: background-color .15s ease-in, color .15s ease-in;color:#fff;}

/* Picking */
button#searchShipment {margin: 0 0 0 20px; padding: 0 20px;}
#picking-table_wrapper {margin: 0 0 10px;}
button#registerUser {margin: 40px 0 20px 0; padding: 20px 40px; font-size: 1.2em; text-transform: uppercase;}
button#submitPickings {display: inline-block; width: auto; margin: 20px 0; padding: 20px 40px; font-size: 1.2em; text-transform: uppercase;}

/* reg picking error */
table#orderline-table .dt-body-center.sorting_1 {padding: 15px 15px 15px 0;}
div#errorTypeModal .checkbox-button.col-md-6 {margin: 2%; width: 46%;}
div#errorTypeModal .checkbox-button.col-md-12 {margin: 2%; width: 96%; float:none;}
div#errorTypeModal .checkbox-button input:checked + span {background-color:#2B7A78;}
div#errorTypeModal button.btn {padding: 10px 20px;}

/* User Reports */
.ef-reports {margin:20px 0;}
div.ef-reports div#rep1 {width:49%; float:left; font-size:1em;}
div.ef-reports div#rep2 {width:49%; float:right;}
div.ef-reports div#rep3 {margin:0 0 20px;}
.ef-reports  table.dataTable tfoot td {padding: 10px 18px 6px 4px;}

/* Edit User */
.btn-primary.btn-UserCard {display: inline; margin-top: -36px; position: absolute; left: 90px; background: #17242a;}
.edit-user input[type=checkbox] {margin: 0 0 0 5px;}
.edit-user h5 {margin: 0 0 15px;}

#outbox-table_wrapper, #inbox-table_wrapper {display: table;}