/*
 * CN09 Frontend Palette Pro
 * Primary: current blue; Accent: yellow; Neutrals: white/black/soft blue-grey.
 * Exception: telephone CTA only = green. Zalo/Facebook/Messenger = blue.
 * Loaded LAST on frontend to neutralize legacy red/green/purple colors.
 */
:root{
  --cn-blue:#0f6aa8!important;
  --cn-blue-dark:#075d99!important;
  --cn-blue-deep:#083f69!important;
  --cn-blue-soft:#edf6fb!important;
  --cn-yellow:#ffc400!important;
  --cn-yellow-hover:#ffce29!important;
  --cn-yellow-soft:#fff8e8!important;
  --cn-black:#102236!important;
  --cn-black-2:#111827!important;
  --cn-muted:#607185!important;
  --cn-white:#fff!important;
  --cn-line:#dce6ee!important;
  --cn-call:#16a34a!important;
  --cn-call-dark:#15803d!important;

  --tx:var(--cn-blue)!important;
  --tx-strong:var(--cn-blue-dark)!important;
  --tx-dark:var(--cn-blue-deep)!important;
  --ink:var(--cn-black)!important;
  --taxi-theme-accent:var(--cn-blue)!important;
  --taxi-theme-accent-dark:var(--cn-blue-dark)!important;
  --taxi-ui-primary-button-bg:var(--cn-blue)!important;
  --taxi-ui-primary-button-text-color:var(--cn-white)!important;
  --taxi-ui-link-color:var(--cn-blue)!important;
  --taxi-ui-global-icon-color:var(--cn-blue)!important;
  --taxi-ui-global-icon-bg:var(--cn-blue-soft)!important;
  --taxi-ui-category-icon-bg:var(--cn-blue)!important;
  --taxi-ui-category-icon-color:var(--cn-white)!important;
  --taxi-ui-card-hover-border-color:#9fc1d5!important;
  --taxi-ui-badge-bg:var(--cn-blue-soft)!important;
  --w11-primary:var(--cn-blue)!important;
  --w11-primary-dark:var(--cn-blue-dark)!important;
  --header-wow-top-bg:var(--cn-blue)!important;
  --header-wow-top-text:var(--cn-white)!important;
  --header-wow-sticky-bg:var(--cn-blue)!important;
  --header-wow-sticky-text:var(--cn-white)!important;
  --header-wow-sticky-button-bg:var(--cn-yellow)!important;
  --bs-primary:#0f6aa8!important;
  --bs-primary-rgb:15,106,168!important;
  --bs-success:#0f6aa8!important;
  --bs-success-rgb:15,106,168!important;
  --bs-danger:#ffc400!important;
  --bs-danger-rgb:255,196,0!important;
  --bs-info:#0f6aa8!important;
  --bs-info-rgb:15,106,168!important;
  --bs-warning:#ffc400!important;
  --bs-warning-rgb:255,196,0!important;
}

/* Base text/link language: black + blue only. */
body.taxi-service-site,
body.txs-body{color:var(--cn-black)!important}
body.taxi-service-site a:not([class*="call"]):not([href^="tel:"]):hover,
body.txs-body a:not([class*="call"]):not([href^="tel:"]):hover{color:var(--cn-blue)!important}

/* Bootstrap / legacy semantic colors: remove red, green, purple from frontend. */
body.taxi-service-site .text-danger,
body.taxi-service-site .text-success,
body.taxi-service-site .text-info,
body.taxi-service-site .text-purple,
body.txs-body .text-danger,
body.txs-body .text-success,
body.txs-body .text-info,
body.txs-body .text-purple{color:var(--cn-blue)!important}

body.taxi-service-site .bg-danger,
body.taxi-service-site .bg-success,
body.taxi-service-site .bg-info,
body.taxi-service-site .bg-purple,
body.txs-body .bg-danger,
body.txs-body .bg-success,
body.txs-body .bg-info,
body.txs-body .bg-purple{background-color:var(--cn-blue)!important;color:var(--cn-white)!important}
body.taxi-service-site .bg-warning,
body.txs-body .bg-warning{background-color:var(--cn-yellow)!important;color:var(--cn-black)!important}

