/*
 * KaziCollect 4.3.19 — Brand-safe Hover System
 * Keeps interactive states inside their semantic colour family and prevents
 * WordPress/theme/Elementor global hover colours (notably pink/magenta) from
 * leaking into KaziCollect controls.
 */

:root{
  --kc-hover-green:#0a3f31;
  --kc-hover-green-mid:#0f6b50;
  --kc-hover-green-soft:#e7f5ef;
  --kc-hover-green-softer:#f2faf6;
  --kc-hover-green-border:#b9ddcf;
  --kc-hover-orange:#d86f08;
  --kc-hover-orange-soft:#fff2e3;
  --kc-hover-red:#a92f24;
  --kc-hover-red-soft:#fcedeb;
  --kc-hover-neutral:#eef6f2;
}

/* KaziCollect links use the brand colour instead of theme accent colours. */
:is(.kc-dashboard-restore,[class^="kc-"],[class*=" kc-"]) a:not(.kc-rv2-call):not([class*="danger"]):not([class*="logout"]){
  text-decoration-color:currentColor;
}

@media (hover:hover) and (pointer:fine){
  /* ---------------------------------------------------------------
     NEUTRAL / WHITE CONTROLS
     Tabs, rows, icon controls and secondary buttons move into a soft
     green state rather than inheriting Elementor/WordPress pink.
     --------------------------------------------------------------- */
  .kc-dashboard-restore :is(
    .kc-subtab:not(.active),
    .kc-ui-tab:not(.active),
    .kc357-tab2:not(.active),
    .kc357-menurow,
    .kc-back-btn,
    .kc-header-avatar-wrap,
    .kc-theme-toggle,
    .kc-utility-action,
    .kc-more-row,
    .kc-wp-tab:not(.active),
    .kc-rw-location-btn,
    .kc-av-decline-btn,
    .kc-av-decline-cancel,
    .kc-msg2-select-btn,
    .kc-ni-markread-btn,
    .kc-help-faq-q,
    [class*="ghost"],
    [class*="secondary"]
  ):hover,
  :is([class^="kc-"],[class*=" kc-"]) :is(
    button[class*="tab"]:not(.active),
    button[class*="menu"],
    button[class*="row"],
    button[class*="ghost"],
    button[class*="secondary"]
  ):hover{
    background:var(--kc-hover-green-soft)!important;
    background-color:var(--kc-hover-green-soft)!important;
    color:#075540!important;
    border-color:var(--kc-hover-green-border)!important;
  }

  /* Header/utility icons are circular/square controls: keep the icon colour
     dark green while the surface becomes mint. */
  .kc-dashboard-restore .header-actions i:hover,
  .kc-dashboard-restore .kc-utility-bar :is(button,a):hover,
  .kc-dashboard-restore [class*="utility"] :is(button,a):hover{
    background:var(--kc-hover-green-soft)!important;
    color:#075540!important;
    border-color:var(--kc-hover-green-border)!important;
  }

  /* Sidebar/menu navigation. */
  .kc-dashboard-restore .nav-menu .nav-item:not(.active):not(.logout):hover,
  .kc-dashboard-restore .nav-menu a.nav-item:not(.active):not(.logout):hover{
    background:rgba(111,224,174,.14)!important;
    color:#fff!important;
  }
  .kc-dashboard-restore .nav-menu .nav-item:not(.active):not(.logout):hover i{
    color:#8ce8bd!important;
  }

  /* Active tabs remain green on hover, never switch to a foreign accent. */
  .kc-dashboard-restore :is(
    .kc-subtab.active,
    .kc-ui-tab.active,
    .kc357-tab2.active,
    .kc-wp-tab.active,
    .kc-appnav-item.active
  ):hover{
    background:#0b5f49!important;
    color:#fff!important;
    border-color:#0b5f49!important;
  }
  /* Some active tabs intentionally use a pale-green selected state. */
  .kc-dashboard-restore .kc357-tab2.active:hover{
    background:#e1f4eb!important;
    color:#076148!important;
    border-bottom-color:#08714d!important;
  }

  /* ---------------------------------------------------------------
     PRIMARY / SUCCESS ACTIONS — darker green on hover.
     --------------------------------------------------------------- */
  :is(.kc-dashboard-restore,[class^="kc-"],[class*=" kc-"]) :is(
    button[class*="save"],
    button[class*="submit"],
    button[class*="confirm"],
    button[class*="accept"],
    button[class*="verify"],
    a[class*="save"],
    a[class*="submit"],
    a[class*="confirm"],
    a[class*="accept"],
    a[class*="verify"],
    .kc-btn,
    .kc-cx-save,
    .kc-wp-submit:not(.danger-ish),
    .kc-av-accept-btn,
    .kc-ni-accept-btn,
    .kc-msg2-new-btn,
    .kc-msg2-compose-submit,
    .kc-rc-btn-next,
    .kc-rc-done-primary,
    .kc357-save,
    .kc357-editlink,
    .kc357-statuspill.kc357-verify-link
  ):hover{
    background:var(--kc-hover-green)!important;
    background-color:var(--kc-hover-green)!important;
    color:#fff!important;
    border-color:var(--kc-hover-green)!important;
  }

  /* Light-green action/chip surfaces become a slightly deeper mint. */
  :is(.kc-dashboard-restore,[class^="kc-"],[class*=" kc-"]) :is(
    [class*="quick"],
    [class*="completion-action"],
    [class*="chip"],
    [class*="pill"]
  ):hover{
    border-color:var(--kc-hover-green-border)!important;
  }
  .kc-dashboard-restore .kc357-completion-action.todo:hover,
  .kc-dashboard-restore .kc357-menurow:hover,
  .kc-dashboard-restore .kc357-editlink:hover{
    background:var(--kc-hover-green-soft)!important;
    color:#076148!important;
  }

  /* ---------------------------------------------------------------
     ORANGE / WARNING / LIVE-ROUTE ACTIONS — darker orange on hover.
     These overrides intentionally come after the generic primary rule.
     --------------------------------------------------------------- */
  :is(.kc-dashboard-restore,[class^="kc-"],[class*=" kc-"]) :is(
    .kc-rv2-primary,
    .kc-rv2-call,
    .kc-rv2-safety,
    [class*="orange"],
    [class*="warning"],
    [class*="cash"]
  ):hover{
    background:var(--kc-hover-orange)!important;
    background-color:var(--kc-hover-orange)!important;
    color:#fff!important;
    border-color:var(--kc-hover-orange)!important;
  }

  /* ---------------------------------------------------------------
     DANGER / DESTRUCTIVE ACTIONS — darker red, never pink.
     --------------------------------------------------------------- */
  :is(.kc-dashboard-restore,[class^="kc-"],[class*=" kc-"]) :is(
    button[class*="danger"],
    button[class*="delete"],
    button[class*="remove"],
    button[class*="reject"],
    button[class*="decline-confirm"],
    a[class*="danger"],
    a[class*="delete"],
    a[class*="remove"],
    a[class*="logout"],
    .kc-ni-clearall-btn,
    .kc-ni-delete-btn,
    .kc-msg2-thread-delete-btn,
    .kc-msg2-bubble-delete,
    .kc-wp-submit.danger-ish,
    .kc-av-decline-confirm
  ):hover{
    background:var(--kc-hover-red)!important;
    background-color:var(--kc-hover-red)!important;
    color:#fff!important;
    border-color:var(--kc-hover-red)!important;
  }

  /* Text-only destructive icons should retain a light red surface rather
     than turning into an oversized solid button. */
  .kc-dashboard-restore :is(.kc-ni-delete-btn,.kc-msg2-thread-delete-btn,.kc-msg2-bubble-delete):hover{
    background:var(--kc-hover-red-soft)!important;
    color:var(--kc-hover-red)!important;
    border-color:transparent!important;
  }

  /* Cards/list rows receive a subtle green border/surface cue. */
  .kc-dashboard-restore :is(
    .kc-av-card,
    .kc-msg2-thread-item,
    .kc-ni-item.clickable,
    .kc-wp-quick-card,
    .kc357-row[data-edit-field]
  ):hover{
    border-color:#c3dfd4!important;
    background-color:#f8fcfa!important;
  }

  /* Plain KaziCollect text links — only colour changes, no button fill. */
  :is([class^="kc-"],[class*=" kc-"]) a:not([class*="btn"]):not([class*="button"]):not(.nav-item):not(.kc-rv2-call):hover{
    color:#075540!important;
  }
}

