/* Profileoo — button system (v1.9.11)
   One consistent set for the whole marketing site: solid primary, bordered secondary,
   calm hover states and a visible keyboard focus. Loaded last so it wins over older rules. */
:root {
  --b-primary: #4338ca;
  --b-primary-hover: #3730a3;
  --b-ink: #0f172a;
  --b-line: #d0d5dd;
  --b-line-hover: #98a2b3;
  --b-ring: rgba(67, 56, 202, .28);
  --b-radius: 10px;
  --b-shadow: 0 1px 2px rgba(16, 24, 40, .06);
}

/* ---------- base ---------- */
.main-btn,
.lp .lp-btn,
.lp .lp-tbtn,
.popup-main-btn {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 8px;
  min-height: 44px;
  padding: 0 20px;
  border: 1px solid transparent;
  border-radius: var(--b-radius);
  font-size: 15px;
  font-weight: 600;
  line-height: 1.2;
  letter-spacing: .1px;
  text-transform: none;
  white-space: nowrap;
  cursor: pointer;
  box-shadow: var(--b-shadow);
  transition: background-color .15s ease, border-color .15s ease, color .15s ease, box-shadow .15s ease;
  -webkit-tap-highlight-color: transparent;
}
.main-btn:active,
.lp .lp-btn:active,
.lp .lp-tbtn:active,
.popup-main-btn:active { transform: translateY(1px); }
.main-btn:focus-visible,
.lp .lp-btn:focus-visible,
.lp .lp-tbtn:focus-visible,
.popup-main-btn:focus-visible,
.newsletter-btn:focus-visible,
.back-to-top:focus-visible { outline: 0; box-shadow: 0 0 0 4px var(--b-ring); }
.main-btn:focus:not(:focus-visible) { outline: 0; }

/* ---------- primary (solid) ---------- */
.main-btn,
.lp .lp-btn-primary,
.popup-main-btn {
  background: var(--b-primary) !important;
  border-color: var(--b-primary);
  color: #fff !important;
}
.main-btn:hover,
.main-btn:focus,
.lp .lp-btn-primary:hover,
.popup-main-btn:hover {
  background: var(--b-primary-hover) !important;
  border-color: var(--b-primary-hover);
  color: #fff !important;
  transform: none;
  box-shadow: var(--b-shadow);
}
.lp .lp-btn i, .main-btn i { font-size: 13px; transition: transform .15s ease; }
.lp .lp-btn:hover i.fa-arrow-right, .main-btn:hover i.fa-arrow-right { transform: translateX(3px); }

/* header login */
.header-navigation .navbar-btn .main-btn { min-height: 42px; padding: 0 18px; font-size: 14.5px; }

