﻿:root {
    --primary-company-color: #EC5454;
    --primary-button-color: #4464AD;
    --primary-button-border: #4464AD;
    --primary-background-color: #FFFFFF;
    --primary-button-hover: #36508A;
    --darkmode-text-color: #FFFFFF;
    --lightmode-text-color: #0A2D50;
    --link-color: #0000EE;
    --border-color: #BDBDBD;
    --background-body: #f2f5f9;
}

* {
    margin-left: 0;
    margin-right: 0;
    margin-top: 0;
}

html, body, form {
    height: 100%;
}

* html #wrap, * html #inner-wrap {
    height: 100%;
}

.rgHeader, .rgHeaderWrapper, .rgPager {
    background: #D1E0E3 !important;
}

/*.bid-column-border {
    border-color: red !important;
    border-left-width: 1px !important;
    border-right-width: 1px !important;
}*/

.bid-column-border > div {
    border-color: red !important;
    border-left-width: 1px !important;
    border-right-width: 1px !important;
    border: 1px solid red;
}

.bid-column-border .riTextBox {
    width: 45px !important;
}

.rgCommandTable .rgSave {
    margin-left: 405px !important;
}

body {
    font-size: 0.7em;
    font-family: 'Lucida Grande',Lucida,Verdana,sans-serif !important;
    /*    background-image: url('../Images/Structure/background-diagonal-striped.png');*/
    background-color: #F2F5F9;
}

    body.white-background {
        background: #FFFFFF;
    }


#parent-div {
    display: flex;
    flex-direction: column;
    /*    justify-content: flex-start;*/
    margin-top: 5px;
    /*    max-width: 1265px;*/
    /*    min-height: 1400px;*/
    /*    white-space: nowrap;*/
    background-color: #F2F5F9;
}

/*#left-div {
    background: white;
    max-width: 1265px;
}*/

#left-div {
    display: flex;
    margin: auto;
    max-width: 1265px;
}

@media(min-width: 1256px) {
    #left-div {
        display: flex;
        justify-content: center;
        /*    max-width: 1265px;*/
    }
}

/*@media screen and (max-width: 400px) {
    #right-div {
        display: none !important;
    }
    #left-div {
        width: 100%;
    }
    #content {
        width: 100% !important;
    }
}*/

/*    #parent-div > div {
    vertical-align: top;
    display: inline-block;
}*/

.sidebar-col-img {
    position: relative;
    display: block;
    width: 100%;
}

.col-img-grad {
    background: rgb(77, 54, 108);
    background: -moz-linear-gradient(top, rgba(77, 54, 108, 1) 0%, rgba(147, 118, 178, 1) 90%);
    background: -webkit-linear-gradient(top, rgba(77, 54, 108, 1) 0%, rgba(147, 118, 178, 1) 90%);
    background: linear-gradient(to bottom, rgba(77, 54, 108, 1) 0%, rgba(147, 118, 178, 1) 90%);
    filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#4d366c', endColorstr='#9376b2', GradientType=0 );
}

h1 {
    color: #C41010;
    font-size: 2.5em;
    font-weight: 100;
    padding-bottom: 20px;
}

textarea, input, select {
    resize: none;
    overflow: hidden;
    font: 1em 'Lucida Grande',Lucida,Verdana,sans-serif;
    margin-bottom: 0px;
}

.booking-sub-table-textbox.is-disabled {
    background: #EFEFEF4D;
    border-color: #e5e7eb;
}

.hideme {
    display: none !important;
}

.bold {
    font-weight: bold;
}

.underline {
    text-decoration: underline;
}

.pointer {
    cursor: pointer;
}

.required {
    color: Red;
    vertical-align: top;
    text-align: left;
    font-size: 0.7em;
}

.small-text-centered {
    font-size: 0.8em;
    text-align: center;
}

.fill-width {
    width: 100%;
}

.float-left {
    float: left;
}

.float-right {
    float: right;
}

.center {
    text-align: center;
}

.top-align {
    vertical-align: top !important;
}

.middle-align {
    vertical-align: middle !important;
}

.left-align {
    text-align: left !important;
}

.right-align {
    text-align: right !important;
}

.center-align {
    text-align: center !important;
}

.block {
    display: block;
}

.width-100p {
    width: 100%;
}

.width-50p {
    width: 50%;
}

.width-33p {
    width: 33%;
}

.width-25p {
    width: 25%;
}

.margin-2 {
    margin: 5px;
}

.height-40 {
    height: 40px;
}

.margin-bottom-32 {
    margin-bottom: 32px;
}

.top-minus2 {
    position: relative;
    top: -2px;
}

.block {
    display: block;
}

.datepicker {
    width: 107px !important;
}

.datepicker-dateonly {
    width: 67px !important;
}

.timepicker {
    width: 43px !important;
}

.divider {
    border-bottom: 1px solid #E0E0E0;
    border-top: 1px solid #B1B1B1;
}

.round-corners-small {
    border-radius: 2px !important;
}

.adhoc-button {
    padding: 3px;
    text-decoration: none;
}

.round-corners-large {
    border-radius: 8px !important;
}

.button-size-tiny-joblist {
    height: 18px !important;
    font-size: 0.9em !important;
    margin-bottom: 4px;
}

.button-size-tiny {
    height: 18px !important;
    font-size: 0.9em !important;
}

.button-size-small {
    height: 24px !important;
    font-size: 0.9em !important;
}

.button-size-width-200px {
    width: 200px;
}

.button-size-small-admin {
    height: 50px !important;
    width: 97px !important;
    font-size: 0.9em !important;
    white-space: normal;
    margin: 4px;
}

.Escalation-step {
    height: 50px !important;
    width: 93px !important;
    font-size: 1.6em !important;
    font-weight: bold;
    white-space: normal;
    margin-left: 4px;
    display: table-cell;
    vertical-align: middle;
    text-align: right;
}

.button-size-large {
    height: 40px !important;
    font-size: 1.5em !important;
}

.missing-bank-details {
    background-color: bisque;
}

.extra-padding-top-bottom {
    padding-bottom: 20px !important;
    padding-top: 20px !important;
}

.extra-padding-bottom {
    padding-bottom: 30px !important;
}

.uppercase {
    text-transform: uppercase;
}

#wrap {
    margin: auto;
    min-height: 100%;
    position: relative;
    width: 1265px !important;
    background: #F2F5F9;
    /*    background-image: url(../Images/Structure/background-diagonal-striped.png);*/
}

#noadvert-wrap {
    margin: auto;
    min-height: 100%;
    position: relative;
    /*width: 960px;*/
    /*    width: 1200px;*/
    max-width: 1265px;
}

#inner-wrap {
    padding-bottom: 50px;
}

    #inner-wrap:after {
        clear: both;
        content: " ";
        display: block;
    }

#noadvert-header {
    background-color: #EEEEEE;
    border-radius: 0 0 10px 10px;
    color: #C41010;
    height: 100px;
    width: 100%;
}

.header-logo {
    color: #FFFFFF;
    height: 90px;
    padding-top: 4px;
}

.header-logo-text {
    color: #FFFFFF;
    font-size: 45px;
    line-height: 1;
}

#left-header {
    padding-left: 10px;
    /*	cursor: pointer;*/
}

#menu {
    position: absolute;
}

.menu-list {
    padding: 0;
}

.editable:hover {
    cursor: pointer;
    background-color: #D9EDF8;
}

.menu-list li {
    border-radius: 8px;
    font-size: 15px;
    height: 30px;
    line-height: 2;
    list-style-type: none;
    margin-top: 5px;
    text-align: center;
    cursor: pointer;
}

#content {
    padding: 30px 30px;
    min-width: 1200px;
    max-width: 1200px;
    /*width: 900px;*/
    /*width: 95%;*/
}

#noadvertsFooter {
    background-color: #EEEEEE;
    bottom: 0;
    color: #C41010;
    height: 32px;
    /*position: fixed;*/
    margin: auto;
    margin-top: 5px;
    width: 960px;
    border-radius: 10px 10px 0 0;
}

/*#left-footer
{
	float: left;
	padding-left: 10px;
	padding-top: 7px;
}*/

/*#left-footer a, #left-footer a:visited
{
	color: #C41010;
}

#right-footer
{
	float: right;
	padding-right: 10px;
	padding-top: 7px;
}*/

/*.copyright
{
	font-size: 0.7em;
	vertical-align: top;
	margin-left: 1px	
}
*/
.login-message-container {
    color: #C41010;
    font-size: 1.2em;
    font-weight: bold;
    padding: 10px;
    text-align: center;
}

#login-link-container {
    height: 25px;
    width: 100%;
    cursor: pointer;
}

#LoginContainerDiv {
    height: 76px;
    left: 915px;
    padding: 12px;
    /*    position: absolute;*/
    top: 0;
    width: 321px;
}

    #LoginContainerDiv.content {
        padding: 0px;
    }

#NoAdvertLoginContainerDiv {
    height: 76px;
    left: 615px;
    padding: 12px;
    position: absolute;
    top: 0;
    width: 321px;
}

#login-toggle {
    font-size: 20px;
    cursor: pointer;
}

.login-cell {
    width: 100%;
}

.login-textbox {
    height: 25px;
    width: 150px;
    padding: 0 0 0 2px;
}

.login-button-container {
    float: right;
    margin-right: 10px;
    position: relative;
    top: -6px;
}

.login-button {
}

.logout-button {
    margin-top: -4px;
}

.login-username {
    font-weight: bold;
}

.login-table {
    padding: 12px;
    width: 100%;
}

.login-small-text {
    font-size: 0.8em;
    height: 14px;
    margin-top: 4px;
}

    .login-small-text.forgot-password {
        clear: both;
        float: left;
    }

    .login-small-text.remember-me {
        clear: both;
        float: left;
    }

    .login-small-text.main-site-link {
        clear: both;
        float: left;
    }

.shadow {
    box-shadow: none;
}

.white-text-shadow {
    text-shadow: 2px 2px 1px #656565;
}

.watermark-focus-out {
    color: Gray;
    background-color: #EAEAEA;
    border: 1px solid silver;
}

.watermark-focus-in {
    color: #000000;
    background-color: #FFFFFF;
    border: 1px solid silver;
}

.grey {
    background-color: #EAEAEA;
    color: Gray;
    border: 1px solid silver;
}

