/* ==========================================================
   P912 OFFICIAL MCI BRAND SYSTEM FINAL

   Official MCI palette:
   Blue       #0095DA
   Orange     #FF4F00
   Deep Blue  #295CAB

   Blue = dominant brand color
   Orange = controlled premium accent
   ========================================================== */

:root{
    --p-brand-blue:#0095da;
    --p-brand-blue-strong:#295cab;
    --p-brand-blue-soft:rgba(0,149,218,.10);

    --p-brand-orange:#ff4f00;
    --p-brand-orange-strong:#e84600;
    --p-brand-orange-soft:rgba(255,79,0,.10);

    --color-primary:#0095da;
    --color-primary-hover:#0087c7;
    --color-primary-active:#295cab;
    --color-primary-soft:rgba(0,149,218,.10);

    --color-heading:#295cab;
}


/* ----------------------------------------------------------
   Global premium interactions
   ---------------------------------------------------------- */

::selection{
    background:#0095da;
    color:#fff;
}

a,
button,
input,
select,
textarea{
    -webkit-tap-highlight-color:
        transparent;
}

:focus-visible{
    outline:
        3px solid rgba(0,149,218,.20);

    outline-offset:2px;
}


/* ----------------------------------------------------------
   Headings
   ---------------------------------------------------------- */

h1,
h2,
h3,
h4{
    color:#295cab;
}


/* ----------------------------------------------------------
   HEADER
   ---------------------------------------------------------- */

.p912-header a:hover,
.p912-header button:hover{
    color:#0095da;
}

.p912-header__slogan,
.p912-brand-slogan,
.p912-header-slogan{
    color:#ff4f00!important;
}


/* ----------------------------------------------------------
   MOBILE DRAWER
   ---------------------------------------------------------- */

.p912-drawer a:hover,
.p912-drawer button:hover{
    color:#0095da;
}


/* ----------------------------------------------------------
   RANDOM ROND HERO
   ---------------------------------------------------------- */

.p912-rond-hero__eyebrow{
    color:#0095da!important;
}

.p912-rond-hero__eyebrow i{
    color:#ff4f00!important;
}

.p912-rond-hero__top h1{
    color:#295cab!important;
}

.p912-rond-hero__top h1 strong{
    color:#ff4f00!important;
}

.p912-rond-hero__live span{
    background:#ff4f00!important;

    box-shadow:
        0 0 0 5px
        rgba(255,79,0,.10)!important;
}

.p912-rond-hero__number{
    color:#295cab!important;
}

.p912-rond-hero__source span{
    color:#0095da!important;
}

.p912-rond-hero__pattern
span:first-child{
    color:#0095da!important;

    border-color:
        rgba(0,149,218,.18)!important;

    background:
        rgba(0,149,218,.055)!important;
}

.p912-rond-hero__pattern
span:first-child i{
    color:#ff4f00!important;
}

.p912-rond-hero__price>strong{
    color:#295cab!important;
}

.p912-rond-hero__estimate span{
    color:#0095da!important;
}

.p912-rond-hero__actions a:not(.is-secondary){
    background:
        linear-gradient(
            135deg,
            #0095da,
            #295cab
        )!important;

    box-shadow:
        0 12px 28px
        rgba(0,149,218,.18)!important;
}

.p912-rond-hero__actions
a:not(.is-secondary):hover{
    background:
        linear-gradient(
            135deg,
            #ff4f00,
            #e84600
        )!important;
}

.p912-rond-hero__dots
button.is-active{
    background:#ff4f00!important;
}

.p912-rond-hero__progress{
    background:
        linear-gradient(
            90deg,
            #0095da 0%,
            #295cab 55%,
            #ff4f00 100%
        )!important;
}


/* ----------------------------------------------------------
   MARKET EXPLORER / SECOND SECTION
   ---------------------------------------------------------- */

.p912-market-explorer h2,
.p912-market-explorer h3{
    color:#295cab!important;
}

.p912-market-explorer
button.is-active,
.p912-market-explorer
[aria-selected="true"]{
    border-color:#0095da!important;
    color:#0095da!important;
}

.p912-market-explorer
button.is-active::after,
.p912-market-explorer
[aria-selected="true"]::after{
    background:#ff4f00!important;
}


/* ----------------------------------------------------------
   GLOBAL SEARCH + COMPARE DOCK
   ---------------------------------------------------------- */

.p912-global-dock__search{
    background:
        linear-gradient(
            135deg,
            #0095da,
            #295cab
        )!important;

    color:#fff!important;
}

.p912-global-dock__compare{
    border-color:
        rgba(255,79,0,.25)!important;

    background:
        linear-gradient(
            135deg,
            #ff4f00,
            #e84600
        )!important;

    color:#fff!important;
}

.p912-global-dock__search:hover{
    box-shadow:
        0 10px 25px
        rgba(0,149,218,.18)!important;
}

.p912-global-dock__compare:hover{
    box-shadow:
        0 10px 25px
        rgba(255,79,0,.18)!important;
}


/* ----------------------------------------------------------
   ACCOUNT TYPE / AUTH
   ---------------------------------------------------------- */

.p912-account-type__options
input:checked+span{
    border-color:
        rgba(0,149,218,.42)!important;
}

.p912-account-type__options
input:checked+span::after{
    background:#ff4f00!important;
}

.p912-auth__submit{
    background:
        linear-gradient(
            135deg,
            #0095da,
            #295cab
        )!important;
}

.p912-auth__submit:hover{
    background:
        linear-gradient(
            135deg,
            #295cab,
            #0095da
        )!important;
}

.p912-auth__field a,
.p912-auth__account-switch a{
    color:#0095da;
}


/* ----------------------------------------------------------
   ACCOUNT
   ---------------------------------------------------------- */

.p912-account a:hover{
    color:#0095da;
}


/* ----------------------------------------------------------
   CODE CATEGORIES
   ---------------------------------------------------------- */

.p912-code-categories
a:hover,
.p912-code-categories
button:hover{
    border-color:
        rgba(0,149,218,.30)!important;
}

.p912-code-categories
.is-active{
    border-color:#0095da!important;
}

.p912-code-categories
.is-active::after{
    background:#ff4f00!important;
}


/* ----------------------------------------------------------
   Cards / useful accents
   ---------------------------------------------------------- */

.p912-latest-listings
a:hover,
.p912-cheapest-by-code
a:hover{
    border-color:
        rgba(0,149,218,.24)!important;
}


/* ----------------------------------------------------------
   Footer
   ---------------------------------------------------------- */

.p912-footer a:hover{
    color:#ff4f00!important;
}


/* ----------------------------------------------------------
   Form controls
   ---------------------------------------------------------- */

input:focus,
select:focus,
textarea:focus{
    border-color:#0095da!important;

    box-shadow:
        0 0 0 3px
        rgba(0,149,218,.08);
}


/* ----------------------------------------------------------
   Premium orange micro-accent
   ---------------------------------------------------------- */

.p912-auth__eyebrow,
.p912-rond-hero__eyebrow,
.p912-account-type__heading strong{
    position:relative;
}

.p912-account-type__heading strong::after{
    content:"";

    display:inline-block;

    width:5px;
    height:5px;

    margin-right:6px;

    border-radius:50%;

    background:#ff4f00;

    vertical-align:middle;
}
