/* =============================================================================
   DocTak — Kimi Button Overrides  (LOAD LAST)
   =============================================================================
   Single source of truth for ALL button styles on the site.
   Variables have been moved to doctak-variables.css.
   ============================================================================= */

/* ── Base .btn — pill shape + smooth transition ── */
.btn {
  border-radius: var(--btn-radius) !important;
  font-weight: 500 !important;
  transition: all 0.25s ease !important;
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  gap: 0.4rem !important;
}

.btn:focus,
.btn:focus-visible {
  outline: none !important;
  box-shadow: 0 0 0 3px rgba(var(--kimi-rgb), 0.25) !important;
}

/* ── .btn-primary — filled sky button, white text ──
     Default : sky bg, white text
     Hover   : darker sky bg, white text, lift               */
.btn-primary,
.btn.btn-primary {
  --bs-btn-color:              #fff;
  --bs-btn-bg:                 var(--kimi);
  --bs-btn-border-color:       var(--kimi);
  --bs-btn-hover-color:        #fff;
  --bs-btn-hover-bg:           var(--kimi-hover);
  --bs-btn-hover-border-color: var(--kimi-hover);
  --bs-btn-active-color:       #fff;
  --bs-btn-active-bg:          var(--kimi-hover);
  --bs-btn-active-border-color:var(--kimi-hover);
  --bs-btn-focus-shadow-rgb:   var(--kimi-rgb);

  color: #fff !important;
  background: var(--kimi) !important;
  background-color: var(--kimi) !important;
  border: 1.5px solid var(--kimi) !important;
  box-shadow: 0 2px 6px -2px rgba(var(--kimi-rgb), 0.3) !important;
}

.btn-primary:hover,
.btn.btn-primary:hover,
.btn-primary:focus-visible,
.btn.btn-primary:focus-visible {
  color: #fff !important;
  background: var(--kimi-hover) !important;
  background-color: var(--kimi-hover) !important;
  border-color: var(--kimi-hover) !important;
  transform: translateY(-2px) !important;
  box-shadow: 0 8px 20px -6px rgba(var(--kimi-rgb), 0.35) !important;
}

.btn-primary:active,
.btn.btn-primary:active {
  color: #fff !important;
  background: var(--kimi-hover) !important;
  background-color: var(--kimi-hover) !important;
  border-color: var(--kimi-hover) !important;
  transform: translateY(0) !important;
  box-shadow: none !important;
}

/* Dark mode primary */
[data-bs-theme="dark"] .btn-primary,
[data-theme="dark"] .btn-primary {
  color: #fff !important;
  background: var(--kimi) !important;
  background-color: var(--kimi) !important;
  border-color: var(--kimi) !important;
}
[data-bs-theme="dark"] .btn-primary:hover,
[data-theme="dark"] .btn-primary:hover {
  color: #fff !important;
  background: var(--kimi-hover) !important;
  background-color: var(--kimi-hover) !important;
  border-color: var(--kimi-hover) !important;
}

/* ── .btn-outline-primary — same idea, thinner border ── */
.btn-outline-primary,
.btn.btn-outline-primary {
  color: var(--kimi) !important;
  background: transparent !important;
  background-color: transparent !important;
  border: 1.5px solid var(--kimi-border) !important;
  box-shadow: none !important;
}

.btn-outline-primary:hover,
.btn.btn-outline-primary:hover {
  color: #fff !important;
  background: var(--kimi) !important;
  background-color: var(--kimi) !important;
  border-color: var(--kimi) !important;
  transform: translateY(-2px) !important;
  box-shadow: 0 8px 20px -6px rgba(var(--kimi-rgb), 0.35) !important;
}

.btn-outline-primary:active,
.btn.btn-outline-primary:active {
  color: #fff !important;
  background: var(--kimi-hover) !important;
  border-color: var(--kimi-hover) !important;
  transform: translateY(0) !important;
}

/* ── .btn-secondary ── */
.btn-secondary,
.btn.btn-secondary {
  color: #475569 !important;
  background: #F1F5F9 !important;
  background-color: #F1F5F9 !important;
  border: 1.5px solid #E2E8F0 !important;
  box-shadow: none !important;
}
.btn-secondary:hover,
.btn.btn-secondary:hover {
  color: #1E293B !important;
  background: #E2E8F0 !important;
  background-color: #E2E8F0 !important;
  border-color: #CBD5E1 !important;
  transform: translateY(-2px) !important;
}

.btn-outline-secondary,
.btn.btn-outline-secondary {
  color: #475569 !important;
  background: transparent !important;
  border: 1.5px solid #CBD5E1 !important;
}
.btn-outline-secondary:hover,
.btn.btn-outline-secondary:hover {
  color: #1E293B !important;
  background: #F1F5F9 !important;
  border-color: #94A3B8 !important;
  transform: translateY(-2px) !important;
}

/* ── .btn-success ── */
.btn-success,
.btn.btn-success {
  color: #059669 !important;
  background: #ECFDF5 !important;
  background-color: #ECFDF5 !important;
  border: 1.5px solid rgba(5, 150, 105, 0.3) !important;
  box-shadow: none !important;
}
.btn-success:hover,
.btn.btn-success:hover {
  color: #fff !important;
  background: #059669 !important;
  background-color: #059669 !important;
  border-color: #059669 !important;
  transform: translateY(-2px) !important;
}