.button, .menu-list-item {
    color: #FFFFFF !important;
    background: #C41010 !important;
    background: -moz-linear-gradient( top, #C41010 0%, #D11111 25%, #C41010) !important;
    background: -webkit-gradient( linear, left top, left bottom, from(#C41010), color-stop(0.25, #D11111), to(#C41010)) !important;
    box-shadow: 0px 1px 3px rgba(000,000,000,0.5), inset 0px -1px 0px rgba(255,255,255,0.7) !important;
    text-shadow: 0px -1px 1px rgba(000,000,000,0.2), 0px 1px 0px rgba(255,255,255,0.3) !important;
    border: 1px solid #902D2D !important;
}

    .button:hover, .menu-list-item:hover {
        background: #C41010 !important;
        background: -moz-linear-gradient( top, #C41010 0%, #840B0B 25%, #C41010) !important;
        background: -webkit-gradient( linear, left top, left bottom, from(#C41010), color-stop(0.25, #840B0B), to(#C41010)) !important;
        box-shadow: 0px 0px 0px rgba(000,000,000,0.5), inset 0px -1px 0px rgba(255,255,255,0.7) !important;
        text-shadow: 0px -1px 1px rgba(000,000,000,0.2), 0px 1px 0px rgba(255,255,255,0.3) !important;
        border: 1px solid #8D3F3F !important;
    }

    .button:active, .menu-list-item:active {
        position: relative !important;
        top: 2px !important;
    }

.spacer-row-8 {
    height: 8px;
}

.spacer-row-12 {
    height: 12px;
}

.spacer-row-20 {
    height: 20px;
}

#divAdminNotifiction {
    font-size: 1em;
    font-weight: bold;
    margin-bottom: -15px;
    margin-top: 5px;
    text-align: center;
}

#divAdminCustomerSelector {
    margin-bottom: -10px;
    margin-top: 20px;
    text-align: center;
}

#ddlAdminCustomerSelector {
    width: 240px;
}

#quote-only-content {
    height: auto !important;
    /*    margin-left: 150px;*/
}

#quote-section {
    background-color: #C41010;
    color: #FFFFFF;
    border-radius: 25px;
    margin: 20px auto 30px auto;
    padding: 5px;
    /*    margin-left: 300px;*/
    text-align: center;
    width: 600px;
    height: 100%;
    padding-bottom: 25px;
}

.quote-table-top {
    width: 100%;
}

.quote-table-left {
    width: 300px;
    float: left;
}

.quote-table-right {
    width: 300px;
}

.quote-table-bottom {
    width: 600px;
}

.max-width-table {
    /*table-layout: fixed;*/
    /*width: 100%;*/
}

    .max-width-table td {
        white-space: -o-pre-wrap;
        word-wrap: normal;
        white-space: pre-wrap;
        white-space: -moz-pre-wrap;
        white-space: -pre-wrap;
        text-indent: 0px;
    }

#quote-section hr {
    background: -webkit-gradient(linear, left top, left bottom, from(#DC7171), to(#FFFFFF));
    background: -moz-linear-gradient(left center, rgba(255, 255, 255, 0.4), rgba(255, 255, 255, 0.8), rgba(255, 255, 255, 0.4));
    filter: progid:DXImageTransform.Microsoft.gradient(startColorstr=#DC7171, endColorstr=#FFFFFFFF);
    -ms-filter: "progid:DXImageTransform.Microsoft.gradient(startColorstr=#DC7171, endColorstr=#FFFFFF)";
    border: 0 none;
    height: 1px;
    margin-bottom: -7px;
    margin-top: 5px;
}

.quote-textbox-cell > span, .quote-dropdown-cell > span {
    font-size: 0.8em;
}

.quote-textbox {
    height: 16px;
    width: 286px;
    margin-top: 2px;
}

.quote-date-textbox {
    width: 136px !important;
}

.quote-textbox-medium {
    height: 16px;
    width: 136px;
    margin-top: 2px;
}

.quote-textbox-multiline {
    height: 56px;
    width: 286px;
    margin-top: 2px;
}

.textBoxAsLabel {
    height: 16px;
    width: 25px;
    margin-top: 2px;
    border-style: none;
    background-color: transparent;
}

.quote-textbox-narrow {
    height: 16px;
    /* width: 61px;*/
    width: 60px;
    margin-top: 2px;
}

.quote-dropdown {
    height: 22px;
    width: 292px;
    margin-top: 2px;
}

    .quote-dropdown option {
        background-color: #FFFFFF;
        color: #000000;
    }

.quote-button-cell {
    padding: 8px 4px 0;
    text-align: center;
    vertical-align: middle;
}

.quote-checkbox-cell {
    padding: 4px 4px 0;
    text-align: left;
    vertical-align: middle;
}

    .quote-checkbox-cell label {
        position: relative;
        top: -3px;
        padding-left: 4px;
    }

.quote-midpoint-container {
    margin: 4px 0;
    padding: 8px 0;
}

.quote-midpoints-heading {
    font-size: 0.8em;
    display: block;
    margin: 8px;
}

#quote-midpoints {
    width: 100%;
    list-style: none;
    padding: 0;
}

    #quote-midpoints table {
        border-collapse: collapse;
    }

    #quote-midpoints td {
        vertical-align: bottom;
    }

    #quote-midpoints img {
        width: 16px;
    }

    #quote-midpoints li span {
        font-size: 0.8em;
    }

    #quote-midpoints li div {
        display: inline-block;
        text-align: left;
    }

.quote-midpoint-add-item {
    text-align: center;
    padding: 4px;
    font-size: 0.8em;
    border: 1px solid white;
    margin-bottom: 8px;
    cursor: pointer;
    display: inline-block;
}

    .quote-midpoint-add-item:hover {
        position: relative;
        top: 1px;
    }

.quote-midpoint-handle {
    float: left;
    padding: 18px 0 0 0;
    clear: both;
    cursor: move;
}

.quote-midpoint-placeholder {
    margin-top: 4px;
    margin-bottom: 4px;
    height: 28px;
    background-color: transparent;
}

.quote-midpoint-remove {
    cursor: pointer;
    position: relative;
    top: 4px;
    left: 3px;
}

    .quote-midpoint-remove:hover {
        top: 5px;
    }

.quote-midpoint-textbox-cell {
    width: 100%;
    padding: 4px 4px 0;
    text-align: left;
}

.quote-midpoint-dropdown-cell {
    width: 100%;
    padding: 4px 4px 0;
    text-align: left;
}

.quote-midpoint-addresstype {
    height: 22px;
    margin-top: 2px;
    margin-right: 4px;
    width: 80px;
}

.quote-midpoint-postcode {
    height: 16px;
    margin-top: 2px;
    width: 165px;
}

#quote-midpoint-container hr {
    display: block;
    border: none;
    color: white;
    height: 1px;
}

.journey-estimate-mileage, .journey-estimate-time {
    float: right;
}

.journey-estimate-loading-image {
    height: 32px;
    display: none;
}

.quote-textbox-cell, .quote-dropdown-cell {
    /*width: 192px;*/
    width: 180px;
    padding: 4px 4px 0;
    text-align: left;
}

.quote-textbox-cell-inner {
    vertical-align: middle;
    width: 192px;
    height: 30px;
    display: inline-block;
}

.quote-vehicle-load-details-cell {
    font-size: 0.8em;
    height: 36px;
}

    .quote-vehicle-load-details-cell td {
        width: 33%;
    }

.quote-insurance-message-cell {
    font-size: 0.8em;
    padding: 0 12px 0 12px;
    height: 66px;
}

.quote-insurance-dropdown-cell {
    padding-right: 4px;
}

#quote-result-message {
    font-size: 0.8em;
    height: 130px;
    padding-left: 20px;
    padding-right: 20px;
    text-align: justify;
}

.quote-insurance-dropdown {
    height: 22px;
    margin-bottom: 10px;
    margin-top: 7px;
    padding: 3px 3px 3px 0;
    width: 50px;
}

    .quote-insurance-dropdown option {
        background-color: #FFFFFF;
        color: #000000;
    }

.quote-button {
    font-size: 1.5em;
    width: 100%;
    margin-top: 10px;
    height: 30px;
}

.quote-button-narrow {
    font-size: 1.5em;
    width: 32%;
    margin-top: 10px;
    height: 30px;
}

.quote-heading-cell {
    height: 40px;
    padding: 4px;
}

.quote-sub-heading-cell {
    padding-top: 8px;
    font-weight: bold;
    font-size: 0.8em;
}

.quote-horizontal-rule-cell {
    padding: 4px 0 7px 4px;
}

.quote-heading {
    font-size: 1.5em;
    position: relative;
    top: -7px;
}

.content-container {
}

#quote-result-section {
    text-align: center;
}

#quote-result > table {
    width: 100%;
}

#quote-result-reference, #quote-result-distance, #quote-result-distance2, #quote-result-distance2 {
    font-size: 1.2em;
    height: 30px;
}

#quote-result-price-heading, #quote-result-price-heading2 {
    font-size: 1.2em;
    font-weight: bold;
    padding: 5px 0 0 0;
}

#quote-result-price {
    font-size: 2.3em;
    font-weight: bold;
    padding: 5px 0 0 0;
}

#quote-result-price2 {
    font-size: 2.1em;
    font-weight: bold;
    padding: 5px 0 0 0;
}

#quote-result-button {
    height: 50px;
}

#quote-loading-image {
    display: none;
    margin-top: 45px;
}

#quote-result-cancel {
    height: 0;
}

#quote-result-cancel-image {
    position: relative;
    top: 8px;
    left: 140px;
}

#quote-result-booking-link {
    font-size: 8px;
    color: black;
    background-color: white;
}

#content-description {
    font-size: 1.2em;
    text-align: center;
}

#content-inner-container {
    font-size: 1.2em;
    margin-top: 25px;
    text-align: justify;
}

    #content-inner-container td {
        padding: 20px;
        vertical-align: top;
        width: 50%;
    }

.content-spacer-20 {
    margin-bottom: 20px;
}

.content-image-large {
    margin: 20px 0 20px 100px;
}

.content-table-centered {
    margin-left: auto;
    margin-right: auto;
    text-align: justify;
    width: 450px;
}

    .content-table-centered hr {
        background-image: -moz-linear-gradient(left center, transparent, rgba(0, 0, 0, 0.5), transparent);
        border: 0 none;
        height: 1px;
        width: 100px;
    }

.content-table-row {
    height: 25px;
    font-size: 0.8em;
}

.content-table-cell-button {
    text-align: center;
    height: 80px;
}

.content-table-button {
    height: 30px;
}

.content-table-cell-input {
    width: 90px;
}

.content-table-cell-input-wide {
    width: 98%;
    overflow-x: hidden;
    overflow-y: scroll;
}

.content-table-cell-wide {
    vertical-align: top;
    padding-top: 4px;
}

.content-heading-cell {
    vertical-align: top;
}

.message-row {
    padding: 6px;
}

.deregister-container {
    margin-bottom: 18px;
}

    .deregister-container span {
        display: block;
    }

.heading-cell {
    font-weight: bold;
}

.currency-input {
    text-align: left;
}

.textbox-size-medium {
    width: 250px;
    height: 25px;
    margin-bottom: 5px;
}

.job-list-search-container {
    text-align: center;
}

.job-list-search-criteria-table {
    border: 0;
    width: 100%;
    text-align: left;
}

#job-list-update-button-container {
    left: -4px;
    position: relative;
    text-align: right;
    top: 23px;
    width: 100%;
    z-index: 400;
}

.job-list-update-supplier-button-container {
    left: -4px;
    position: relative;
    text-align: right;
    top: 23px;
    width: 100%;
    z-index: 400;
}

.supplier-name-dropdown {
    width: 275px;
}

#job-list-container {
    height: 100%;
    width: 100%;
    /*padding-top: 10px;*/
}

.job-list {
    padding: 2px;
}

.one-column {
    width: 445px;
}

.two-column {
    margin-bottom: 10px;
    /*    width: 900px;*/
    width: 1200px;
}

.profile-sub-table {
    width: 882px;
}

.profile-permission-message {
    width: 882px;
    display: block;
    margin-top: 25px;
    font-size: 2em;
    margin-bottom: 25px;
    text-align: center;
}

