/*
    PALETTE
*/

:root {
    --obw-yellow:       #F8CA00;
    --obw-orange:       #F47621;
    --obw-blue:         #0D0047;
    --obw-black:        #000000;
    --obw-paleblue:     #D8E2F4;
    --obw-paleyellow:   #FDF4CC;

    --alloc-wdunder:    #4BA392;
    --alloc-wdover:     #33170F;
    --alloc-under:      #5C8FCB;
    --alloc-over:       #E0705D;
    --alloc-freight:    #FCB515;
    --alloc-blocked:    #000000;

    --status-ok:        var(--alloc-wdunder);
    --status-warn:      var(--alloc-freight);
    --status-error:     var(--alloc-over);

    --silk-blue:        var(--obw-blue);
    --silk-paleblue:    var(--obw-paleblue);

    --obw-orange-filter: brightness(0) saturate(100%) invert(66%) sepia(93%) saturate(3702%) hue-rotate(347deg) brightness(99%) contrast(93%) !important;
    --obw-blue-filter: brightness(0) saturate(100%) invert(9%) sepia(33%) saturate(5122%) hue-rotate(243deg) brightness(93%) contrast(124%) !important;
}


/*
    FONT
*/

@font-face {
    font-family: "Montserrat";
    src: url('fonts/Montserrat-Regular.ttf') format('ttf');
    font-weight: normal;
    font-style: normal;
    text-rendering: optimizeLegibility;
    font-display: optional;
}

@font-face {
    font-family: "Montserrat";
    src: url('fonts/Montserrat-Italic.ttf') format('ttf');
    font-weight: normal;
    font-style: italic;
    text-rendering: optimizeLegibility;
    font-display: optional;
}

@font-face {
    font-family: "Montserrat";
    src: url('fonts/Montserrat-Light.ttf') format('ttf');
    font-weight: 100;
    font-style: normal;
    text-rendering: optimizeLegibility;
    font-display: optional;
}

@font-face {
    font-family: "Montserrat";
    src: url('fonts/Montserrat-LightItalic.ttf') format('ttf');
    font-weight: 100;
    font-style: italic;
    text-rendering: optimizeLegibility;
    font-display: optional;
}

@font-face {
    font-family: "Montserrat";
    src: url('fonts/Montserrat-Bold.ttf') format('ttf');
    font-weight: bold;
    font-style: normal;
    text-rendering: optimizeLegibility;
    font-display: optional;
}

@font-face {
    font-family: "Montserrat";
    src: url('fonts/Montserrat-BoldItalic.ttf') format('ttf');
    font-weight: bold;
    font-style: italic;
    text-rendering: optimizeLegibility;
    font-display: optional;
}

* {
    font-family: "Montserrat", sans-serif;
}

::-webkit-input-placeholder {
    font-family: "Montserrat", sans-serif !important;
}

:-moz-placeholder {
    font-family: "Montserrat", sans-serif !important;
}

::-moz-placeholder {
    font-family: "Montserrat", sans-serif !important;
}

:-ms-input-placeholder {
    font-family: "Montserrat", sans-serif !important;
}

/*
    CORE
*/

a:not(.categories__category):not(.landing__option):hover {
    color: var(--obw-orange) !important;
}


/*
    LOG IN PAGES
*/

.login-form {
    background-image: url("/assets/obw/images/outback.jpg");
    background-size: cover;
    background-position-y: bottom;
}

.login-form__welcome__logo {
    background-image: url("/images/silk-logo-unbranded.svg");
}

.login-form__logo {
    background-image: url("/assets/obw/images/logos/logo-black.svg");
}

.login-form__creds .button {
    background-color: var(--obw-yellow) !important;
    border-color: var(--silk-blue) !important;
    color: var(--silk-blue) !important;
}

.login-form__creds .button--dark:not(:disabled):not(.button--disabled) {
    background-color: var(--obw-yellow) !important;
    border-color: var(--silk-blue) !important;
    color: var(--silk-blue) !important;
}

