/* ==========================================================================
   v3.5.2 – Blue #1877F2 + white colour palette. COLOURS ONLY: no sizes, shapes,
   fonts or layout are changed here – the design stays as in style/app/mobile.css.
   Palette: blue #1877F2 / hover #166FE5 / dark #0B5CC9 / deep #0A4AA6 / light #4599FF,
   tint #E7F3FF, white #FFFFFF, soft grey #F0F2F5, text #1C1E21 / #65676B, line #E4E6EB.
   To change colours, edit the values below.
   ========================================================================== */
:root{
  --blue:#1877F2; --blue-d:#166FE5; --blue-soft:#E7F3FF; --blue-2:#4599FF;
  --page:#FFFFFF; --bg:#F0F2F5; --card:#FFFFFF; --fg:#1C1E21; --muted:#65676B; --line:#E4E6EB; --hover:#F0F2F5;
  --band1:#1877F2; --band2:#0B5CC9;
}
body{background:#FFFFFF}
.site{box-shadow:0 0 0 1px #E4E6EB,0 24px 70px rgba(24,119,242,.06)}
.btn.white{color:#1877F2}
.btn.white:hover{background:#E7F3FF}
.job:hover{box-shadow:0 10px 26px rgba(24,119,242,.14)}
.fjob:hover{box-shadow:0 16px 34px rgba(24,119,242,.16)}
.ssearch{box-shadow:0 14px 36px rgba(24,119,242,.14)}
.ssearch.big{box-shadow:0 20px 50px rgba(24,119,242,.16)}
.toast{background:#1C1E21}
.ft{background:linear-gradient(180deg,#1877F2,#0A4AA6)}
.soc:hover{color:#1877F2}
.h-lead,.mg-promo,.dr-emp,.walletcard{background:linear-gradient(135deg,#1877F2,#0B5CC9)}
.ddm .mg-promo a.btn{color:#1877F2}
.dash-r .av{background:#E7F3FF}
.ppl b{background:#F0F2F5}
.codebox{background:#0A4AA6}
.auth-mock .wrow,.pc,.bp-toast,.dash,.eb-chip{color:#1C1E21}
.auth-mock .wrow .jc,.pc span,.bp-toast span,.dash-r span,.dash-h small{color:#65676B}
.adm-side{background:#1877F2;color:#fff}
.adm-side a{color:rgba(255,255,255,.9)}

/* ---------- phones (same design, new colours) ---------- */
@media (max-width:820px){
  :root{--sky:#1877F2;--sky2:#4599FF;--soft:#FFFFFF;--ink:#1C1E21}
  body,.site{background:#FFFFFF!important}
  body{background-image:radial-gradient(1200px 500px at 110% -10%,#EEF5FF 0,transparent 60%)!important}
  .appbar{background:rgba(255,255,255,.92)!important}
  .rbar,.auth{background:#FFFFFF}
  .hero5 .ssearch .inp{background:#F0F2F5}
  .msp{color:#65676B;box-shadow:0 14px 30px -16px rgba(24,119,242,.35)}
  .msp input::placeholder{color:#65676B}
  .msp-mic{background:#E7F3FF}
  @keyframes pulse{50%{box-shadow:0 0 0 8px rgba(24,119,242,.18)}}
  .msp-av{background:linear-gradient(135deg,#4599FF,#1877F2)}
  .msp-av.guest{background:#F0F2F5;color:#65676B}
  .m-chips a{background:#fff;border-color:#E4E6EB;color:#1C1E21!important}
  .m-chips a.on{box-shadow:0 8px 18px -8px rgba(24,119,242,.7)}
  .card,.panel,.job,.fjob,.cat3,.kwcard,.seo-article,.faq details{box-shadow:0 10px 28px -18px rgba(24,119,242,.35),0 0 0 1px #EEF0F3!important}
  .jc2 .save{border-color:#E4E6EB}
  .jc-foot{background:linear-gradient(90deg,rgba(255,255,255,0) 35%,#E7F3FF 100%)}
  .bnav{background:linear-gradient(135deg,#4599FF,#1877F2)!important;box-shadow:0 16px 34px -12px rgba(24,119,242,.65)!important}
  .bnav a.on,.bnav .plus{color:#1877F2!important}
  .statbar .ci,.cat3 .ci{background:#E7F3FF!important}
  .statbar .st span,.m-hello{color:#65676B!important}
  .empban2{background:linear-gradient(135deg,#4599FF,#1877F2)!important}
  .m-ver{background:#1877F2}
  .jd-sal,.jd-facts span{color:#65676B}
  .jd-pills span,.glance{background:#F0F2F5}
  .gl+.gl:not(:nth-child(2)){border-left-color:#E4E6EB!important}
  .jd-tabs{background:#F0F2F5}
  .jd-tabs button{color:#3A3B3C}
  .sa-main{background:linear-gradient(90deg,#4599FF,#1877F2)!important;box-shadow:0 16px 32px -12px rgba(24,119,242,.65)!important}
}

/* ---------- admin ---------- */
.admin-body{--a-bg:#F0F2F5;--a-side:#1877F2;--a-side2:#0B5CC9;--a-line:#E4E6EB;--a-ink:#1C1E21;--a-mute:#65676B}
.admin-body .adm-side,.admin-body .adm-side a{color:rgba(255,255,255,.88)}
.admin-body .adm-sec,.admin-body .adm-ver{color:rgba(255,255,255,.7)}
.adm-brand .brand-mark{box-shadow:0 4px 14px rgba(0,0,0,.18)}
.adm-side a.on{background:#FFFFFF!important;color:#1877F2!important;box-shadow:0 6px 16px -6px rgba(0,0,0,.25)!important}
.todo-ic,.akpi-ic.blue,.verpill{background:#E7F3FF}
.admin-body .chips .chip:hover,.dropzone:hover{background:#E7F3FF}
.admin-body .chips .chip:hover,.dropzone:hover{color:#1877F2}
.akpi:hover,.dropzone{border-color:#B9D6FB}
.adm-search:focus-within,.admin-body .field input:focus,.admin-body .field select:focus,.admin-body .field textarea:focus{border-color:#1877F2;box-shadow:0 0 0 3px rgba(24,119,242,.15)}