.booking-sub-table {
    background: none repeat scroll 0 0 #EEEEEE;
    border: 4px solid #C41010;
    border-radius: 8px 8px 8px 8px;
    padding: 5px;
    box-shadow: 0px 1px 3px rgba(000,000,000,0.5), inset 0px -1px 0px rgba(255,255,255,0.7);
    box-sizing: border-box;
}

    .booking-sub-table > tbody > tr > th {
        color: #FFFFFF;
        font-size: 1.2em;
        text-align: center;
        height: 25px;
        border-radius: 8px 8px 8px 8px;
        background: -moz-linear-gradient( top, #C41010 0%, #D11111 25%, #C41010);
        background: -webkit-gradient( linear, left top, left bottom, from(#C41010), color-stop(0.25, #D11111), to(#C41010));
        background: #C41010;
        box-shadow: 0px 1px 3px rgba(000,000,000,0.5), inset 0px -1px 0px rgba(255,255,255,0.7);
        text-shadow: 0px -1px 1px rgba(000,000,000,0.2), 0px 1px 0px rgba(255,255,255,0.3);
        border: 1px solid #902D2D;
    }


.booking-spacer-row {
    height: 10px;
}

.booking-sub-table-label-row {
    height: 26px;
}

.booking-sub-table-label-cell {
    height: 26px;
}

.booking-sub-table-label-cell-exchange-left {
    width: 30%;
    height: 25px;
    font-weight: bold;
    padding: 2px;
}

.booking-sub-table-label-cell-exchange-right {
    width: 70%;
    padding: 2px;
    height: 25px;
}

.booking-sub-table-message-exchange-cell {
    font-size: 1.2em;
    padding: 20px;
    text-align: center;
}

.booking-notes {
    width: 97%;
    height: 50px;
    overflow: auto;
}

.booking-courier-confirm-custom-cost-row {
    height: 50px;
    text-align: center;
}

    .booking-courier-confirm-custom-cost-row input[type='text'] {
        width: 50px;
    }

.booking-courier-confirm-custom-table {
    margin: 12px auto;
    text-align: left;
    width: 225px;
}

    .booking-courier-confirm-custom-table tr {
        height: 24px;
    }

.booking-courier-confirm-extra-text-container {
    margin: 0 auto 24px;
    text-align: justify;
    width: 600px;
}

    .booking-courier-confirm-extra-text-container textarea {
        height: 200px;
        margin-top: 12px;
        width: 100%;
        overflow-y: scroll !important;
    }

.booking-multidrop-addresses {
    width: 100%;
    border-collapse: collapse;
}

    .booking-multidrop-addresses th {
        text-align: left;
        font-weight: normal;
        padding: 0 0 6px 6px;
    }

    .booking-multidrop-addresses td {
        padding: 4px 0 0 6px;
    }

.booking-multidrop-address {
    width: 15%;
}

.booking-multidrop-address-wide {
    width: 35%;
}

.booking-multidrop-addresses input[type='text'] {
    width: 98.5%;
}

.custom-ETA-cell {
    padding-left: 11px;
}

.message-exchange-row {
    vertical-align: top;
}

.message-exchange-name-cell {
    padding: 10px;
    text-align: left;
}

    .message-exchange-name-cell > span {
        font-size: 0.8em;
        font-style: italic;
    }

.message-exchange-message-container {
    background-color: #FFFFFF;
    border: 1px solid #A9A9A9;
    border-radius: 10px 10px 10px 10px;
    color: #000000;
    min-width: 350px;
    padding: 10px;
    text-align: center;
}

.message-exchange-message-cell {
    padding: 10px;
}

.new-message-label-cell {
    padding: 10px 0 0 10px;
}

.new-message-textbox {
    margin: 10px;
    width: 97%;
}

.new-message-button-cell {
    padding: 0 10px 10px;
    text-align: right;
}

.narrow {
    width: 88% !important;
}

.booking-sub-table-control-cell > input {
    vertical-align: middle;
}

.booking-sub-table-control-cell > span {
    vertical-align: middle;
    font-weight: bold;
}

.booking-sub-table-amend-price-cell {
    text-align: center;
    font-size: 1em;
    padding: 5px 0 5px 0;
}

    .booking-sub-table-amend-price-cell > input[type="text"] {
        width: 100px;
    }

    .booking-sub-table-amend-price-cell > input[type="checkbox"] {
        margin: 0;
        padding: 0;
        vertical-align: middle;
        width: 25px;
    }

.booking-sub-table-textbox {
    width: 98%;
    overflow: auto !important;
    height: 16px;
}

.booking-sub-table-textarea {
    width: 97%;
    overflow: auto !important;
    height: 16px;
}

.booking-sub-table-textarea-wide {
    width: 99%;
    overflow: auto !important;
    height: 16px;
}

.booking-sub-table-textbox.invalid, .booking-sub-table-label-cell input[type="text"].invalid {
    background: #F8C8C8;
    border: 1px solid #C41010;
    padding: 2px;
}

.invalid {
    background: #F8C8C8;
    border: 1px solid #C41010;
    padding: 2px;
}

.booking-sub-table-dropdown {
    width: 99.3%;
    padding: 2px 2px 2px 0;
}

.booking-sub-table-dropdown-narrow {
    padding: 2px 2px 2px 0;
}

    .booking-sub-table-dropdown.invalid, .booking-sub-table-dropdown-narrow.invalid {
        background: #F8C8C8;
        border: 1px solid #C41010;
    }

.booking-sub-table-label-cell {
    padding: 0 0 0 6px;
    width: 20%;
}

.booking-sub-table-control-cell {
    padding: 0 0 0 6px;
    width: 30%;
}

.booking-sub-table-notes-textbox {
    width: 390px;
    width: 100%;
}

/*#booking-footer-row {
    height: 50px;
    text-align: center;
}*/

.booking-footer-button-cell {
    padding-bottom: 30px;
}

.booking-validation-heading-cell {
    font-weight: bold;
    padding: 2px 0 5px 0;
}

.booking-validation-section-cell {
    width: 175px;
    padding: 2px 0 2px 0;
}

.booking-validation-message-cell {
    width: auto;
    padding: 2px 0 2px 0;
}

.booking-sub-table-message-cell {
    text-align: center;
    font-size: 1.4em;
    font-weight: bold;
    padding-bottom: 4px;
}

.booking-sub-table-insurance-cell {
    text-align: center;
}

.booking-insurance-radio-button-list {
    width: 100%;
    text-align: center;
}

    .booking-insurance-radio-button-list input {
        margin-right: 5px;
    }

.booking-sub-table-warning-cell {
    font-size: 2em;
    font-weight: bold;
    padding-bottom: 20px;
    padding-top: 20px;
    text-align: center;
}

.bank-details-warning-cell {
    color: red;
    font-size: 0.9em;
}

.editable-label html body .RadInput input.riTextBox {
    border: none;
}

.booking-sub-table-instruction-cell {
    text-align: center;
    font-size: 1em;
    font-weight: bold;
    padding-bottom: 16px;
}

.border {
    border-style: groove;
}

.booking-consignment-grid {
    font-size: 0.7em;
    font-weight: normal;
    line-height: 2;
    width: 100%;
}

.booking-consignment-grid-header {
    background: green;
    border: 0;
}

    .booking-consignment-grid-header th {
        border: 0 none;
        border-radius: 0 0 0 0;
        height: 16px;
        min-width: 50px;
        font-size: 1em;
        font-weight: normal;
    }

.booking-consignment-grid-header-description {
    width: 430px;
}

    .booking-consignment-grid-header-description input[type="text"] {
        width: 98%;
    }

.booking-consignment-grid-footer {
    border: 1px solid #E8E8E8;
    height: 30px;
}

    .booking-consignment-grid-footer td {
        padding: 2px;
        text-align: center;
        border: 0;
    }

    .booking-consignment-grid-footer input[type="text"] {
        width: 84%;
        text-align: left;
    }

        .booking-consignment-grid-footer input[type="text"].invalid {
            background: #F8C8C8;
            border: 1px solid #C41010;
            padding: 2px;
        }

    .booking-consignment-grid-footer input[type="image"] {
        padding-top: 3px;
    }

.booking-consignment-grid-footer-description input[type="text"] {
    width: 98%;
}

.booking-consignment-grid-row {
    text-align: center;
    border: 1px solid silver;
}

    .booking-consignment-grid-row td {
        border: 0;
    }

    .booking-consignment-grid-row input[type="image"] {
        padding-top: 3px;
        padding-bottom: 3px;
    }

.booking-consignment-grid-edit {
    border: 0;
}

    .booking-consignment-grid-edit td {
        padding: 2px;
        text-align: center;
        border: 0;
    }

    .booking-consignment-grid-edit input[value="Item Description"] {
        width: 98% !important;
    }

    .booking-consignment-grid-edit input[type="text"] {
        width: 84%;
        text-align: left;
    }

    .booking-consignment-grid-edit input[type="image"] {
        padding-top: 3px;
    }

    .booking-consignment-grid-edit input[type="text"].invalid {
        background: #F8C8C8;
        border: 1px solid #C41010;
        padding: 2px;
    }

.booking-consignment-section-container {
    /*	height: 80px;*/
    padding-left: 15px;
}

.booking-consignment-section-cell {
    font-size: 0.8em;
    font-weight: bold;
    text-align: center;
    width: 38%;
}

#booking-consignment-header-table tr {
    font-weight: bold;
}

#booking-consignment-single-item-table {
    width: 300px !important;
}

.booking-consignment-separator {
    font-size: 1.3em;
    font-weight: bold;
    padding-top: 22px;
    vertical-align: top;
}

.booking-consignment-small-label-cell {
    font-size: 0.8em;
    text-align: left;
    padding-left: 4px;
}

.booking-consignment-small-label-cell-dropdown {
    font-size: 0.8em;
    text-align: left;
}

.booking-consignment-textbox {
    /*    width: 61px;*/
    width: 54px;
}

    .booking-consignment-textbox.long {
        width: 300px !important;
    }

    .booking-consignment-textbox.invalid {
        background: #F8C8C8;
        border: 1px solid #C41010;
        padding: 2px;
    }

.booking-consignment-description-textbox {
    width: 98%;
    height: 48px;
    overflow: auto;
}

.input-container {
    position: relative;
    display: inline-block;
}

    .input-container input {
        padding-right: 30px;
    }

    .input-container .unit {
        position: absolute;
        right: 10px;
        top: 50%;
        transform: translateY(-50%);
        color: red;
        font-weight: bold;
    }

.consignment-button-row {
    width: 100px;
}

.booking-consignment-dropdown {
    width: 130px;
}

.booking-consignment-textbox-cell {
    width: 61px;
}

.booking-consignment-dropdown-cell {
    width: 200px;
}

#booking-summary-container-table td {
    vertical-align: top;
    word-wrap: break-word;
    max-width: 250px;
}

.booking-summary-label-cell, .booking-consignment-label-cell {
    font-weight: bold;
    width: 170px;
}

.booking-summary-control-cell, .booking-consignment-control-cell {
    width: 250px;
}

.edit-description {
    height: 300px;
}

.booking-summary-label-cell, .booking-summary-control-cell, .booking-consignment-label-cell, .booking-consignment-control-cell {
    padding: 5px;
}

.booking-summary-text-cell {
    padding: 5px;
    border: 1px solid gray;
    font-size: x-small;
    width: 90%;
}

.booking-summary-text-cell-short {
    padding: 5px;
    border: 1px solid gray;
    font-size: xx-small;
    width: 20%;
}

.underweight {
    color: green;
    font-weight: bold;
}

.overweight {
    color: red;
    font-weight: bold;
}

.booking-summary-inner-table-email-textbox {
    height: 80px;
    margin: 5px;
    width: 430px;
}

#booking-billing-container-table td {
    vertical-align: top;
}

.booking-billing-inner-table {
    width: 98%;
}

.booking-billing-inner-table {
    width: 100%;
}

.booking-payment-button-container {
    position: absolute;
    top: 250px;
    left: 250px;
}

.booking-supplier-action-message {
    font-weight: bold;
    padding: 10px;
    text-align: center;
}

.booking-customer-action-message {
    text-align: left;
    padding: 10px;
}

.booking-supplier-action-message.courier-actions {
    text-align: left;
    padding-left: 6px;
}

.booking-customer-control-cell {
    text-align: left;
    padding: 10px;
}

#booking-supplier-actions-container-table tr {
    vertical-align: top;
}

.escalation-dropdown {
    margin-right: 8px;
    float: left;
}

.escalation-button {
    top: 2px;
    position: relative;
}

.register-availability-responses-table {
    margin-left: auto;
    margin-right: auto;
    padding-bottom: 20px;
    width: 65%;
}

.register-availability-messages-button {
    text-align: center;
    height: 30px;
}

.content-table-cell-input.register-eta {
    width: 200px;
}

.register-eta {
    margin-bottom: 0;
}

#supplier-response-list-container {
    text-align: center;
    width: 900px;
    margin-left: auto;
    margin-right: auto;
}

.supplier-response-list-heading {
    text-align: justify;
}

.supplier-response-list-insurance {
    font-size: 1.3em;
    font-weight: bold;
    text-align: center;
}

.supplier-response-list-job-details {
    font-size: 1.5em;
    margin: auto;
    padding-bottom: 12px;
    text-align: center;
    width: 748px;
}

.supplier-response-list-admin {
    margin: 20px;
    text-align: center;
}

#supplier-responses-extra-options {
    border-radius: 12px;
    box-shadow: 1px 1px 6px 2px #c0c0c0;
    margin: 48px auto;
    padding: 12px;
    width: 750px;
}

    #supplier-responses-extra-options td {
        height: 45px;
    }

        #supplier-responses-extra-options td.bordered {
            border-bottom: 1px solid #C0C0C0;
        }

.supplier-response-list-comment, .supplier-profile-choose-courier-comment {
    padding: 12px;
}

    .supplier-response-list-comment > span, .supplier-profile-choose-courier-comment > span {
        vertical-align: top;
    }

    .supplier-response-list-comment textarea, .supplier-profile-choose-courier-comment textarea {
        width: 400px;
    }

.supplier-response-autoallocate-container {
    padding-bottom: 12px;
}

    .supplier-response-autoallocate-container > span {
        position: relative;
        top: -3px;
        margin-right: 4px;
    }

#supplier-availability-history-container {
    margin-left: auto;
    margin-right: auto;
    margin-top: 19px;
    text-align: center;
    width: 565px;
}

.supplier-registration-table {
    width: 100%;
}

.supplier-registration-application-comments-textbox {
    margin: 5px 0 10px;
    width: 400px;
}

.supplier-registration-message-cell {
    font-size: 1.4em;
    padding: 0 35px 20px;
    text-align: justify;
}

.supplier-registration-control-cell-wide {
    padding: 0 0 10px;
    width: 50%;
}

.supplier-registration-control-cell-narrow {
    padding: 10px 0 10px;
}

.supplier-registration-control-cell-wide input[type="radio"] {
    float: left;
    margin-right: 5px;
    margin-top: 2px;
}

.supplier-registration-control-cell-wide label {
    display: block;
    margin-left: 18px;
    margin-bottom: 5px;
}

.supplier-registration-control-cell input[type="file"] {
    height: 22px;
}

.supplier-registration-label-cell-wide {
    padding: 0 20px 10px 0;
    text-align: justify;
    width: 50%;
    height: 25px;
}

.supplier-registration-label-cell-extra-wide {
    padding: 10px 20px 10px 0;
    text-align: justify;
    height: 25px;
}