.login-form__contact {
    margin-top: 2em;
}

.login-form-test {
    color: var(--obw-paleblue) !important;
    border-color: var(--obw-paleblue) !important;
}


/*
    LANDING PAGE
*/

.landing__together {
    filter: var(--obw-blue-filter);
}

.landing__option:hover {
    color: var(--obw-blue) !important;
    background-color: var(--obw-yellow) !important;
}

.modal--blue {
    background-color: var(--obw-paleblue) !important;
}

.modal--blue, .modal--blue h1, .landing__option__admin, .modal--blue .bottom-split-options__option {
    color: var(--obw-blue) !important;
    border-color: var(--obw-blue) !important;
}


/*
    HEADER
*/

.shop-nav {
    padding-top: 0;
}

.shop-nav-spacer {
    height: 7em;
}

.shop-nav__logo {
    background-image: url("/assets/obw/images/logos/logo-black.svg");
    background-position-y: center;
    width: 12em;
    height: 4em;
    padding-top: 2em;
}

.shop-nav a:hover, .shop-nav a.active:hover {
    color: var(--obw-orange) !important;
    border-color: var(--obw-orange) !important;
}

.shop-nav a img {
    filter: var(--obw-blue-filter);
}

.shop-nav a:hover img {
    filter: var(--obw-orange-filter);
}

.full-width-banner {
    background-image: none;
    background-color: var(--obw-yellow);
}

.full-width-text {
    color: var(--obw-blue);
}

.full-width-icon img {
    filter: var(--obw-blue-filter);
}


/*
    CONTROL PANEL
*/

.is-widish .controlpanel, .controlpanel__inner {
    background-color: var(--obw-paleyellow) !important;
}

.controlpanel a:hover {
    color: var(--obw-orange) !important;
}

.controlpanel__icon--ok {
  color: var(--status-ok);
}

.controlpanel__icon--warning {
  color: var(--status-warn);
}

.circle-status-wardrobe--ok {
  background-color: var(--status-ok);
}

.circle-status-wardrobe--warn {
  background-color: var(--status-warn);
}

.circle-status-wardrobe--error {
  background-color: var(--status-error);
}

.circle-status--ok {
  color: var(--status-ok);
}

.circle-status--warn {
  color: var(--status-warn);
}

.circle-status--error {
  color: var(--status-error);
}

.allocation-header__part--allocation-freight, .allocation-header__part--catalogue-freight, .allocation-header__part--freight {
  background-color: var(--alloc-freight) !important;
}

.allocation-header__part--wardrobe-under {
  background-color: var(--alloc-wdunder) !important;
}

.allocation-header__part--wardrobe-over {
  background-color: var(--alloc-wdover) !important;
}

.allocation-header__part--pending-value {
  border: 1px solid var(--alloc-blocked) !important;
  background: repeating-linear-gradient(135deg, var(--alloc-blocked), var(--alloc-blocked) 10px, var(--silk-whitegrey) 10.3px, var(--silk-whitegrey) 15px, var(--alloc-blocked) 15.3px) !important;
}

.allocation-header__part--cart-value {
  background-color: var(--alloc-under) !important;
}

.allocation-header__part--allocation-overage-delta {
  background-color: var(--alloc-over) !important;
}

.allocation-header__overlay--overage {
  background-color: var(--alloc-over) !important;
}

.allocation-header__dot {
  border: 1px solid var(--obw-blue) !important;
}

.allocation-header__dot--filled {
  background: var(--alloc-wdunder) !important;
  border-color: var(--alloc-wdunder) !important;
}

.allocation-header__dot--over {
  background: var(--alloc-wdover) !important;
  border-color: var(--alloc-wdover) !important;
}

.allocation-header__dot--freight {
  background: var(--alloc-freight) !important;
  border-color: var(--alloc-freight) !important;
}