.btn-outline-success,
.btn.btn-outline-success {
  color: #059669 !important;
  background: transparent !important;
  border: 1.5px solid rgba(5, 150, 105, 0.3) !important;
}
.btn-outline-success:hover,
.btn.btn-outline-success:hover {
  color: #fff !important;
  background: #059669 !important;
  border-color: #059669 !important;
  transform: translateY(-2px) !important;
}

/* ── .btn-danger ── */
.btn-danger,
.btn.btn-danger {
  color: #DC2626 !important;
  background: #FEF2F2 !important;
  background-color: #FEF2F2 !important;
  border: 1.5px solid rgba(220, 38, 38, 0.3) !important;
  box-shadow: none !important;
}
.btn-danger:hover,
.btn.btn-danger:hover {
  color: #fff !important;
  background: #DC2626 !important;
  background-color: #DC2626 !important;
  border-color: #DC2626 !important;
  transform: translateY(-2px) !important;
}

.btn-outline-danger,
.btn.btn-outline-danger {
  color: #DC2626 !important;
  background: transparent !important;
  border: 1.5px solid rgba(220, 38, 38, 0.3) !important;
}
.btn-outline-danger:hover,
.btn.btn-outline-danger:hover {
  color: #fff !important;
  background: #DC2626 !important;
  border-color: #DC2626 !important;
  transform: translateY(-2px) !important;
}

/* ── .btn-warning ── */
.btn-warning,
.btn.btn-warning {
  color: #D97706 !important;
  background: #FFFBEB !important;
  background-color: #FFFBEB !important;
  border: 1.5px solid rgba(217, 119, 6, 0.3) !important;
  box-shadow: none !important;
}
.btn-warning:hover,
.btn.btn-warning:hover {
  color: #fff !important;
  background: #D97706 !important;
  background-color: #D97706 !important;
  border-color: #D97706 !important;
  transform: translateY(-2px) !important;
}

.btn-outline-warning,
.btn.btn-outline-warning {
  color: #D97706 !important;
  background: transparent !important;
  border: 1.5px solid rgba(217, 119, 6, 0.3) !important;
}
.btn-outline-warning:hover,
.btn.btn-outline-warning:hover {
  color: #fff !important;
  background: #D97706 !important;
  border-color: #D97706 !important;
  transform: translateY(-2px) !important;
}

/* ── .btn-info ── */
.btn-info,
.btn.btn-info {
  color: #8B5CF6 !important;
  background: #F5F3FF !important;
  background-color: #F5F3FF !important;
  border: 1.5px solid rgba(139, 92, 246, 0.3) !important;
  box-shadow: none !important;
}
.btn-info:hover,
.btn.btn-info:hover {
  color: #fff !important;
  background: #8B5CF6 !important;
  background-color: #8B5CF6 !important;
  border-color: #8B5CF6 !important;
  transform: translateY(-2px) !important;
}

/* ── .btn-dark ── */
.btn-dark,
.btn.btn-dark {
  color: #fff !important;
  background: #0F172A !important;
  background-color: #0F172A !important;
  border: 1.5px solid #0F172A !important;
  box-shadow: none !important;
}
.btn-dark:hover,
.btn.btn-dark:hover {
  background: #1E293B !important;
  background-color: #1E293B !important;
  border-color: #1E293B !important;
  transform: translateY(-2px) !important;
}

/* ── .btn-light ── */
.btn-light,
.btn.btn-light {
  color: #475569 !important;
  background: #fff !important;
  background-color: #fff !important;
  border: 1.5px solid #E2E8F0 !important;
  box-shadow: none !important;
}
.btn-light:hover,
.btn.btn-light:hover {
  background: #F8FAFC !important;
  background-color: #F8FAFC !important;
  border-color: #CBD5E1 !important;
  transform: translateY(-2px) !important;
}

/* ── .btn-hover-primary (from explore pages — now available everywhere) ── */
.btn-hover-primary {
  color: var(--kimi) !important;
  background: #fff !important;
  background-color: #fff !important;
  border: 1.5px solid var(--kimi-border) !important;
  border-radius: var(--btn-radius) !important;
  display: inline-flex !important;
  align-items: center !important;
  gap: 0.4rem !important;
  font-weight: 500 !important;
  transition: all 0.25s ease !important;
  text-decoration: none !important;
}
.btn-hover-primary:hover,
.btn-hover-primary:focus-visible {
  color: #fff !important;
  background: var(--kimi) !important;
  background-color: var(--kimi) !important;
  border-color: var(--kimi) !important;
  transform: translateY(-2px) !important;
  box-shadow: 0 8px 20px -6px rgba(var(--kimi-rgb), 0.35) !important;
}

/* ── Sizes ── */
.btn-sm {
  padding: 0.375rem 1rem !important;
  font-size: 0.8125rem !important;
}
.btn-lg {
  padding: 0.75rem 2rem !important;
  font-size: 1rem !important;
}

/* ── Disabled state ── */
.btn:disabled,
.btn.disabled {
  opacity: 0.55 !important;
  pointer-events: none !important;
  transform: none !important;
  box-shadow: none !important;
}

/* ── Focus ring for input fields ── */
.form-control:focus {
  border-color: var(--kimi) !important;
  box-shadow: 0 0 0 3px rgba(var(--kimi-rgb), 0.15) !important;
}

/* ── Link color ── */
a { color: var(--kimi); }
a:hover { color: var(--kimi-hover); }