.supplier-registration-control-cell {
    width: 300px;
    height: 25px;
}

.supplier-registration-image-cell {
    width: 300px;
    padding: 20px 0;
    text-align: center;
}

    .supplier-registration-image-cell img {
        box-shadow: 0px 0px 5px black;
        max-width: 500px;
        max-height: 500px;
    }

    .supplier-registration-image-cell > span {
        border: 1px solid silver;
        box-shadow: 0px 0px 5px silver;
        display: block;
        font-weight: bold;
        margin-left: auto;
        margin-right: auto;
        padding: 20px;
        width: 200px;
    }

.supplier-registration-label-cell {
    width: 145px;
    height: 25px;
}

.supplier-registration-textbox {
    margin-bottom: 4px;
    width: 92%;
}

.supplier-registration-textbox-narrow {
    margin-bottom: 4px;
    width: 50px;
}

.supplier-registration-textbox.invalid,
.supplier-registration-textbox input[type="text"].invalid,
.supplier-registration-radio.invalid {
    background: #F8C8C8;
    border: 1px solid #C41010;
    padding: 2px;
}

.supplier-registration-dropdown {
    margin-bottom: 4px;
    width: 92%;
    height: 22px;
}

.supplier-registration-dropdown-wide {
    height: 22px;
    margin-bottom: 4px;
    width: 95%;
}

.supplier-registration-dropdown.invalid {
    background: #F8C8C8;
    border: 1px solid #C41010;
}

.supplier-registration-spacer-cell {
    height: 40px;
    vertical-align: middle !important;
}

.supplier-registration-spacer-cell-small {
    height: 20px;
    vertical-align: middle !important;
}

.supplier-registration-spacer-cell hr,
.notification-spacer-cell hr,
.metrics-spacer hr {
    background: -webkit-gradient(linear, 0 0, 100% 0, from(white), to(white), color-stop(50%, black));
    background: -moz-linear-gradient(left center, rgba(255, 255, 255, 0.4), rgba(0, 0, 0, 0.8), rgba(255, 255, 255, 0.4));
    filter: progid:DXImageTransform.Microsoft.gradient(startColorstr=#FFFFFF, endColorstr=#000000);
    -ms-filter: "progid:DXImageTransform.Microsoft.gradient(startColorstr=#FFFFFF, endColorstr=#000000)";
    border: 0 none;
    height: 1px;
    width: 100%;
}

.supplier-registration-footer-button-cell {
    text-align: center;
    height: 50px;
    width: 100%;
}

.supplier-registration-deletion-cell {
    padding: 3px;
}

.supplier-registration-deletion-checkbox {
    vertical-align: middle;
}

.supplier-registration-example-image-cell {
    padding: 6px 0 0;
}

    .supplier-registration-example-image-cell img {
        width: 170px;
        box-shadow: 0px 0px 5px black;
    }

.supplier-registration-example-text-cell {
    text-align: justify;
    padding: 6px 6px 0;
}

#MainContentPlaceholder_ddcJourneaseVehicleTypes > input {
    margin-right: 5px;
    vertical-align: -4px;
}

.left-section-single {
    width: 33%;
    padding-left: 10px;
}

.right-section-double {
    width: 66%;
}

#supplier-profile-inner-table-left {
    width: 100%;
}

#supplier-profile-inner-table-right {
    width: 100%;
}

.supplier-profile-name-heading {
    font-size: 1.7em;
    font-weight: bold;
    padding-bottom: 10px;
}

.supplier-profile-companyname-heading, .supplier-profile-heading {
    padding-bottom: 5px;
}

.supplier-profile-image-heading {
    font-weight: bold;
    font-size: 1.2em;
    padding-bottom: 10px;
}

.supplier-profile-image-cell {
    padding-bottom: 20px;
}

.supplier-profile-license-image-cell {
    padding-bottom: 20px;
    padding-top: 20px;
    text-align: center;
}

    .supplier-profile-image-cell img, .supplier-profile-license-image-cell img {
        box-shadow: 0px 0px 5px black;
        max-width: 500px;
        max-height: 500px;
    }

.supplier-profile-textbox.invalid, .supplier-profile-textbox-narrow.invalid {
    background: #F8C8C8;
    border: 1px solid #C41010;
    padding: 2px;
}

.supplier-profile-dropdown.invalid {
    background: #F8C8C8;
    border: 1px solid #C41010;
}

.supplier-profile-textbox-narrow {
    width: 70px;
}

.supplier-profile-load-jobs-cell {
    text-align: center;
    padding: 16px;
}

.supplier-profile-choose-courier-cell {
    height: 30px;
    padding-bottom: 8px;
    padding-top: 12px;
    text-align: center;
}

.supplier-confirmation-popup > span {
    display: block;
    padding: 18px;
    text-align: justify;
    font-weight: bold;
}

.supplier-invoice-summary-invoice-number-btn {
    margin-left: 1px !important;
    margin-top: -5px !important;
    height: 28px !important;
}

.supplier-invoice-summary-bank-details-btn {
    margin-left: -1px !important;
    margin-top: 9px !important;
}

.supplier-invoice-summary-invoice-txtbox {
    margin-left: -3px !important;
    margin-top: -3px !important;
}

.supplier-invoice-summary-bank-acc-txtbox {
    margin-left: -3px !important;
}

.supplier-invoice-summary-bank-details-txtbox {
    margin-left: -3px !important;
}

.invoice-number {
    padding-bottom: 40px;
}

.supplier-confirmation-popup input[type="button"] {
    float: right;
    margin-right: 18px;
}

.supplier-profile-comments {
    overflow: auto !important;
}

.supplier-comment-textbox {
    width: 87%;
    margin-top: 4px;
}

.supplier-comment-button {
    position: relative;
    top: -8px;
}

.supplier-comments-container {
    margin-top: 4px;
}

.supplier-profile-job-statistics-container {
    padding: 12px;
}

.reallocate-supplier-row {
    text-align: center;
}

    .reallocate-supplier-row input {
        position: relative;
        top: 2px;
    }

.booking-summary-control-cell input[type="radio"] {
    float: left;
    margin-right: 5px;
}

.booking-summary-mobile-link-cell {
    height: 25px;
    padding-left: 4px;
}

.supplier-response-textbox {
    width: 75px;
}

.supplier-notification-sms {
    width: 98%;
    margin-top: 12px;
}

.supplier-notification-sms-label {
    position: relative;
    top: -16px
}

.supplier-notification-sms-button {
    margin-top: 46px;
}

.configuration-table {
    padding: 12px;
    width: 100%;
}

.configuration-label-cell {
    font-weight: bold;
    padding: 5px;
}

.configuration-button-cell {
    text-align: right;
    padding-right: 6px;
    padding-bottom: 6px;
}

.configuration-checkbox > input {
    margin: 4px 0 0 0;
}

.broadcast-summary-spacer-cell {
    height: 42px;
    width: 450px;
}

.administration-actions-table {
    padding: 12px;
    width: 100%;
}

.administration-configuration-textbox {
    width: 50px;
}

.administration-configuration-textbox-wide {
    width: 413px;
    height: 66px;
    margin-left: 5px;
}

#divAdminMessage {
    text-align: center;
    margin-bottom: 12px;
}

.multi-checkbox-vehicle-types input[type='checkbox'] {
    margin-right: 4px;
}

.notification-filter-cell {
    padding-left: 5px;
    padding-right: 5px;
}

.notification-filter-cell-wide {
    width: 240px;
}

.notification-spacer-cell {
    height: 25px;
}

.notification-email-textbox, .notification-subject-textbox, .notification-body-textbox {
    width: 99%;
    overflow: auto;
}

.notification-label-cell {
    font-size: 0.8em;
    height: 25px;
    padding-bottom: 2px;
    vertical-align: bottom;
}

.notification-button-cell {
    padding-right: 3px;
    padding-top: 10px;
    text-align: right;
    width: 100%;
}

.notification-filter-table {
    width: 100%;
}

.weekly-member-table {
    width: 100%;
    padding: 8px;
}

.weekly-member-subject-textbox, .weekly-member-body-textbox {
    width: 99%;
    overflow: auto;
    padding: 4px;
}

.weekly-member-limit-textbox {
    width: 24px;
    height: 22px;
    text-align: center;
}

.weekly-member-label-cell {
    font-size: 0.8em;
    padding-bottom: 2px;
    padding-top: 4px;
    vertical-align: bottom;
}


/* RadGrid Default link colors*/
div.RadGrid_Default .rgRow a, div.RadGrid_Default .rgAltRow a {
    color: #0000EE;
}

    div.RadGrid_Default .rgRow a:hover, div.RadGrid_Default .rgRow a:visited,
    div.RadGrid_Default .rgAltRow a:hover, div.RadGrid_Default .rgAltRow a:visited {
        color: #551A8B;
    }
/* RadGrid Default link colors*/

.RadGrid_Default.gridlines .rgRow > td, .RadGrid_Default.gridlines .rgAltRow > td {
    border-bottom: 1px solid #afafaf;
}

.rgMasterTable .rgCaption {
    font-weight: bold;
    padding-left: 6px;
    padding-top: 2px;
    text-align: left;
}

.job-summary-popup-container, .bid-summary-popup-container, .similar-job-popup-container {
    background: none repeat scroll 0 0 #FFFFFF;
    border-radius: 8px 8px 8px 8px;
    padding: 4px;
    box-shadow: 0px 0px 8px rgba(000,000,000,0.75), inset 0px -1px 0px rgba(255,255,255,1.0);
    position: absolute;
    z-index: 10;
}

.job-summary-popup-inner, .bid-summary-popup-inner, .similar-job-popup-inner {
    background: none repeat scroll 0 0 #FFFFFF !important;
    border: 2px solid red !important;
    border-radius: 5px 5px 5px 5px;
    height: 185px;
    width: 285px;
    padding: 4px;
}

.similar-job-bid-popup-inner {
    background: none repeat scroll 0 0 #FFFFFF !important;
    border: 2px solid red !important;
    border-radius: 5px 5px 5px 5px;
    height: 250px;
    width: 500px;
    padding: 4px;
    vertical-align: top;
}

.job-summary-table, .bid-summary-table, .similar-job-table {
    width: 100%;
    height: 175px;
    margin-left: 5px;
    margin-right: 5px;
    border: none !important;
    background: none repeat scroll 0 0 #FFFFFF !important;
    table-layout: fixed;
}

.similar-job-bid-table {
    width: 100%;
    height: 250px;
    border: none !important;
    background: none repeat scroll 0 0 #FFFFFF !important;
    table-layout: fixed;
    vertical-align: top;
    text-align: center;
}

.awaiting-payment-invoice-no {
    width: 100px;
    max-width: 100px;
    word-wrap: break-word;
}

.awaiting-payment-supplier {
    width: 70px;
    max-width: 70px;
    word-wrap: break-word;
}

.awaiting-payment-checkboxes {
    width: 15px;
}

.awaiting-payment-no-of-jobs {
    align-content: center;
}

.job-summary-table-header, .bid-summary-table-header, .similar-job-table-header {
    text-align: center !important;
    text-decoration: underline;
    height: 10px;
    color: black;
    border: none !important;
    background: none repeat scroll 0 0 #FFFFFF !important;
    padding-bottom: 8px;
}

.job-summary-table-cell, .bid-summary-table-cell, .similar-job-table-cell {
    text-align: left !important;
    height: 10px;
    color: #000000;
    border: none !important;
    background: none repeat scroll 0 0 #FFFFFF !important;
    text-wrap: normal;
    word-wrap: break-word;
}

.similar-job-bid-table-cell {
    text-align: center !important;
    height: 24px;
    color: #000000;
    border: none !important;
    background: none repeat scroll 0 0 #FFFFFF !important;
    text-wrap: normal;
    word-wrap: break-word;
}

.similar-job-header-cell {
    text-align: center !important;
    height: 10px;
    border: 1px 0 0 0 solid black !important;
    background: none repeat scroll 0 0 #FFFFFF !important;
    text-wrap: normal;
    word-wrap: break-word;
}

.job-summary-sms-message {
    width: 97%;
    height: 100px;
    overflow: auto;
}

.job-summary-sms-count-text {
    font-weight: normal;
}

.job-summary-action-message-row {
    font-size: 2em;
    font-weight: bold;
    height: 32px;
    text-align: center;
}

.job-summary-action-message-container {
    padding: 24px;
    background-color: yellow;
    border: 1px solid black;
    box-shadow: 2px 2px 6px -2px black;
}

.job-summary-action-message-row > td {
    padding: 20px 55px;
}

.RadComboBoxDropDown .rcbCheckBox, .RadComboBoxDropDown .rcbCheckAllItemsCheckBox {
    margin-right: 4px;
    margin-top: -3px;
    vertical-align: middle;
}