body.taxi-service-site .border-danger,
body.taxi-service-site .border-success,
body.taxi-service-site .border-info,
body.txs-body .border-danger,
body.txs-body .border-success,
body.txs-body .border-info{border-color:#9fc1d5!important}

body.taxi-service-site .btn-danger,
body.taxi-service-site .btn-success,
body.taxi-service-site .btn-info,
body.txs-body .btn-danger,
body.txs-body .btn-success,
body.txs-body .btn-info{background:var(--cn-blue)!important;border-color:var(--cn-blue)!important;color:var(--cn-white)!important}
body.taxi-service-site .btn-danger:hover,
body.taxi-service-site .btn-success:hover,
body.taxi-service-site .btn-info:hover,
body.txs-body .btn-danger:hover,
body.txs-body .btn-success:hover,
body.txs-body .btn-info:hover{background:var(--cn-blue-dark)!important;border-color:var(--cn-blue-dark)!important;color:var(--cn-white)!important}
body.taxi-service-site .btn-warning,
body.txs-body .btn-warning{background:var(--cn-yellow)!important;border-color:var(--cn-yellow)!important;color:var(--cn-black)!important}

body.taxi-service-site .badge.bg-danger,
body.taxi-service-site .badge.bg-success,
body.taxi-service-site .badge.bg-info,
body.txs-body .badge.bg-danger,
body.txs-body .badge.bg-success,
body.txs-body .badge.bg-info{background:var(--cn-blue)!important;color:var(--cn-white)!important}
body.taxi-service-site .badge.bg-warning,
body.txs-body .badge.bg-warning{background:var(--cn-yellow)!important;color:var(--cn-black)!important}

/* Alerts/statuses still communicate through icon + copy, without red/green. */
body.taxi-service-site .alert-success,
body.taxi-service-site .ua-alert--success,
body.txs-body .alert-success{background:var(--cn-blue-soft)!important;border-color:#bfd9eb!important;color:var(--cn-black)!important}
body.taxi-service-site .alert-danger,
body.taxi-service-site .ua-alert--danger,
body.txs-body .alert-danger{background:var(--cn-yellow-soft)!important;border-color:#eed58a!important;color:var(--cn-black)!important}
body.taxi-service-site .alert-success i,
body.taxi-service-site .alert-danger i,
body.taxi-service-site .ua-alert i,
body.txs-body .alert-success i,
body.txs-body .alert-danger i{color:var(--cn-blue)!important}

/* Forms: focus is blue, validation warning uses yellow/black instead of red. */
body.taxi-service-site input:focus,
body.taxi-service-site select:focus,
body.taxi-service-site textarea:focus,
body.txs-body input:focus,
body.txs-body select:focus,
body.txs-body textarea:focus{border-color:var(--cn-blue)!important;box-shadow:0 0 0 3px rgba(15,106,168,.12)!important}
body.taxi-service-site .is-invalid,
body.txs-body .is-invalid{border-color:#d8b13d!important;box-shadow:none!important}
body.taxi-service-site .invalid-feedback,
body.taxi-service-site .form-error,
body.taxi-service-site [class*="error"],
body.txs-body .invalid-feedback,
body.txs-body .form-error{color:var(--cn-black)!important}

/* Generic icon policy: blue on light/white surfaces. */
body.taxi-service-site .icon:not(.call-icon),
body.taxi-service-site [class*="-icon"]:not(.phone-ring):not(.txs-vf-mobile-call-circle),
body.taxi-service-site .bi:not(.text-white),
body.taxi-service-site .fa:not(.text-white),
body.taxi-service-site .fas:not(.text-white),
body.taxi-service-site .far:not(.text-white),
body.taxi-service-site .fab:not(.text-white),
body.txs-body .icon:not(.call-icon),
body.txs-body [class*="-icon"]:not(.phone-ring):not(.txs-vf-mobile-call-circle),
body.txs-body .bi:not(.text-white),
body.txs-body .fa:not(.text-white),
body.txs-body .fas:not(.text-white),
body.txs-body .far:not(.text-white),
body.txs-body .fab:not(.text-white){color:var(--cn-blue)!important}

/* Icons on blue/dark buttons are always white. */
body.taxi-service-site .btn-primary i,
body.taxi-service-site .btn-primary svg,
body.taxi-service-site .txs-btn-primary i,
body.taxi-service-site .txs-btn-primary svg,
body.taxi-service-site [class*="btn"][style*="background"] i,
body.txs-body .btn-primary i,
body.txs-body .btn-primary svg,
body.txs-body .txs-btn-primary i,
body.txs-body .txs-btn-primary svg{color:var(--cn-white)!important;stroke:currentColor!important}

/* Main buttons / CTA = blue or yellow only. */
body.taxi-service-site .btn-primary,
body.taxi-service-site .txs-btn-primary,
body.taxi-service-site .lgf-btn-primary,
body.taxi-service-site .txsp-primary,
body.taxi-service-site .ua-post-btn,
body.txs-body .btn-primary,
body.txs-body .txs-btn-primary,
body.txs-body .lgf-btn-primary,
body.txs-body .txsp-primary{background:var(--cn-blue)!important;border-color:var(--cn-blue)!important;color:var(--cn-white)!important}
body.taxi-service-site .btn-primary:hover,
body.taxi-service-site .txs-btn-primary:hover,
body.taxi-service-site .lgf-btn-primary:hover,
body.taxi-service-site .txsp-primary:hover,
body.txs-body .btn-primary:hover,
body.txs-body .txs-btn-primary:hover,
body.txs-body .lgf-btn-primary:hover,
body.txs-body .txsp-primary:hover{background:var(--cn-blue-dark)!important;border-color:var(--cn-blue-dark)!important;color:var(--cn-white)!important}

/* Yellow accent buttons remain high-contrast black text. */
body.taxi-service-site .txf-btn-secondary,
body.taxi-service-site .btn-accent,
body.taxi-service-site [class*="yellow"],
body.txs-body .txf-btn-secondary,
body.txs-body .btn-accent,
body.txs-body [class*="yellow"]{background:var(--cn-yellow)!important;border-color:var(--cn-yellow)!important;color:var(--cn-black)!important}

/* TEL CTA exception: green background + white icon/text. Scoped to actual button-like controls. */
body.taxi-service-site a.txs-call[href^="tel:"],
body.taxi-service-site a.txf-btn[href^="tel:"],
body.taxi-service-site a.txsp-call[href^="tel:"],
body.taxi-service-site a.btn[href^="tel:"],
body.taxi-service-site a[class*="btn"][href^="tel:"],
body.taxi-service-site button.btn-phone-popup,
body.txs-body a.txs-call[href^="tel:"],
body.txs-body a.txf-btn[href^="tel:"],
body.txs-body a.txsp-call[href^="tel:"],
body.txs-body a.btn[href^="tel:"],
body.txs-body a[class*="btn"][href^="tel:"],
body.txs-body button.btn-phone-popup{background:var(--cn-call)!important;border-color:var(--cn-call)!important;color:var(--cn-white)!important}
body.taxi-service-site a.txs-call[href^="tel:"]:hover,
body.taxi-service-site a.txf-btn[href^="tel:"]:hover,
body.taxi-service-site a.txsp-call[href^="tel:"]:hover,
body.taxi-service-site a.btn[href^="tel:"]:hover,
body.taxi-service-site a[class*="btn"][href^="tel:"]:hover,
body.txs-body a.txs-call[href^="tel:"]:hover,
body.txs-body a.txf-btn[href^="tel:"]:hover,
body.txs-body a.txsp-call[href^="tel:"]:hover,
body.txs-body a.btn[href^="tel:"]:hover,
body.txs-body a[class*="btn"][href^="tel:"]:hover{background:var(--cn-call-dark)!important;border-color:var(--cn-call-dark)!important;color:var(--cn-white)!important}
body.taxi-service-site a[href^="tel:"][class*="btn"] i,
body.taxi-service-site a[href^="tel:"][class*="btn"] svg,
body.txs-body a[href^="tel:"][class*="btn"] i,
body.txs-body a[href^="tel:"][class*="btn"] svg{color:var(--cn-white)!important;fill:currentColor!important;stroke:currentColor!important}

/* Supporting / money-page remnants that used red/green accents. */
.txsp-kicker,.txsp-owner-label{background:var(--cn-blue-soft)!important;color:var(--cn-blue)!important;border-color:#cfe3f1!important}
.txsp-call{background:var(--cn-call)!important;color:#fff!important}
.txsp-zalo{background:var(--cn-blue)!important;color:#fff!important}
.txsp-owner-card a,.txsp-parent{color:var(--cn-blue)!important}

/* Header / navigation. */
.header-wow-top,.header-wow-sticky,.w11-pro-header{--w11-primary:var(--cn-blue)!important}
.header-wow-top,[class*="header-wow"][class*="top"]{background:var(--cn-blue)!important}
.header-wow-top a,.header-wow-top i,.header-wow-top svg{color:#fff!important}

/* Floating contact: one visual language. Phone green; social/chat blue. */
.txs-floating-contact .icon-wrap,
.taxi-floating-contact .taxi-float-icon{background:var(--cn-blue)!important;border-color:var(--cn-blue)!important;color:#fff!important}
.txs-floating-contact .btn-phone-popup .icon-wrap,
.txs-floating-contact .phone-ring,
.taxi-floating-contact .taxi-float-phone .taxi-float-icon{background:var(--cn-call)!important;border-color:var(--cn-call)!important;color:#fff!important}
.txs-floating-contact .icon-wrap img,
.txs-floating-contact .btn-phone-popup .icon-wrap img,
.taxi-floating-contact .taxi-float-icon img{filter:brightness(0) invert(1)!important}
.taxi-float-facebook .taxi-float-icon,
.taxi-float-messenger .taxi-float-icon,
.taxi-float-zalo .taxi-float-icon,
.taxi-float-youtube .taxi-float-icon,
.taxi-float-tiktok .taxi-float-icon,
.taxi-float-viber .taxi-float-icon,
.taxi-float-telegram .taxi-float-icon,
.taxi-float-whatsapp .taxi-float-icon,
.taxi-float-website .taxi-float-icon,
.taxi-float-backtop .taxi-float-icon{background:var(--cn-blue)!important;color:#fff!important}

/* Mobile contact: social/chat blue, call green. */
@media(max-width:768px){
  .txs-vf-mobile-contact-icon{background:var(--cn-blue)!important;border-color:var(--cn-blue)!important;color:#fff!important}
  .txs-vf-mobile-contact-icon img{filter:brightness(0) invert(1)!important;padding:6px!important}
  .txs-vf-mobile-call-main .txs-vf-mobile-call-circle{background:var(--cn-call)!important;border-color:#fff!important;color:#fff!important}
  .txs-vf-mobile-call-main .txs-vf-mobile-call-circle img{filter:brightness(0) invert(1)!important;padding:9px!important}
  .txs-vf-mobile-contact-person{background:var(--cn-blue)!important;border-color:var(--cn-blue)!important}
  .txs-vf-mobile-sheet-list a{color:var(--cn-blue)!important;border-color:#d7e6f0!important}
  .txs-vf-mobile-sheet-list a img{background:var(--cn-blue)!important;border-radius:50%!important;padding:7px!important;filter:brightness(0) invert(1)!important}
  .txs-vf-mobile-sheet-list a[href^="tel:"] img{background:var(--cn-call)!important}
  .txs-vf-mobile-phone-pop-card>a[href^="tel:"]{background:var(--cn-call)!important;color:#fff!important}
  .txs-vf-mobile-phone-pop-card>a[href^="tel:"] img{filter:brightness(0) invert(1)!important}
}

/* Legacy bottom bars: social/chat blue, phone green. */
.w11-mobile-cta-bar a{background:var(--cn-blue)!important;color:#fff!important}
.w11-mobile-cta-bar a[href^="tel:"],.w11-mobile-cta-bar a.is-phone{background:var(--cn-call)!important;color:#fff!important}

/* Remove brand-specific purple/red/green gradients from share/social widgets. */
.share-floating a,.social-share a,[class*="share-"] a{background:var(--cn-blue)!important;color:#fff!important;border-color:var(--cn-blue)!important}
.share-floating a i,.social-share a i,[class*="share-"] a i{color:#fff!important}

/* Keep footer call green; secondary action yellow. */
.txf-btn-primary[href^="tel:"]{background:var(--cn-call)!important;border-color:var(--cn-call)!important;color:#fff!important}
.txf-btn-primary[href^="tel:"]:hover{background:var(--cn-call-dark)!important;border-color:var(--cn-call-dark)!important;color:#fff!important}
.txf-btn-secondary{background:var(--cn-yellow)!important;border-color:var(--cn-yellow)!important;color:var(--cn-black)!important}
.txf-btn-secondary:hover{background:var(--cn-yellow-hover)!important;color:var(--cn-black)!important}

/* Account: remove red logout/status styling from customer-facing UI. */
.ua-nav a.is-active,.ua-post-btn{background:var(--cn-blue)!important;color:#fff!important}
.ua-nav a.is-active i,.ua-post-btn i{color:#fff!important}
.ua-logout-form button{background:#fff!important;color:var(--cn-blue)!important;border-color:#bfd9eb!important}
.ua-logout-form button i{color:var(--cn-blue)!important}

/* Hard stop for common legacy red/green text classes used by older pages. */
body.taxi-service-site [style*="color:#ef4444"],body.taxi-service-site [style*="color: #ef4444"],
body.taxi-service-site [style*="color:#dc2626"],body.taxi-service-site [style*="color: #dc2626"],
body.taxi-service-site [style*="color:#16a34a"],body.taxi-service-site [style*="color: #16a34a"],
body.txs-body [style*="color:#ef4444"],body.txs-body [style*="color: #ef4444"],
body.txs-body [style*="color:#dc2626"],body.txs-body [style*="color: #dc2626"],
body.txs-body [style*="color:#16a34a"],body.txs-body [style*="color: #16a34a"]{color:var(--cn-blue)!important}

/* Order-detail standalone page gets this stylesheet too. */
body.cn09-order-page .text-danger,body.cn09-order-page .text-success,body.cn09-order-page .text-info{color:var(--cn-blue)!important}
body.cn09-order-page .bg-danger,body.cn09-order-page .bg-success,body.cn09-order-page .bg-info{background-color:var(--cn-blue)!important;color:#fff!important}
body.cn09-order-page .bg-warning{background-color:var(--cn-yellow)!important;color:var(--cn-black)!important}
body.cn09-order-page .btn-success,body.cn09-order-page .btn-danger,body.cn09-order-page .btn-info{background:var(--cn-blue)!important;border-color:var(--cn-blue)!important;color:#fff!important}
body.cn09-order-page .bi.text-success,body.cn09-order-page .bi.text-danger,body.cn09-order-page .bi.text-info{color:var(--cn-blue)!important}

/* CN09 FIX: icons inside blue communication buttons must stay white.
   This intentionally outranks the generic .bi:not(.text-white) palette rule. */
body.taxi-service-site .mmp .mmp-btn--secondary .bi,
body.taxi-service-site .mmp .mmp-btn--secondary i,
body.taxi-service-site .mmp .mmp-btn--secondary i::before,
body.taxi-service-site .mmp .mmp-btn--secondary svg,
body.txs-body .mmp .mmp-btn--secondary .bi,
body.txs-body .mmp .mmp-btn--secondary i,
body.txs-body .mmp .mmp-btn--secondary i::before,
body.txs-body .mmp .mmp-btn--secondary svg {
  color:#fff!important;
  fill:currentColor!important;
  stroke:currentColor!important;
  opacity:1!important;
}

/* Same policy for communication CTAs anywhere on the customer frontend. */
body.taxi-service-site a[href*="zalo.me"] .bi,
body.taxi-service-site a[href*="zalo.me"] i,
body.taxi-service-site a[href*="zalo.me"] i::before,
body.taxi-service-site .is-zalo .bi,
body.taxi-service-site .is-zalo i,
body.taxi-service-site .is-zalo i::before,
body.txs-body a[href*="zalo.me"] .bi,
body.txs-body a[href*="zalo.me"] i,
body.txs-body a[href*="zalo.me"] i::before,
body.txs-body .is-zalo .bi,
body.txs-body .is-zalo i,
body.txs-body .is-zalo i::before {
  color:#fff!important;
  opacity:1!important;
}