/* Keyboard focus uses the same brand language. */
:is(.kc-dashboard-restore,[class^="kc-"],[class*=" kc-"]) :is(button,a,[role="button"]):focus-visible{
  outline:3px solid rgba(31,139,110,.22)!important;
  outline-offset:2px!important;
}

/* v4.3.48 dashboard colour cleanup
   Some mobile/tablet browsers were inheriting the theme's default pink /
   magenta tap highlight on dashboard cards, buttons and links. Force every
   app surface back to KaziCollect role colours so hover / tap states feel
   native to the product. */
.kc-dashboard-restore a,
.kc-dashboard-restore button,
.kc-dashboard-restore [role="button"],
.kc-dashboard-restore .nav-item,
.kc-dashboard-restore .kc-rg-card,
.kc-dashboard-restore .kc-rg-mini-card,
.kc-dashboard-restore .stat-card,
.kc-dashboard-restore .kc-qa-item,
.kc-dashboard-restore .kc-card,
.kc-dashboard-restore .kc-request-card,
.kc-dashboard-restore .kc-rv2-stop,
.kc-dashboard-restore .kc-rg-more-item,
.kc-dashboard-restore .kc-rg-mnav,
.kc-dashboard-restore .kc-rg-more-group-head,
.kc-dashboard-restore .kc-rg-linkbtn,
.kc-dashboard-restore .kc-rg-work-icon,
.kc-dashboard-restore .kc-rg-mobile-head button,
.kc-dashboard-restore .kc-rg-mobile-switch {
  -webkit-tap-highlight-color: rgba(7, 92, 75, 0.12);
}