.RadComboBox.invalid .rcbInputCell {
    background: #F8C8C8;
    border: 1px solid #C41010;
}

#supplier-registration-complete-message {
    font-size: 1.5em;
    margin-left: 80px;
    margin-right: 80px;
    margin-top: 60px;
    text-align: center;
}

.error-message-container {
    text-align: center;
}

.error-message-heading {
    font-size: 2.5em;
    color: #C41010;
    margin: 50px;
}

.error-message-heading-small {
    font-size: 1.5em;
    color: orangered;
    margin: 50px;
    padding: 20px;
}

.error-message {
    font-size: 1.5em;
    margin: 50px;
}

.notification-sent-message-cell {
    text-align: center;
    font-size: 1.5em;
    font-weight: bold;
    color: #C41010;
    height: 25px;
}

.upgrade-link {
    background: none repeat scroll 0 0 #C41010;
    border: 1px solid #902D2D;
    border-radius: 8px 8px 8px 8px;
    box-shadow: 0 1px 3px rgba(0, 0, 0, 0.5), 0 -1px 0 rgba(255, 255, 255, 0.7) inset;
    color: #FFFFFF;
    font-size: 1.5em;
    padding: 8px 24px;
    text-decoration: none;
    text-shadow: 0 -1px 1px rgba(0, 0, 0, 0.2), 0 1px 0 rgba(255, 255, 255, 0.3);
}

.RadDropDownList.RadDropDownList_Default.invalid {
    border: 1px solid #C41010;
    border-radius: 4px 4px 4px 4px;
}

.return-journey-no-data-cell {
    font-size: 1em;
    padding: 20px;
    text-align: center;
}

.small-text {
    font-size: 0.8em;
    font-weight: normal;
}

.quote-sub-text {
    font-size: 0.6em;
    font-weight: normal;
}

.invoice-registration-label-cell {
    font-weight: bold;
}

.invoice-registration-control-cell {
    padding-left: 8px;
    padding-right: 8px;
}

.invoice-registration-email-container {
    border: 1px solid #C0C0C0;
    border-radius: 12px;
    box-shadow: 1px 2px 3px #C0C0C0;
    display: block;
    padding: 12px;
    margin-bottom: 24px;
}

.invoice-registration-email-table {
    width: 100%;
}

    .invoice-registration-email-table tr {
        height: 24px;
    }

.invoice-registration-email-sent {
    color: #228B22;
    font-size: 1.5em;
    font-weight: bold;
}

.invoice-matching-header-container {
    width: 100%;
}

.invoice-matching-header-details {
    margin-bottom: 16px;
}

.invoice-matching-header-detail-title {
    font-size: 1.2em;
    font-weight: bold;
}

.invoice-matching-header-detail-value {
    font-size: 1.2em;
}

.invoice-matching-header-table {
    width: 100%;
}

.invoice-matching-header-cell {
    height: 24px;
}

invoice-matching-header-cell.input {
    margin-top: 2px;
}

.invoice-matching-header-checkbox > label {
    font-weight: bold;
    font-size: 1.2em;
}

.invoice-matching-header-checkbox > input {
    margin-left: 6px;
    position: relative;
    top: 2px;
}

.invoice-paid-header-checkbox input {
    top: 7px;
    padding-top: 4px;
}

invoice-matching-header-textbox {
    margin-left: 6px;
    position: relative;
    top: 2px;
}

.invoice-matching-grid-title {
    display: inline-block;
    font-size: 1.4em;
    margin: 0 0 12px 6px;
}

.invoice-matching-list-container {
    margin-bottom: 24px;
    overflow: hidden;
}

.invoice-query-full-text-container {
    height: 95%;
    overflow: auto;
    padding: 12px;
}

.invoice-matching-approve-container {
    float: right;
    margin-top: 12px;
}

.supplier-invoice-query-window-container {
    width: 100%;
    height: 100%;
    overflow: hidden;
}

.supplier-invoice-query-window-table {
    width: 100%;
    height: 100%;
    padding: 12px;
}

    .supplier-invoice-query-window-table tr {
        height: 30px;
    }

.supplier-invoice-query-window-signature-cell {
    height: 40px;
    padding-top: 8px;
}

.supplier-invoice-summary {
    margin-bottom: 24px;
    overflow: hidden;
}

.supplier-invoice-summary-table {
    width: 100%;
}

.supplier-invoice-summary-pay-table {
    width: 100%;
    margin-top: 12px;
}

    .supplier-invoice-summary-pay-table tr {
        height: 24px;
    }

    .supplier-invoice-summary-pay-table td {
        width: 50%;
    }

        .supplier-invoice-summary-pay-table td label {
            left: 4px;
            position: relative;
            top: -2px;
        }

.RadGrid .rgRow td, .RadGrid .rgAltRow td, .RadGrid .rgEditRow td {
    padding-bottom: 1px !important;
    padding-top: 1px !important;
}

.rgNoRecords td {
    font-weight: bold;
    text-align: center !important;
    padding: 12px;
}

.invoice-registration-header-table {
    width: 100%;
}

.invoice-registration-row {
    height: 24px;
}

.invoicing-list-header-label-cell {
    font-weight: bold;
    padding-left: 8px;
    padding-right: 8px;
}

.invoicing-list-header-control-cell {
    padding-left: 8px;
    padding-right: 8px;
}

.supplier-invoice-summary-number-cell {
    font-size: 2em;
}

.supplier-invoice-summary-label-cell {
    font-size: 1em;
    font-weight: bold;
    padding: 0 8px;
}

.supplier-invoice-summary-control-cell {
    font-size: 1em;
    padding: 0 3px;
}

.invoice-payment-container {
    border: 1px solid #C0C0C0;
    border-radius: 2px;
    box-shadow: 2px 2px 10px -1px #C0C0C0;
    font-family: "Segoe UI",Arial,Helvetica,sans-serif;
    font-size: 1.2em;
    padding: 4px;
    text-align: center;
    height: 80px;
    margin-top: 12px;
}

.invoice-payment-totals-header {
    font-size: 1.3em;
    font-weight: bold;
    margin-bottom: 8px;
}

.invoice-payment-table {
    margin-top: 8px;
    width: 100%;
}

    .invoice-payment-table th {
        width: 15%;
    }

.metrics-criteria-row {
    height: 30px;
}

.metrics-grid-heading-container {
    font-size: 1.3em;
    height: 56px;
    text-align: center;
}

/** Rad Upload Style **/
.RadUpload .ruButton {
    border-radius: 2px !important;
    font-size: 0.9em !important;
    font-family: 'Lucida Grande',Lucida,Verdana,sans-serif !important;
    color: #FFFFFF !important;
    background: #C41010 !important;
    background: -moz-linear-gradient( top, #C41010 0%, #D11111 25%, #C41010) !important;
    background: -webkit-gradient( linear, left top, left bottom, from(#C41010), color-stop(0.25, #D11111), to(#C41010)) !important;
    box-shadow: 0px 1px 3px rgba(000,000,000,0.5), inset 0px -1px 0px rgba(255,255,255,0.7) !important;
    text-shadow: 0px -1px 1px rgba(000,000,000,0.2), 0px 1px 0px rgba(255,255,255,0.3) !important;
    border: 1px solid #902D2D !important;
}

    .RadUpload .ruButton:hover {
        background: #C41010 !important;
        background: -moz-linear-gradient( top, #C41010 0%, #840B0B 25%, #C41010) !important;
        background: -webkit-gradient( linear, left top, left bottom, from(#C41010), color-stop(0.25, #840B0B), to(#C41010)) !important;
        box-shadow: 0px 0px 0px rgba(000,000,000,0.5), inset 0px -1px 0px rgba(255,255,255,0.7) !important;
        text-shadow: 0px -1px 1px rgba(000,000,000,0.2), 0px 1px 0px rgba(255,255,255,0.3) !important;
        border: 1px solid #8D3F3F !important;
    }

    .RadUpload .ruButton:active {
        position: relative !important;
        top: 2px !important;
    }

.RadUpload .ruRemove {
    padding-left: 0 !important;
    margin: 0 0 6px 8px !important;
}

/** Rad Upload Validation error */
.RadUpload .ruError {
    padding: 0px 0px 6px 20px;
    border: 1px solid #ef0000;
    background: #f9e8e8;
}

    .RadUpload .ruError .ruFileWrap {
        height: auto;
        overflow: visible !important;
        display: block;
        white-space: normal;
    }

    .RadUpload .ruError .ruUploadProgress {
        margin-left: -18px;
        display: block;
    }

    .RadUpload .ruError .ruUploadFailure {
        background-position: 2px 80%;
    }

    .RadUpload .ruError .ruErrorMessage {
        display: block;
        font-variant: small-caps;
        text-transform: lowercase;
    }

.RadAsyncUpload span.ruFileWrap {
    padding-left: 0;
    position: relative;
    top: 4px;
}

.RadUpload_Default .ruRemove {
    position: relative;
    top: 4px;
}

.use-alternative-payment-method-checkbox {
    position: relative;
    top: 3px;
}

.pin-code-textbox {
    width: 35px;
    text-align: center;
}

.create-job-table {
    padding: 12px;
    width: 100%;
}

.create-job-row {
    height: 32px;
}

.reason-comment {
    width: 245px;
}

input[type="text"].invalid {
    background: #F8C8C8;
    border: 1px solid #C41010;
    /*    padding: 2px;*/
}

input[type="text"].invalid-quote {
    background: #F8C8C8;
    border: 2px solid #FFEB3F;
}

textarea.invalid {
    background: #F8C8C8;
    border: 1px solid #C41010;
    padding: 2px;
}

#job-list-date-controls {
    margin-top: 24px;
    margin-bottom: -10px;
    font-weight: bold;
}

.create-job-row .spacer-cell {
    text-align: right;
    padding: 20px;
}

.create-job-invoice-email {
    width: 245px;
}

/*----------------------------------------------------------------------------*/
/*---------------------------- DASHBOARD MENU --------------------------------*/
/*----------------------------------------------------------------------------*/

#dashboard-container {
    height: 600px;
    white-space: normal;
    /*    width: 1200px;*/
}

.refresh-dashboard-container {
    text-align: right;
    padding: 0 16px 4px 0;
}

.dashboard-section {
    border: 2px solid #000000;
    height: 200px;
    width: 378px;
    float: left;
    margin-left: 16.5px;
    margin-bottom: 18px;
    position: relative;
}

    .dashboard-section a {
        position: absolute;
        top: 0;
        left: 0;
        width: 100%;
        height: 100%;
    }

.noticeboard-section {
    /*height: 300px;*/
    height: 100%;
    /*width: 866px;*/
    width: 1176px;
    float: left;
    margin-left: 16px;
    border: 2px solid #000000;
    white-space: normal;
}

    .noticeboard-section .value {
        text-align: left;
        vertical-align: top;
        padding: 8px;
    }

    .dashboard-section table,
    .noticeboard-section table {
        width: 100%;
        height: 100%;
    }

    .dashboard-section .header .heading,
    .noticeboard-section .header .heading {
        font-size: 20px;
        background: #F5F5F5;
        height: 36px;
        text-align: center;
        border-bottom: 1px solid #C0C0C0;
        text-decoration: underline;
        font-weight: bold;
    }

.dashboard-section .item.blue {
    background: #e8f6ff;
}

.dashboard-section .item.red {
    background: #fcdee2;
}

.dashboard-section .item.green {
    background: #d9f7d9;
}

.dashboard-section .item.yellow {
    background: #fcfced;
}

.dashboard-section .item .heading {
    padding-left: 20px;
    font-size: 16px;
    width: 75%;
}

.dashboard-section .item .value {
    font-size: 24px;
    font-weight: bold;
    width: 25%;
}

/*----------------------------------------------------------------------------*/
/*-------------------------- DASHBOARD MENU END ------------------------------*/
/*----------------------------------------------------------------------------*/

/*----------------------------------------------------------------------------*/
/*-------------------------- MARKETING OPT OUT -------------------------------*/
/*----------------------------------------------------------------------------*/

.marketing-opt-out-container {
    height: 200px;
    width: 500px;
    margin-left: auto;
    margin-right: auto;
    margin-top: 150px;
}

    .marketing-opt-out-container span {
        display: block;
        position: relative;
        float: left;
        clear: both;
        text-align: center;
        font-size: 15px;
        margin-bottom: 24px;
    }

    .marketing-opt-out-container input {
        display: block;
        position: relative;
        margin-left: auto;
        margin-right: auto;
    }

/*----------------------------------------------------------------------------*/
/*----------------------- MARKETING OPT OUT  END -----------------------------*/
/*----------------------------------------------------------------------------*/

.similar-jobs-container {
    padding: 0 12px 12px 12px;
    border: solid 1px darkgray;
}

span.similar-jobs-heading {
    display: block;
    font-weight: bold;
    padding-top: 4px;
}

span.similar-job-link {
    padding: 8px;
    display: inline-block;
}

.supplier-responses .back-button {
    display: flex;
    justify-content: flex-end;
}

.form-btn {
    border-radius: var(--main-border-radius);
    font-weight: 700;
    border: none;
    padding: 12px;
    font-size: 1.2em;
    letter-spacing: 0.05em;
    cursor: pointer;
    color: #fff;
    background-color: #4464AD;
    transition: background-color 0.4s;
    transition-timing-function: cubic-bezier(0.165, 0.84, 0.44, 1);
    text-align: center;
    -webkit-touch-callout: none;
    -webkit-user-select: none;
    -khtml-user-select: none;
    -moz-user-select: none;
    -ms-user-select: none;
    user-select: none;
    position: relative;
    border-radius: 0.5rem;
}

    .form-btn:hover {
        background-color: #3b4f8d;
    }

.rgDataDiv {
    height: auto !important;
}


.booking-consignment-textbox-cell.description {
    display: flex;
    flex-direction: row;
    align-items: center;
}

.charCount {
    margin-left: 10px;
}

/*----------------------------------------------------------------------------*/
/*--------------------------- NEW LOGIN SCREEN -------------------------------*/
/*----------------------------------------------------------------------------*/

#body.default-style {
    background-color: var(--primary-background-color);
    background-image: unset !important;
}

#header.default-style {
    background-color: var(--primary-company-color);
    border-radius: 0;
    width: unset !important;
}

#wrap.default-style {
    background-color: var(--primary-background-color);
    background-image: unset !important;
    width: 100% !important;
}

#parent-div.default-style {
    background-color: var(--primary-background-color);
    background-image: unset !important;
    min-height: unset;
}

