/* TakeOvr: interaction.
 * One idea throughout: hovering lights something up. Nothing slides, lifts or
 * jumps, so the layout never shifts under the cursor. Discreet, but visible.
 * Switched off for reduced-motion users at the bottom.
 */

/* nav links */
.tko-nav a,
.tko-nav .elementor-widget-heading a {
  border-radius: 8px;
  transition: background-color .18s ease, color .18s ease;
}

/* buttons: brighten and pick up a soft ring */
.elementor-button, .tko-btn, .tko-cta {
  transition: filter .18s ease, box-shadow .18s ease,
              background-color .18s ease, border-color .18s ease, color .18s ease;
}
.elementor-button:hover, .tko-btn:hover, .tko-cta:hover {
  filter: brightness(1.12);
  box-shadow: 0 0 0 3px rgba(142,210,255,.22);
}
.elementor-button:active, .tko-btn:active, .tko-cta:active {
  filter: brightness(.96);
  box-shadow: 0 0 0 2px rgba(142,210,255,.30);
}

/* outline buttons fill faintly instead, since brightening does nothing */
.tko-btn[style*="FFFFFF00"]:hover {
  background-color: rgba(62,142,255,.12) !important;
  border-color: #3E8EFF !important;
  filter: none;
}

/* keyboard users get a clear ring */
.elementor-button:focus-visible, .tko-btn:focus-visible, .tko-cta:focus-visible,
.tko-nav a:focus-visible, .tko-dd-btn:focus-visible, .tko-mine-btn:focus-visible {
  outline: 2px solid #8ED2FF;
  outline-offset: 3px;
}

/* cards */
.tko-listing-card, .tko-board a[href*="tko="] {
  transition: background-color .18s ease, border-color .18s ease, box-shadow .18s ease;
}
.tko-listing-card:hover, .tko-board a[href*="tko="]:hover {
  border-color: #3E8EFF;
  box-shadow: inset 0 0 0 1px rgba(62,142,255,.35);
}

/* inputs */
.tko-board input, .tko-board select, .tko-board textarea, .takeovr-auth input {
  transition: border-color .18s ease, box-shadow .18s ease;
}
.tko-board input:focus, .tko-board select:focus,
.tko-board textarea:focus, .takeovr-auth input:focus {
  border-color: #3E8EFF !important;
  box-shadow: 0 0 0 3px rgba(62,142,255,.18);
  outline: none;
}

/* menus, tabs, FAQ */
.tko-dd-item, .tko-tab, .tko-mine-btn, .tko-dd-btn {
  transition: background-color .16s ease, color .16s ease, border-color .16s ease;
}
.tko-dd-item:hover { background-color: rgba(62,142,255,.16); }
.tko-mine-btn:hover, .tko-dd-btn:hover {
  background-color: rgba(62,142,255,.12);
  border-color: #3E8EFF;
}
.tko-faq summary { transition: color .18s ease, background-color .18s ease; }
.tko-faq summary:hover {
  color: #3E8EFF;
  background-color: rgba(62,142,255,.07);
}
.tko-faq details { transition: border-color .2s ease; }
.tko-faq details[open] { border-color: #3E8EFF; }

/* links */
.tko-legal a, .tko-faq a { transition: color .16s ease; }
.tko-legal a:hover, .tko-faq a:hover { color: #8ED2FF; }

/* chat */
.tko-msg { animation: tko-msg-in .2s ease both; }
@keyframes tko-msg-in { from { opacity: 0; } to { opacity: 1; } }

/* reduced motion */
@media (prefers-reduced-motion: reduce) {
  *, *::before, *::after {
    animation-duration: .001ms !important;
    animation-iteration-count: 1 !important;
    transition-duration: .001ms !important;
    scroll-behavior: auto !important;
  }
}