.kc-dashboard-restore .kc-rg-linkbtn:hover,
.kc-dashboard-restore .kc-rg-linkbtn:focus,
.kc-dashboard-restore .kc-rg-more-item:hover,
.kc-dashboard-restore .kc-rg-more-item:focus,
.kc-dashboard-restore .kc-rg-mnav:hover,
.kc-dashboard-restore .kc-rg-mnav.active,
.kc-dashboard-restore .kc-rg-work-icon:hover,
.kc-dashboard-restore .kc-rg-work-icon:focus,
.kc-dashboard-restore .kc-rg-mobile-head button:hover,
.kc-dashboard-restore .kc-rg-mobile-switch:hover,
.kc-dashboard-restore .kc-rg-card:hover,
.kc-dashboard-restore .kc-rg-mini-card:hover,
.kc-dashboard-restore .kc-rg-drill-card:hover,
.kc-dashboard-restore .stat-card:hover,
.kc-dashboard-restore .kc-qa-item:hover,
.kc-dashboard-restore .kc-request-card:hover {
  background-color: rgba(7, 92, 75, 0.06) !important;
  border-color: rgba(7, 92, 75, 0.22) !important;
  color: inherit !important;
}

.kc-dashboard-restore .nav-item.active,
.kc-dashboard-restore .kc-rg-mnav.active {
  background-image: linear-gradient(180deg, rgba(7, 92, 75, 0.10), rgba(7, 92, 75, 0.06)) !important;
}