#content.default-style {
    padding: 0;
    width: unset;
}

#LoginContainerDiv.default-style {
    padding: 0 !important;
}


#footer.default-style {
    background-color: var(--primary-company-color);
    color: var(--darkmode-text-color);
    border-radius: 0;
}

#newLogo.header-logo {
    padding-top: 2px
}

#LoginContainerDiv, .modal-container {
    display: flex;
    box-sizing: border-box;
    flex-direction: column;
    justify-content: center;
    padding: 0;
    top: 100px;
    width: 100%;
    align-items: center;
    height: unset !important;
    left: unset !important;
}

.form-container {
    /*    display: none;*/
    flex-direction: column;
    align-items: center;
    background-color: white;
    padding: 1rem;
    max-width: 360px;
    box-shadow: none;
    margin-bottom: 54px;
    color: var(--lightmode-text-color);
}

@media (min-width: 576px) {
    #LoginContainerDiv, .modal-container { /* remove id when possible */
        margin-top: 100px;
    }

    .form-container {
        padding: 3rem;
        border-radius: 1rem;
        box-shadow: 0 2px 6px 0 rgba(0, 0, 0, .1);
    }

    #body.default-style, #wrap.default-style, #parent-div.default-style {
        background-color: var(--background-body);
    }

    .shadow {
        box-shadow: 0 0 5px 0 rgba(96, 96, 96, 1);
    }
}

.form__group {
    position: relative;
    width: 100%;
    height: 2.75rem;
    margin-bottom: 2rem;
}

.login-textbox.username, .login-textbox.password {
    box-sizing: border-box;
    width: 100%;
    height: 3rem;
    padding-left: 1rem;
    border-radius: .5rem;
    border: 1px solid var(--border-color);
}

.form__group label {
    display: flex;
    justify-content: flex-start;
    margin-bottom: 2px;
}

.login-small-text {
    font-size: 16px;
    margin-bottom: 1rem;
}

.login h1 {
    display: flex;
    width: 100%;
    font-weight: bold;
    justify-content: flex-start;
    margin: 0;
    padding-bottom: 1rem;
    color: var(--primary-company-color);
}

span.message {
    padding-bottom: 1rem;
}

.login-message-container {
    display: flex;
    justify-content: flex-start;
    text-align: unset;
    padding: unset;
    color: var(--primary-company-color);
    padding-top: 1rem;
}

.password-forgot-label {
    display: flex;
    width: 100%;
    margin-bottom: 2px;
    justify-content: space-between;
    align-items: flex-end;
}

    .password-forgot-label a {
        text-decoration: none;
        color: var(--link-color);
    }

.login .forgot-password {
    display: flex;
    justify-content: flex-end;
}

.form__group.password {
    margin-bottom: 0rem;
}

.remember-me-click {
    display: flex;
    width: 100%;
    height: 40px;
    justify-content: flex-start;
}

.remember-text, .remember-check {
    display: flex;
    justify-content: center;
}

.remember-text {
    display: flex;
    justify-content: center;
    padding-top: 13px;
}

.login h2 {
    display: flex;
    justify-content: flex-start;
    color: var(--primary-company-color);
}

.button-new {
    display: flex;
    justify-content: center;
    border-radius: .5rem;
    font-weight: 700;
    border: none;
    padding: 12px;
    font-size: 1.2em;
    letter-spacing: 0.05em;
    cursor: pointer;
    user-select: none;
    position: relative;
    background: unset;
}

    .button-new.primary {
        background-color: var(--primary-button-color);
        color: var(--darkmode-text-color);
    }

    .button-new.secondary {
        background-color: var(--primary-background-color);
        color: var(--primary-button-color);
        border: 1px solid var(--primary-button-border);
    }

.buttton-new.primary:hover {
    background-color: var(--primary-button-hover);
    color: var(--darkmode-text-color);
}

.button-new.secondary:hover {
    background-color: var(--primary-button-color);
    color: var(--darkmode-text-color);
}

.back.secondary, .login-button.primary {
    width: 35%;
}

.button-new-200 {
    width: 200px;
}

.flex-end {
    display: flex;
    justify-content: flex-end;
}

.login-action-container {
    display: flex;
    width: 100%;
    justify-content: space-between;
}

.driver-section {
    width: 100%;
}

.breakline {
    display: flex;
    border-top: 1px solid var(--border-color);
    margin: 2rem 2rem 1.5rem 2rem;
}


.app-logos {
    display: flex;
    flex-direction: column;
    justify-content: space-between;
    margin-top: 1rem;
}

.app-logo {
    padding: 1rem 0rem 0rem;
}

    .app-logo img {
        height: unset;
        width: 150px;
    }

@media (min-width: 396px) {
    .app-logos {
        flex-direction: row;
    }

    .app-logo img {
        height: 50px;
        width: unset;
    }
}

.forgot-password-message {
    display: flex;
    width: 100%;
    justify-content: flex-start;
    padding: 0rem 0rem 1rem 0rem;
}

.modal-container .error-message-container, .modal-container .error-message-heading, .modal-container .error-message {
    text-align: unset;
    margin: 0;
}

.login-link-container {
    display: flex;
    justify-content: flex-end;
    width: 100%;
}

#booking-summary-row {
    height: 100%;
}


.admin-table {
    width: 100%;
    border-collapse: collapse;
    table-layout: fixed; /* Ensures all columns are evenly spaced */
    text-align: center;
}

    .admin-table td {
        padding: 10px;
        vertical-align: top;
        width: 25%; /* Adjust based on 4 or 5 columns */
    }

.admin-button {
    width: 90%; /* Ensures buttons take equal space within their column */
    padding: 10px;
    margin: 0 auto; /* Center buttons horizontally */
    background-color: #2c5caa;
    color: white;
    border: none;
    cursor: pointer;
    font-size: 14px;
    text-align: center;
    box-sizing: border-box;
    margin-bottom: .5rem; /* Prevents width overflow */
}

.button-new:hover {
    background-color: #1d3e7a;
}

.section-title {
    font-weight: bold;
    margin-bottom: 10px;
}

.secondary-menubar {
    display: flex;
}

    .secondary-menubar.center {
        justify-content: center;
    }


/*** Delviery details ***/

/* Date Picker Adjustment */
.delivery-details .datepicker {
    width: 100% !important;
}

/* =============================== */
/* Container & Layout             */
/* =============================== */
.delivery-details #content,
.delivery-details #wrap {
    max-width: 1100px;
    width: unset !important;
    margin: 0 auto;
    padding: 0 16px;
    box-sizing: border-box;
}

#wrap {
    width: unset !important;
}

#content {
    width: unset !important;
}

/* Fix vertical spacing */
.form-section.service-section {
    margin-top: 0; /* Remove auto, was pushing it oddly */
}


/* =============================== */
/* Form Rows & Elements           */
/* =============================== */

label {
    font-weight: 600;
    color: #0f172a;
    font-size: 0.95rem;
}

.booking-sub-table-textbox,
.booking-sub-table-dropdown,
.booking-sub-table-textarea,
.booking-sub-table-textarea-wide {
    width: 100%;
    padding: 0.6rem 0.8rem;
    font-size: 1rem;
    border: 1px solid #cbd5e1;
    border-radius: 0.375rem;
    box-sizing: border-box;
}

/* Textareas */
.booking-sub-table-textarea,
.booking-sub-table-textarea-wide {
    resize: vertical;
    min-height: 4rem;
}

/* =============================== */
/* Grid and Form Fields           */
/* =============================== */

.form-grid {
    display: grid;
    grid-template-columns: 1fr;
    gap: 1rem;
}

@media (min-width: 768px) {
    .form-grid {
        grid-template-columns: repeat(2, 1fr);
        gap: 1rem 2rem;
    }

        .form-grid .row-special-instructions, .form-grid .row-goods-ready {
            grid-column: span 2;
        }
}



/* Optional label hint */
.delivery-details .form-optional {
    font-weight: normal;
    font-size: 0.85rem;
    color: #777;
    margin-left: 6px;
    font-style: italic;
}

/* Helper notes */
.delivery-details .form-note {
    font-size: 0.8rem;
    color: #0b2c44;
    margin-top: 4px;
    line-height: 1.4;
}

/* Inputs, dropdowns, textareas */
.delivery-details .booking-sub-table-textbox,
.delivery-details .booking-sub-table-dropdown,
.delivery-details .booking-sub-table-textarea,
.delivery-details .booking-sub-table-textarea-wide {
    width: 100%;
    height: unset;
    padding: 10px 14px;
    font-size: 0.95rem;
    border-radius: 8px;
    color: #333;
    box-sizing: border-box;
    transition: border-color 0.2s ease;
}

    .delivery-details .booking-sub-table-textbox:focus,
    .delivery-details .booking-sub-table-dropdown:focus,
    .delivery-details .booking-sub-table-textarea:focus,
    .delivery-details .booking-sub-table-textarea-wide:focus {
        border-color: #1976d2;
        background-color: #fff;
        outline: none;
    }

/* Textarea styling */
.delivery-details .booking-sub-table-textarea,
.delivery-details .booking-sub-table-textarea-wide {
    resize: vertical;
    min-height: 100px;
}

/* Datepicker width fix */
.delivery-details .datepicker {
    width: 100% !important;
}


.delivery-details
#lblCollectionPostcode,
.delivery-details
#lblDeliveryPostcode {
    font-weight: 700;
    font-size: 1.1rem;
    margin-top: 8px;
}

    .delivery-details
    #lblCollectionPostcode::before,
    .delivery-details
    #lblDeliveryPostcode::before {
        display: block;
        font-weight: 600;
        font-size: 0.9rem;
        color: #0b2c44;
        margin-bottom: 4px;
    }

/* Hide current date row */
#txtCurrentDate,
#lblCurrentDate {
    display: none !important;
}

/* Align Save/Revert/Amend buttons to left under date */
#btnAmendColDelDate_Collection,
#btnSaveColDelDate_Collection,
#btnRevertColDelDate_Collection {
    margin-top: 4px;
    margin-right: 6px;
}

/* Optional hint text tweaks */
.delivery-details .form-note {
    margin-top: 0;
    font-weight: 600;
    color: #0b2c44;
    font-size: 0.85rem;
}

/* Ensure the full section has no unexpected gaps */
/*.delivery-details #booking-locations-collection-table, .delivery-details #booking-locations-delivery-table, .delivery-details #booking-consignment-container-table, .delivery-details #booking-multidrop-table, .delivery-details #booking-information-row, .delivery-details #divAdminOptions {
    padding: 24px;
    border-radius: 10px;
    box-shadow: 0 2px 6px rgba(0, 0, 0, 0.05);
    background: #fff;
}*/

.booking-sub-table-header {
    font-size: 1.25rem;
    font-weight: 700;
    margin-bottom: 1rem;
    color: #0f172a;
}

