/* ---------- «اطلب أداة»: لون واضح وجذاب ---------- */
:root { --tr-c1: #ea580c; --tr-c2: #db2777; }

/* الزر العائم (الحاسوب) — ملوّن، والنص ظاهر دائماً */
.tr-float-b {
  gap: 8px;
  height: 48px;
  padding: 0 18px 0 16px;
  border: 0;
  background: linear-gradient(135deg, var(--tr-c1), var(--tr-c2));
  color: #fff;
  font-weight: 700;
  box-shadow: 0 8px 24px rgba(219, 39, 119, .38);
  animation: trIn .25s ease-out, trGlow 2.6s ease-in-out 1s infinite;
}
.tr-float-b span { max-width: 200px; }
.tr-float-b svg { color: #fff; }
.tr-float-b:hover, .tr-float-b:focus-visible {
  color: #fff;
  border-color: transparent;
  filter: brightness(1.08);
  transform: translateY(-2px);
  box-shadow: 0 12px 28px rgba(219, 39, 119, .48);
}
.tr-float-x { opacity: 1; background: var(--surface); }
@keyframes trGlow {
  0%, 100% { box-shadow: 0 8px 24px rgba(219, 39, 119, .38), 0 0 0 0 rgba(234, 88, 12, .45); }
  50% { box-shadow: 0 8px 24px rgba(219, 39, 119, .38), 0 0 0 9px rgba(234, 88, 12, 0); }
}
@media (prefers-reduced-motion: reduce) { .tr-float-b { animation: none; } }

/* بطاقة «لم تجد الأداة؟» في الصفحة الرئيسية */
.tr-cta {
  border: 1px solid color-mix(in srgb, var(--tr-c1) 35%, var(--border));
  background: linear-gradient(135deg, color-mix(in srgb, var(--tr-c1) 9%, var(--surface)), color-mix(in srgb, var(--tr-c2) 9%, var(--surface)));
}
.tr-cta-ic, .tr-head-ic {
  background: linear-gradient(135deg, var(--tr-c1), var(--tr-c2));
  color: #fff;
  box-shadow: 0 6px 16px rgba(219, 39, 119, .30);
}
.tr-cta .btn-primary, .tr-cta .btn {
  background: linear-gradient(135deg, var(--tr-c1), var(--tr-c2));
  color: #fff;
  border-color: transparent;
  box-shadow: 0 6px 18px rgba(219, 39, 119, .30);
}
.tr-cta .btn:hover { filter: brightness(1.08); }