.kc-dashboard-restore .kc-col-sidebar .nav-item.active,
.kc-dashboard-restore .kc-gen-sidebar .nav-item.active,
.kc-dashboard-restore .kc-rg-sidebar .nav-item.active {
  background-image: linear-gradient(90deg, #079b6b, #07865f) !important;
  color: #fff !important;
}


/* ========================================================================
   KaziCollect 4.3.56 — GLOBAL NO-PINK BRAND LOCK
   WordPress themes and Elementor kits can inject their own accent colour into
   :hover, :focus, :active and .active states. On some installations that
   accent is pink/magenta. These rules make KaziCollect's front-end UI own its
   interaction colours, without changing semantic warning orange or danger red.
   ======================================================================== */
:root{
  --kc-brand-primary:#0B3D2E!important;
  --kc-brand-secondary:#17513E!important;
  --kc-brand-mint:#dceee6!important;
  --kc-brand-mint-strong:#bfdfd2!important;
  --kc-accent-orange:#F28C18!important;
  --kc-accent-orange-dark:#C96300!important;
  --kc-accent-orange-soft:#FFF7ED!important;
  --e-global-color-primary:#0B3D2E!important;
  --e-global-color-secondary:#17513E!important;
  --e-global-color-accent:#17513E!important;
  --wp--preset--color--vivid-purple:#17513E!important;
}

html,body{
  accent-color:#17513E;
}
::selection{background:#17513E;color:#fff}
::-moz-selection{background:#17513E;color:#fff}

/* Remove browser/theme pink tap flashes from the whole public experience. */
body :is(a,button,[role="button"],input,select,textarea,label){
  -webkit-tap-highlight-color:rgba(23,81,62,.14);
}
body :is(input[type="checkbox"],input[type="radio"],progress){
  accent-color:#17513E!important;
}

/* Public WordPress / Elementor CTA states. Base colours are left alone; only
   the foreign hover/focus accent is replaced with KaziCollect green. */
body :is(
  .elementor-button,
  .wp-element-button,
  .wp-block-button__link,
  .wp-block-search__button,
  .wp-block-file__button,
  input[type="submit"],
  input[type="button"]
):not([class*="danger"]):not([class*="delete"]):not([class*="logout"]):hover,
body :is(
  .elementor-button,
  .wp-element-button,
  .wp-block-button__link,
  .wp-block-search__button,
  .wp-block-file__button,
  input[type="submit"],
  input[type="button"]
):not([class*="danger"]):not([class*="delete"]):not([class*="logout"]):focus-visible{
  background-color:#17513E!important;
  border-color:#17513E!important;
  color:#fff!important;
  box-shadow:none!important;
}

/* KaziCollect mobile bottom navigation: theme .active/:focus rules must never
   paint the whole tab pink. Selected state is a clean mint icon treatment. */
.kc-appnav .kc-appnav-item,
.kc-appnav .kc-bn-item{
  background-color:transparent!important;
  background-image:none!important;
  border-color:transparent!important;
  box-shadow:none!important;
}
.kc-appnav .kc-appnav-item:hover,
.kc-appnav .kc-appnav-item:focus,
.kc-appnav .kc-appnav-item:active,
.kc-appnav .kc-bn-item:hover,
.kc-appnav .kc-bn-item:focus,
.kc-appnav .kc-bn-item:active{
  background-color:rgba(23,81,62,.055)!important;
  background-image:none!important;
  color:#0B3D2E!important;
}
.kc-appnav .kc-appnav-item.active,
.kc-appnav .kc-bn-item.active,
.kc-appnav .kc-appnav-item[aria-current="page"]{
  background:transparent!important;
  background-color:transparent!important;
  background-image:none!important;
  border-color:transparent!important;
  color:#0B3D2E!important;
  box-shadow:none!important;
}
.kc-appnav .kc-appnav-item.active i,
.kc-appnav .kc-bn-item.active i,
.kc-appnav .kc-appnav-item[aria-current="page"] i{
  background:linear-gradient(160deg,#dceee6,#bfdfd2)!important;
  background-color:#dceee6!important;
  color:#0B3D2E!important;
  border-color:transparent!important;
  box-shadow:none!important;
}

/* Regulator bottom navigation follows the exact same selected-state language. */
.kc-rg-mobile-nav .kc-rg-mnav,
.kc-dashboard-restore .kc-rg-mnav{
  background-image:none!important;
  box-shadow:none!important;
}
.kc-rg-mobile-nav .kc-rg-mnav:hover,
.kc-rg-mobile-nav .kc-rg-mnav:focus,
.kc-rg-mobile-nav .kc-rg-mnav:active,
.kc-rg-mobile-nav .kc-rg-mnav.active,
.kc-dashboard-restore .kc-rg-mnav.active{
  background:#edf6f2!important;
  background-color:#edf6f2!important;
  background-image:none!important;
  color:#0B3D2E!important;
  border-color:#c6ddd3!important;
  box-shadow:inset 0 -2px 0 #17513E!important;
}
.kc-rg-mobile-nav .kc-rg-mnav.active i,
.kc-dashboard-restore .kc-rg-mnav.active i{
  color:#0B3D2E!important;
}

/* Wallet, profile, modal and dashboard tabs. This is intentionally more
   specific than typical Elementor kit selectors and therefore blocks a pink
   .active state even when the surrounding page was built with Elementor. */
.kc-dashboard-restore :is(
  .kc-wp-tab.active,
  .kc-ui-tab.active,
  .kc-subtab.active,
  .kc357-tab2.active,
  button[aria-selected="true"],
  [role="tab"][aria-selected="true"]
){
  background:#edf6f2!important;
  background-color:#edf6f2!important;
  background-image:none!important;
  color:#0B3D2E!important;
  border-color:#c6ddd3!important;
  box-shadow:none!important;
}
.kc-dashboard-restore .kc-wp-tab.active:after{
  background:#17513E!important;
}

/* Navigation focus ring uses the brand instead of a theme-supplied pink ring. */
:is(.kc-dashboard-restore,.kc-appnav,.kc-more-overlay,[class^="kc-"],[class*=" kc-"])
:is(a,button,input,select,textarea,[role="button"],[role="tab"]):focus-visible{
  outline:3px solid rgba(23,81,62,.24)!important;
  outline-offset:2px!important;
  box-shadow:0 0 0 3px rgba(23,81,62,.10)!important;
}


/* ========================================================================
   KaziCollect 4.4.03 — FAST TAP + FINAL NO-PINK INTERACTION GUARD
   Keep dashboard interactions immediate on touch devices and make sure a
   WordPress/Elementor theme cannot re-introduce magenta/pink hover states.
   Orange is reserved for intentional KaziCollect attention/action controls.
   ======================================================================== */
.kc-dashboard-restore :is(a,button,[role="button"],[role="tab"],.nav-item),
.kc-appnav :is(a,button,[role="button"]),
.kc-more-overlay :is(a,button,[role="button"]){
  touch-action:manipulation;
  -ms-touch-action:manipulation;
}

.kc-dashboard-restore :is(
  .kc-home-link,
  .kc-rwtab-btn,
  .kc-ni-view-link,
  .kc-rh-action,
  .kc-more-row,
  .kc-profile-action,
  .kc-inline-action
):not([class*="danger"]):not([class*="delete"]):not([class*="logout"]):hover,
.kc-dashboard-restore :is(
  .kc-home-link,
  .kc-rwtab-btn,
  .kc-ni-view-link,
  .kc-rh-action,
  .kc-more-row,
  .kc-profile-action,
  .kc-inline-action
):not([class*="danger"]):not([class*="delete"]):not([class*="logout"]):focus-visible{
  background-color:#EEF8F3!important;
  border-color:#B9D8CA!important;
  color:#0B5A40!important;
  background-image:none!important;
  box-shadow:none!important;
}

/* Messaging is an intentional orange secondary action, never pink. */
.kc-dashboard-restore .kc-trip-msg:hover,
.kc-dashboard-restore .kc-trip-msg:focus-visible{
  background:#FFF4E8!important;
  border-color:#F28C18!important;
  color:#C96300!important;
  box-shadow:none!important;
}

/* Keep all generic dashboard buttons green unless the component explicitly
   declares a semantic orange/danger state of its own. */
.kc-dashboard-restore button:not(
  .kc-danger
):not(.kc-delete-btn):not(.kc-ni-delete-btn):not(.kc-logout):not(
  .kc-rhome-alert-btn
):not(.kc-dhome-alert-btn):not(.kc-home-report):not(.kc-trip-msg):hover{
  --e-global-color-accent:#17513E;
}

/* Inputs must never inherit a theme's pink focus treatment. */
.kc-dashboard-restore :is(input,textarea,select):focus{
  border-color:#0B6A49!important;
  outline-color:#0B6A49!important;
  box-shadow:0 0 0 3px rgba(11,106,73,.10)!important;
}