/* Optional note */
.form-optional {
    font-weight: normal;
    font-style: italic;
    font-size: 0.875rem;
    color: #555;
}

/* Form notes under fields */
.form-note {
    font-size: 0.75rem;
    color: #334155;
    margin-top: 0.25rem;
}

/* Inputs & dropdowns */
.booking-sub-table-textbox,
.booking-sub-table-dropdown,
.booking-sub-table-textarea,
.booking-sub-table-textarea-wide {
    width: 100%;
    padding: 0.3rem;
    font-size: 10px;
    border-radius: 0.375rem;
    box-sizing: border-box;
    font-family: inherit;
}

/* Textarea sizing */
.booking-sub-table-textarea {
    resize: vertical;
    min-height: 4rem;
}

.booking-sub-table-textarea-wide {
    resize: vertical;
    min-height: 4rem;
}

/* Hide form-row elements as requested */
.form-row[style*="display: none"] {
    display: none !important;
}

/* Optional: responsive alignment for label + inputs */
.booking-sub-table-textbox,
.booking-sub-table-textarea,
.booking-sub-table-textarea-wide,
.booking-sub-table-dropdown {
    width: 100%;
    box-sizing: border-box;
}

/* === COLLECTION SECTION === */






/* Container for each row (header + items) */
.booking-multidrop-addresses-header,
.booking-multidrop-addresses-row {
    display: flex;
    flex-direction: column; /* Default: mobile-first (stacked) */
    gap: 8px;
    margin-bottom: 12px;
}

/* Individual columns */
.booking-multidrop-address,
.booking-multidrop-address-wide {
    width: 100%;
}

/* Tablet & up: switch to horizontal layout */
@media (min-width: 1290px) {
    .booking-multidrop-addresses-header,
    .booking-multidrop-addresses-row {
        flex-direction: row;
        align-items: flex-start;
    }

    .booking-multidrop-address {
        flex: 1;
    }

    .booking-multidrop-address-wide {
        flex: 2;
    }
}




/* ———————————————————————————————————————— */
/* CONSIGNMENT – MOBILE FIRST (stacked)        */
/* ———————————————————————————————————————— */
.delivery-details #booking-consignment-table,
.delivery-details #booking-consignment-table .booking-consignment-header,
.delivery-details #booking-consignment-table .booking-consignment-entry {
    flex-direction: column;
    gap: 0.5rem;
}

    /* label above its input */
    .delivery-details #booking-consignment-table
    .booking-consignment-small-label-cell {
        font-weight: 600;
        font-size: 0.9rem;
        margin-bottom: 0.25rem;
    }

/* full width inputs / buttons */
.delivery-details .booking-consignment-textbox-cell,
.delivery-details .booking-consignment-textbox,
.delivery-details .input-container,
.delivery-details .consignment-button-row {
    width: 100%;
}

/* hide the “7th” placeholder on mobile */
.delivery-details .remove-placeholder {
    display: none;
}

/* keep unit badges in place */
.delivery-details .input-container {
    position: relative;
}

.delivery-details .unit {
    position: absolute;
    right: 0.5rem;
    top: 50%;
    transform: translateY(-50%);
    font-weight: 700;
    color: #d32f2f;
}

/* Base textbox styling */
.booking-consignment-textbox,
.booking-consignment-textbox input,
.booking-consignment-textbox textarea {
    /* copy from your .booking-sub-table-textbox */
    width: 100%;
    padding: 0.75rem; /* match the delivery padding */
    font-size: 1rem; /* same font-size */
    border: 1px solid #e2e8f0; /* same border color */
    border-radius: 0.375rem; /* same radius (6px) */
    box-sizing: border-box;
}

    /* Focus state */
    .booking-consignment-textbox:focus-within,
    .booking-consignment-textbox input:focus,
    .booking-consignment-textbox textarea:focus {
        border-color: #1976d2; /* delivery focus color */
        background-color: #fff;
        outline: none;
    }

/* If you’ve got plain <input> (not wrapped), target those too */
#booking-consignment-table input[type="text"],
#booking-consignment-table textarea {
    padding: 0.75rem;
    height: 64px;
    border-radius: 0.375rem;
    font-size: 1rem;
}

    #booking-consignment-table input[type="text"]:focus,
    #booking-consignment-table textarea:focus {
        border-color: #1976d2;
        background-color: #fff;
        outline: none;
    }

/* Drop-down to match delivery style */
.booking-consignment-goods-value-textbox,
#booking-consignment-table select {
    width: 100%;
    padding: 0.75rem;
    font-size: 1rem;
    border-radius: 0.375rem;
    box-sizing: border-box;
}

    .booking-consignment-goods-value-textbox:focus,
    #booking-consignment-table select:focus {
        border-color: #1976d2;
        background-color: #fff;
        outline: none;
    }

/* Make sure your unit spans sit inside the same relative container */
.booking-consignment-textbox-cell .unit {
    font-weight: 700;
    color: #d32f2f;
}

/* If you have error/highlight states, match those too */
.booking-consignment-textbox.invalid,
.booking-consignment-textbox.invalid input,
.booking-consignment-textbox.invalid textarea {
    border-color: #e74c3c;
}

/* 1) Hide all mobile‐only labels by default */
.mobile-label {
    display: none;
}

/* 2) At mobile sizes, stack and show labels */
@media (max-width: 768px) {

    /* Remove desktop headers */
    .booking-consignment-header {
        display: none !important;
    }

    /* Stack each data row vertically */
    #booking-consignment-table .booking-consignment-entry {
        display: block !important;
    }

    /* Make each cell full‐width */
    .booking-consignment-textbox-cell {
        display: block;
        width: 100% !important;
        margin-bottom: 1rem;
    }

    /* Show the mobile labels above inputs */
    .mobile-label {
        display: block;
        margin-bottom: 0.25rem;
        font-weight: 600;
        color: #333;
    }

    /* Inputs fill their container */
    .booking-consignment-textbox,
    #booking-consignment-table input,
    #booking-consignment-table textarea {
        width: 100% !important;
    }

    /* Full‐width Add / Reset buttons */
    #add-row-button,
    #clear-button {
        width: 100% !important;
        display: block;
        margin: 0.5rem 0;
    }
}

@media (min-width: 769px) {

    /* show the header row again */
    .booking-consignment-header {
        display: grid !important;
        grid-template-columns: 8% 32% 12% 12% 12% 12% auto;
        column-gap: 1rem;
        margin-bottom: 1rem;
    }

    /* each data row becomes a 7-col grid again */
    .booking-consignment-entry {
        display: grid !important;
        grid-template-columns: 8% 32% 12% 12% 12% 12% auto;
        column-gap: 1rem;
        align-items: center;
        margin-bottom: 1rem;
    }

    /* hide the mobile-only labels */
    .mobile-label {
        display: none !important;
    }

    /* inputs and units revert to their normal sizing */
    .booking-consignment-textbox-cell {
        display: block; /* each cell sits in its grid slot */
    }

    /* restore units positioning */
    .input-container {
        position: relative;
    }

    .unit {
        position: absolute;
        right: 0.5rem;
        top: 50%;
        transform: translateY(-50%);
    }

    /* restore remove-row button styling */
    .consignment-button-row {
        width: auto;
        display: inline-block;
    }

    /* restore add/reset buttons to inline style if needed */
    #add-row-button,
    #clear-button {
        width: auto;
        margin: initial;
        display: inline-block;
    }
}

.booking-consignment-entry .booking-consignment-textbox-cell {
    /* ensure pseudo-element is relative to this cell */
    position: relative;
}

    /* insert the data-label above the input on small screens */
    .booking-consignment-entry .booking-consignment-textbox-cell::before {
        content: attr(data-label);
        display: block;
        font-size: 0.875rem;
        font-weight: 600;
        margin-bottom: 0.25rem;
        color: #333;
    }

/* stack everything */
.booking-consignment-entry,
.booking-consignment-header {
    display: block !important;
}

/* make each cell full width on mobile */
.booking-consignment-textbox-cell {
    width: 100%;
    margin-bottom: 1rem;
}

/* inputs full width */
.booking-consignment-textbox,
.booking-consignment-textbox input,
.booking-consignment-textbox textarea {
    width: 100%;
}

/* ─────────────────────────────────────────────────────── */
/* 2) Desktop (≥769px): hide mobile labels & restore grid */
/* ─────────────────────────────────────────────────────── */
@media (min-width: 769px) {

    /* hide the injected mobile labels */
    .booking-consignment-textbox-cell::before {
        display: none;
    }

    /* header row */
    .booking-consignment-header {
        display: grid !important;
        grid-template-columns: 8% 1fr 12% 12% 12% 12% auto;
        column-gap: 1rem;
        margin-bottom: 1.25rem;
        align-items: center;
    }

    /* each data row */
    .booking-consignment-entry {
        display: grid !important;
        grid-template-columns: 8% 1fr 12% 12% 12% 12% auto;
        column-gap: 1rem;
        row-gap: 1rem;
        align-items: center;
        margin-bottom: 1rem;
    }

    /* restore cell-to-slot behavior */
    .booking-consignment-textbox-cell,
    .remove-placeholder {
        display: block;
    }

    /* restore unit positioning */
    .input-container {
        position: relative;
    }

    .unit {
        position: absolute;
        right: 0.5rem;
        top: 50%;
        transform: translateY(-50%);
    }

    /* restore remove-button sizing */
    .consignment-button-row {
        width: auto;
        display: inline-block;
    }
}

.delivery-details.two-column {
    margin-bottom: 10px;
    width: 100%;
}

.checkbox-row {
    display: grid;
    grid-template-columns: 1.25rem 1fr;
    column-gap: .6rem;
    align-items: start;
    margin: .5rem 0 1rem;
}

    .checkbox-row .checkbox-input {
        margin-top: .25rem;
    }

    .checkbox-row .inline-error-message {
        grid-column: 2;
        color: #c62828;
        font-size: .9rem;
        line-height: 1.2;
        margin-top: .25rem;
        position: static;
        display: flex;
    }

.checkbox-input.invalid {
    outline: 2px solid #c62828;
    outline-offset: 2px;
}

.inline-error-message {
    /*    position: absolute;*/
    bottom: -18px;
    left: 0;
    font-size: 12px;
    color: red;
}

/******  BUTTON ROW *******/

/* by default (mobile): stack at 100% */
.button-row {
    display: flex;
    flex-direction: column;
    gap: 0.75rem;
}

    .button-row > * {
        width: 100%;
    }

/* from tablet up: side by side, spaced out, but not too wide */
@media (min-width: 769px) {
    .button-row {
        flex-direction: row;
        justify-content: space-between;
        align-items: center;
    }

        .button-row > * {
            flex: none; /* they no longer grow to fill */
            width: auto;
        }
}
/******  BUTTON ROW *******/


/*---------------------------------------------*/
/*------------------- LAYOUT ------------------*/
/*---------------------------------------------*/

#wrap {
    display: flex;
    flex-direction: column;
    min-height: 100vh;
}

/* Main Header */
.mainHeader {
    background-color: #ec5454;
    color: #fff;
    position: relative;
    display: grid;
    grid-template-areas: "logo navi profile";
    grid-template-columns: 1fr;
    font-size: 0.8rem;
    height: 100px;
    align-items: center;
    box-shadow: 0 0 5px rgba(96, 96, 96, 1);
}

@media (min-width: 900px) {
    .mainHeader {
        grid-template-columns: 1fr;
    }
}

/* Footer */
.mainFooter {
    margin-top: auto;
    background-color: #ec5454;
    color: #fff;
    position: relative;
    display: grid;
    grid-template-areas:
        "copyright logo"
        "links links";
    grid-template-columns: 1fr;
    font-size: 0.8rem;
}

@media (min-width: 900px) {
    .mainFooter {
        grid-template-areas: "copyright links logo";
        grid-template-columns: max-content 1fr max-content;
    }
}

/* Grid area slots */
.mainHeader .logo {
    grid-area: logo;
}

.mainHeader .navi {
    grid-area: navi;
}

.mainHeader .profile {
    grid-area: profile;
    justify-content: flex-end;
}

.mainFooter .copyright {
    grid-area: copyright;
}

.mainFooter .links {
    grid-area: links;
    text-align: left;
}

.mainFooter .logo {
    grid-area: logo;
    text-align: right;
}

.contents {
    display: flex;
    align-items: center;
    padding: 12px 15px;
}

.mainHeader .contents.logo img {
    width: 150px;
}

.mainFooter .contents.logo img {
    width: 70px;
}


/*---------------------------------------------*/
/*------------------ NAV MENU -----------------*/
/*---------------------------------------------*/