.allocation-header__dot--new {
  background: var(--alloc-under) !important;
  border-color: var(--alloc-under) !important;
}

.allocation-header__dot--warning {
  background: var(--alloc-over) !important;
  border-color: var(--alloc-over) !important;
}

.allocation-header__dot--error {
  background: var(--alloc-over) !important;
  border-color: var(--alloc-over) !important;
}

.allocation-header__dot--blocked {
  background: linear-gradient(135deg, var(--silk-whitegrey), var(--silk-whitegrey) 44%, var(--alloc-blocked) 44%, var(--alloc-blocked) 62%, var(--silk-whitegrey) 62%, var(--silk-whitegrey)) !important;
}

.allocation-header__dot--pendingreturn {
  background: linear-gradient(135deg, var(--alloc-blocked), var(--alloc-blocked) 44%, var(--silk-whitegrey) 44%, var(--silk-whitegrey) 62%, var(--alloc-blocked) 62%, var(--alloc-blocked)) !important;
}

/*
    FOOTER
*/

.footer {
    background-color: var(--obw-blue);
}

.footer-banner__outer {
    background-color: var(--obw-orange);
    color: var(--obw-blue);
}

.footer-banner p {
    line-height: 1.7em;
}

.footer-banner p .big {
    font-size: 1.5em;
    vertical-align: text-top;
}

.footer-banner .subscribe, .footer-banner .subscribe:visited {
    color: var(--obw-blue) !important;
    border-color: var(--obw-blue) !important;
}

.footer-banner .subscribe:hover {
    background-color: var(--obw-yellow) !important;
}

.footer-main a:hover {
    color: var(--obw-yellow) !important;
}

.footer-logo .img {
    background-image: url("/assets/obw/images/logos/logo-yellow.svg");
    width: 23em;
    height: 4em;
    padding-top: 2em;
}

.footer-contact {
    margin-right: 8%;
}

.footer-address {
    margin-right: 2%;
}

.footer-spacer.coloured {
    display: none;
}


/*
    SHOP CATALOGUE
*/

.categories h2, .categories img, .categories svg, .categories .edit-category {
    mix-blend-mode: difference;
    filter: brightness(85%);
}

a.catalogue-item:hover {
    color: var(--obw-orange) !important;
}

.catalogue-item .favourite {
    color: var(--obw-orange) !important;
}

.catalogue-item__report .cart-count {
    color: var(--obw-blue) !important;
    background-color: var(--obw-yellow) !important;
}

.catalogue-item__report .cart-count img {
    filter: var(--obw-blue-filter) !important;
}


/*
    SHOP ITEM
*/

.buy-item__colour p a:hover {
    border-color: var(--obw-orange) !important;
}

.buy-item__colour p:hover {
    color: var(--obw-orange) !important;
}

.remove-row, .cart__quantity-adjustor {
    filter: var(--obw-blue-filter) !important;
}

.remove-row:hover, .cart__quantity-adjustor:hover {
    filter: var(--obw-orange-filter);
}

.button:hover:not(:disabled):not(.button--disabled):not(.button--dark) {
    background-color: var(--obw-paleblue);
}

.slideshow-prev, .slideshow-next {
    color: var(--obw-yellow) !important;
}

.slideshow-prev:hover, .slideshow-next:hover {
    color: var(--obw-orange) !important;
}

.slideshow-dot {
    border-color: var(--obw-yellow) !important;
}

.slideshow-dot.active {
    background-color: var(--obw-yellow) !important;
}

.slideshow-dot:hover {
    background-color: var(--obw-orange) !important;
}

.buy-item__updates td {
    background-color: var(--obw-orange) !important;
}


/*
    CHECKED OUT
*/

.checked-out img {
    filter: var(--obw-orange-filter);
}

.checked-out .order-number {
    color: var(--obw-orange) !important;
}