/* ---------- on dark backgrounds (hero / final call-to-action) ---------- */
.lp .lp-btn-ghost {
  background: transparent !important;
  border-color: rgba(255, 255, 255, .32);
  color: #fff !important;
  box-shadow: none;
}
.lp .lp-btn-ghost:hover { background: rgba(255, 255, 255, .08) !important; border-color: rgba(255, 255, 255, .5); }
.lp .lp-btn-white {
  background: #fff !important;
  border-color: #fff;
  color: var(--b-primary) !important;
  box-shadow: none;
}
.lp .lp-btn-white:hover { background: #eef0ff !important; border-color: #eef0ff; transform: none; }
.lp .lp-btn { min-height: 48px; padding: 0 22px; }
.lp .lp-play {
  width: 48px; height: 48px;
  background: #fff;
  box-shadow: none;
  border: 1px solid rgba(255, 255, 255, .6);
  transition: background-color .15s ease;
}
.lp .lp-play:hover { background: #eef0ff; }

/* ---------- theme cards: "Live demo" + "Details" ---------- */
.lp .lp-theme-btns { gap: 10px; }
.lp .lp-tbtn {
  flex: 1;
  min-height: 42px;
  padding: 0 12px;
  font-size: 14px;
  background: #fff;
  border-color: var(--b-line);
  color: var(--b-ink) !important;
}
.lp .lp-tbtn:hover { border-color: var(--b-line-hover); background: #f9fafb; }
.lp .lp-tbtn-solid { background: var(--tc) !important; border-color: var(--tc); color: #fff !important; }
.lp .lp-tbtn-solid:hover { background: var(--tc) !important; border-color: var(--tc); filter: brightness(.93); }

/* ---------- pricing: Trial = secondary, Purchase / Signup = primary ---------- */
.saas-pricing .pricing-item .pricing-button {
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
  gap: 10px;
  padding-left: 24px;
  padding-right: 24px;
}
.saas-pricing .pricing-item .pricing-button .main-btn { flex: 1 1 0; min-width: 118px; max-width: 200px; margin: 0; }
.saas-pricing .pricing-item .pricing-button .main-btn:not(:last-child),
.lp .pricing-button .main-btn:not(:last-child) {
  background: #fff !important;
  border-color: var(--b-line);
  color: var(--b-ink) !important;
}
.saas-pricing .pricing-item .pricing-button .main-btn:not(:last-child):hover,
.lp .pricing-button .main-btn:not(:last-child):hover { background: #f9fafb !important; border-color: var(--b-line-hover); }
.lp .pricing-button .main-btn:last-child { background: var(--b-primary) !important; }
.lp .pricing-button .main-btn:last-child:hover { background: var(--b-primary-hover) !important; }

/* ---------- featured profiles: small secondary buttons ---------- */
.saas-featured-users .user-item .user-button ul li .main-btn {
  min-height: 36px;
  padding: 0 14px;
  font-size: 13.5px;
  background: #fff !important;
  border: 1px solid var(--b-line);
  color: var(--b-ink) !important;
}
.saas-featured-users .user-item .user-button ul li .main-btn:hover {
  background: #fff !important;
  border-color: var(--b-primary);
  color: var(--b-primary) !important;
}

/* ---------- blog "read more" ---------- */
.saas-blog .blog-item .entry-content a.read-btn { font-weight: 600; color: var(--b-primary) !important; }
.saas-blog .blog-item .entry-content a.read-btn:hover { color: var(--b-primary-hover) !important; text-decoration: underline; text-underline-offset: 3px; }

/* ---------- footer: newsletter + social ---------- */
.saas-footer .footer-widget .widget.newsletter-widget form .form_gorup .newsletter-btn {
  top: 5px; right: 5px;
  width: 46px; height: 36px;
  border-radius: 999px;
  background: var(--b-primary) !important;
  transition: background-color .15s ease;
}
.saas-footer .footer-widget .widget.newsletter-widget form .form_gorup .newsletter-btn:hover { background: var(--b-primary-hover) !important; }
.saas-footer .footer-widget .widget.newsletter-widget .social-link li { margin-right: 8px; margin-bottom: 8px; }
.saas-footer .footer-widget .widget.newsletter-widget .social-link li a {
  width: 38px; height: 38px;
  border-radius: 10px;
  background: #fff !important;
  border: 1px solid #e4e7ec;
  color: #475467 !important;
  font-size: 13px;
  transition: border-color .15s ease, color .15s ease;
}
.saas-footer .footer-widget .widget.newsletter-widget .social-link li a:hover {
  border-color: var(--b-primary);
  color: var(--b-primary) !important;
}

/* ---------- back to top ---------- */
.back-to-top {
  width: 44px; height: 44px; line-height: 44px;
  border-radius: 12px;
  font-size: 16px;
  background: var(--b-ink);
  box-shadow: 0 4px 12px rgba(16, 24, 40, .15);
}
.back-to-top:hover, .back-to-top:focus { background: var(--b-primary); }

/* ---------- forms (login, signup, contact, checkout) ---------- */
.user-form-section .user-form form .form_group .main-btn,
.faqs-section .faq-sidebar .widget.contact-widget form .main-btn,
.coupon_box .form_group .main-btn { text-transform: none; min-width: 140px; min-height: 46px; }

/* ---------- phones ---------- */
@media (max-width: 575px) {
  .lp .lp-cta .lp-btn { flex: 1 1 auto; }
  .lp .lp-btn { min-height: 46px; padding: 0 18px; font-size: 14.5px; }
  .saas-pricing .pricing-item .pricing-button { padding-left: 16px; padding-right: 16px; }
}