/* Reset */
#nav, #nav ul {
    list-style: none;
    margin: 0;
    padding: 0;
}

    #nav li {
        position: relative;
        float: none;
    }

/* Toggle button (mobile only) */
.menu-toggle {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    background: none;
    color: #fff;
    font-size: 24px;
    padding: 6px 10px;
    border: none;
    cursor: pointer;
    width: 100%;
    text-align: center;
    z-index: 1001;
    transition: background-color 0.3s ease;
}

    .menu-toggle:hover {
        background-color: rgba(255, 255, 255, 0.1);
        border-radius: 4px;
    }

.contents.navi {
    width: 72px;
    padding-right: 0rem;
}

.hamburger-icon {
    font-size: 24px;
    line-height: 1;
}

.menu-label {
    font-size: 12px;
    margin-top: 2px;
    font-weight: 500;
}

/* Base nav styles */
#nav {
    position: absolute;
    top: 100%;
    left: 0;
    z-index: 999;
    background: #fff;
    width: 100%;
    display: none;
    flex-direction: column;
    border: 1px solid #ccc;
    box-shadow: 0 4px 8px rgba(0,0,0,0.1);
}

    #nav.show {
        display: flex;
    }

    #nav > li {
        width: 100%;
        border-bottom: 1px solid #900;
    }

        #nav > li > a {
            display: block;
            padding: 10px 15px;
            font-weight: 700;
            text-decoration: none;
            color: #0A2D50;
            text-align: center;
            line-height: 20px; /* +10px top/bottom padding = ~40px total */
        }

    /* Submenu (mobile) */
    #nav li ul {
        display: none;
        flex-direction: column;
        background-color: #fff;
        position: static;
    }

    #nav li:hover > ul {
        display: flex;
    }

    #nav li ul li a {
        display: block;
        padding: 10px 15px;
        color: #0A2D50;
        text-decoration: none;
        line-height: 20px;
    }


        #nav li ul li a:hover {
            background-color: rgba(222, 69, 69, 0.05);
        }

/*---------------------------------------------*/
/*---------------- DESKTOP VIEW ---------------*/
/*---------------------------------------------*/
@media (min-width: 768px) {
    .menu-toggle {
        display: none;
    }

    #nav {
        display: flex !important;
        position: relative;
        flex-direction: row;
        width: unset;
        border: unset;
        justify-content: flex-start;
        background-color: unset;
        box-shadow: unset;
    }

        #nav > li {
            border: none;
            min-width: 140px;
        }

            #nav > li > a {
                padding: 12px 15px;
                height: auto;
                color: #fff;
            }

                #nav > li > a:hover {
                    background-color: rgba(255, 255, 255, 0.1);
                    border-radius: 4px;
                }

    .contents.navi {
        width: unset;
    }

    /* Desktop submenu */
    #nav li ul {
        display: none;
        position: absolute;
        top: 100%;
        left: 0;
        background: #fff;
        border: 1px solid #ddd;
        box-shadow: 0 4px 8px rgba(0,0,0,0.1);
        z-index: 1000;
    }

    #nav li:hover > ul {
        display: block;
    }

    #nav li ul li {
        width: 180px;
    }

        #nav li ul li a {
            display: block;
            padding: 10px;
            color: #0A2D50;
            text-align: left;
        }

            #nav li ul li a:hover {
                background-color: rgba(222, 69, 69, 0.05);
            }

    #right-header-bottom {
        display: flex;
        align-items: center;
        gap: 10px;
    }
}


/*---------------------------------------------*/
/*-------------- LOGOUT BUTTON ----------------*/
/*---------------------------------------------*/

.contents.profile {
    width: 72px;
    padding-left: 0rem;
}

/* Wrapper becomes the clickable area */
.icon-logout-wrapper {
    display: flex;
    flex-direction: column;
    align-items: center;
    text-align: center;
    padding: 6px 10px;
    border: none;
    background: none;
    cursor: pointer;
    color: #fff;
    transition: background-color 0.3s ease;
    text-decoration: none;
}

/* Icon itself */
.icon-button {
    font-family: 'Material Symbols Outlined';
    font-size: 24px;
}

/* Label below icon */
.icon-label {
    font-size: 12px;
    font-weight: 500;
    margin-top: 2px;
}

/* Hover effect */
.icon-logout-wrapper:hover {
    background-color: rgba(255, 255, 255, 0.1);
    border-radius: 4px;
}


/*** Delivery details route time ***/
.route-hint {
    display: block;
    margin: 8px 0 14px;
    font-size: .95rem;
    color: #333;
}

/* container layout */
.login-link-container {
    display: flex;
    align-items: center;
    gap: .75rem;
}

    /* show contact links inline, not cramped */
    .login-link-container #contactLinks {
        display: flex;
        align-items: center;
        gap: .75rem;
    }

        /* pill look and keep each link on one line */
        .login-link-container #contactLinks .contact-link {
            display: inline-flex;
            align-items: center;
            gap: .5rem;
            padding: .35rem .6rem;
            border-radius: .5rem;
            background: #fff;
            border: 1px solid #e5e7eb;
            width: auto; /* ensure not constrained */
            max-width: none; /* override any inherited max-width */
            white-space: nowrap; /* <<< prevents the tall stack you’re seeing */
            flex: 0 0 auto; /* don’t shrink */
        }

            .login-link-container #contactLinks .contact-link .icon {
                width: 18px;
                height: 18px;
                display: inline-block;
                fill: currentColor;
                flex: 0 0 auto;
            }

            .login-link-container #contactLinks .contact-link .label {
                white-space: nowrap;
            }

/* Mobile: stack and hide text (icon-only) */
@media (max-width:724px) {
    .login-link-container #contactLinks {
        align-items: flex-end;
    }

        .login-link-container #contactLinks .contact-link .label {
            display: none;
        }
}




/*** New Controls ***/

:root {
    --gap: 10px;
    --border: #e5e7eb;
    --muted: #6b7280;
    --text: #111827;
    --focus: #2563eb;
    --error: #b91c1c;
    --radius: 10px;
}

.form-field {
    display: grid;
    gap: 6px;
    margin-bottom: var(--gap);
}

.form-label {
    color: var(--text);
    font-weight: 600;
}

.form-field.is-required .form-label::after {
    content: " *";
    color: var(--error);
    font-weight: 700;
}

.form-control {
    box-sizing: border-box;
    width: 100%;
    padding: 10px 12px;
    border: 1px solid var(--border);
    border-radius: var(--radius);
    background: #fff;
    color: var(--text);
    font-size: 0.95rem;
}

    .form-control:focus {
        outline: none;
        border-color: var(--focus);
        box-shadow: 0 0 0 3px;
    }

.form-help {
    color: var(--muted);
    font-size: .9rem;
}

.form-error {
    color: var(--error);
    font-size: .9rem;
    font-weight: 600;
}

.form-field.is-invalid .form-control {
    border-color: var(--error);
    box-shadow: 0 0 0 3px;
}

.form-field.is-invalid .form-error[hidden] {
    display: block;
}

.form-field.is-disabled .form-control,
.form-control:disabled {
    background: #f9fafb;
    color: #9ca3af;
    cursor: not-allowed;
}

@media (min-width: 640px) {
    .form-field.form-field--inline {
        grid-template-columns: 200px 1fr;
        align-items: center;
    }

        .form-field.form-field--inline .form-help,
        .form-field.form-field--inline .form-error {
            grid-column: 2;
        }
}

.review-and-pay h1 {
    color: unset;
    font-size: 2em;
    font-weight: bold;
    padding-bottom: unset;
}

.review-and-pay h2 {
    margin-bottom: 0rem;
}

.review-and-pay #booking-footer-row {
    height: unset;
    text-align: unset;
}

.review-and-pay .receipt.label {
    display: block;
    margin: .5rem 0rem 1.5rem 0rem;
    font-weight: 700;
    font-size: 1.1em;
}

.review-and-pay .form-sections-wrap.addresses {
    display: grid;
    grid-template-columns: 1fr;
    row-gap: 1rem;
    margin-bottom: 1rem;
}

@media(min-width: 800px) {
    .review-and-pay .form-sections-wrap.addresses {
        display: grid;
        grid-template-columns: 1fr 1fr;
    }
}

.review-and-pay .midpoint-addresses {
    margin-bottom: 1rem;
}

.midpoints-grid {
    display: grid;
    grid-template-columns: 120px 1fr;
    column-gap: 12px;
    row-gap: 8px;
    align-items: start;
    font-size: 1.5em;
}

.midpoints-grid__head {
    font-weight: 700;
    color: #374151;
    padding: 4px 0;
    border-bottom: 1px solid #e5e7eb;
}

.midpoints-grid__cell.type {
    font-weight: 600;
    color: #4b5563;
}

.midpoints-grid__cell.addr {
    white-space: pre-line;
}

@media (max-width: 600px) {
    .midpoints-grid {
        grid-template-columns: 1fr;
    }

    .midpoints-grid__head {
        display: none;
    }

    .midpoints-grid__cell.type {
        margin-top: 8px;
    }
}

.review-and-pay h2 {
    color: #EC5454;
}

.review-and-pay .app-icon {
    padding-left: .5rem;
    position: absolute;
    width: 30px;
    height: 30px
}

.review-and-pay .price-summary {
    display: flex;
    justify-content: space-between;
}

.review-and-pay .button-container {
    display: flex;
    flex-direction: column;
}

@media(min-width: 780px) {
    .review-and-pay .price-summary {
        padding-right: 200px;
    }

    .review-and-pay .button-container {
        flex-direction: row;
        justify-content: space-between;
    }
}

.review-and-pay .narrow {
    width: calc(100% - 40px) !important;
}

#txtBillingPostcode {
    position: relative;
}

.is-error {
    background: #dc2626 !important;
    border-color: #dc2626 !important;
    color: #fff !important;
}


/* ===== InlineBanner — flat, single-palette per variant ===== */

.ib-banner {
    position: relative;
    display: block;
    box-sizing: border-box;
    border: 1px solid;
    border-radius: 10px;
    padding: .75rem 1rem;
    margin: .5rem 0;
    line-height: 1.35;
    min-height: 44px;
}

    .ib-banner .ib-head {
        display: flex;
        align-items: center;
        gap: .75rem
    }

    .ib-banner .ib-text {
        flex: 1 1 auto
    }

    .ib-banner .ib-title {
        font-weight: 700
    }

    .ib-banner .ib-link {
        font-weight: 600;
        text-decoration: underline;
        text-underline-offset: 2px
    }

    .ib-banner .ib-close {
        background: none;
        border: 0;
        font-size: 18px;
        margin-left: .5rem;
        cursor: pointer;
        line-height: 1
    }

    .ib-banner .ib-icon {
        flex: 0 0 auto;
        display: inline-flex;
        align-items: center;
        justify-content: center;
        height: 22px;
        width: 22px;
        margin-top: 1px
    }

        .ib-banner .ib-icon svg {
            width: 18px;
            height: 18px;
            display: block
        }

/* Yellow / Warning */
.ib-warning {
    background: #FFF4CC; /* light yellow */
    border-color: #F5C34B; /* yellow border */
    color: #5A3E00; /* readable text */
}

    .ib-warning .ib-icon svg {
        fill: #5A3E00;
    }

/* Green / Success */
.ib-success {
    background: #EAFBF0; /* mint */
    border-color: #22C55E; /* green border */
    color: #0F5132; /* readable text */
}

    .ib-success .ib-icon svg {
        fill: #0F5132;
    }

/* Red / Error */
.ib-error {
    background: #FFE5E7; /* light red */
    border-color: #EF4444; /* red border */
    color: #7F1D1D; /* readable text */
}

    .ib-error .ib-icon svg {
        fill: #7F1D1D;
    }

/* Blue / Info */
.ib-info {
    background: #E7F1FF; /* light blue */
    border-color: #3B82F6; /* blue border */
    color: #0B3A86; /* readable text */
}

    .ib-info .ib-icon svg {
        fill: #0B3A86;
    }




.linklike {
    background: none;
    border: 0;
    padding: 0;
    font: inherit;
    color: var(--link, #06c);
    text-decoration: underline;
    cursor: pointer;
}

    .linklike:hover {
        text-decoration: none;
    }

.btn-spinner {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: .5rem
}

    .btn-spinner .spin {
        width: 18px;
        height: 18px
    }

    .btn-spinner .spin {
        animation: ib-spin 1s linear infinite
    }

@keyframes ib-spin {
    to {
        transform: rotate(360deg)
    }
}

/* While silent, hide error visuals */
body.ce-quiet .inline-error-message {
    display: none !important;
}

body.ce-quiet .invalid[aria-invalid="true"] {
    border-color: inherit !important;
    box-shadow: none !important;
    outline: none !important;
}
