/*!
 * Theme: Default
 * Package: Kinu
 * Version: 1.5.0
 * Author: Kinu
 * Author URI: Kinu
**/
/** WRITE YOUR OWN STYLE **/

:root {
  --kinu-primary: #22824f;
  --kinu-primary-rgb: 34, 130, 79;
  --kinu-primary-hover: #1d6f43;
  --kinu-primary-hover-rgb: 29, 111, 67;
  --kinu-primary-active: #175736;
  --kinu-primary-active-rgb: 23, 87, 54;
  --kinu-primary-text-emphasis: #154f31;
  --kinu-primary-soft-bg: #e4f3eb;
  --kinu-primary-soft-border: #b7ddc7;
  --kinu-primary-soft-dark-bg: #173525;
  --kinu-primary-soft-dark-border: #2b6a47;
  --kinu-primary-dark-link: #7ecf9f;
  --kinu-primary-dark-link-rgb: 126, 207, 159;
  --kinu-primary-dark-hover: #9adab4;
  --kinu-primary-dark-hover-rgb: 154, 218, 180;
}

:root,
[data-bs-theme=light],
[data-bs-theme=dark] {
  --heading-font: var(--kinu-font-sans);
  --body-font: var(--kinu-font-sans);
  --bs-font-sans-serif: var(--kinu-font-sans);
  --bs-body-font-family: var(--kinu-font-sans);
  --bs-btn-font-family: var(--kinu-font-sans);
}

:root,
[data-bs-theme=light] {
  --bs-primary: var(--kinu-primary);
  --bs-primary-rgb: var(--kinu-primary-rgb);
  --bs-primary-text-emphasis: var(--kinu-primary-text-emphasis);
  --bs-primary-bg-subtle: var(--kinu-primary-soft-bg);
  --bs-primary-border-subtle: var(--kinu-primary-soft-border);
  --bs-link-color: var(--kinu-primary);
  --bs-link-color-rgb: var(--kinu-primary-rgb);
  --bs-link-hover-color: var(--kinu-primary-hover);
  --bs-link-hover-color-rgb: var(--kinu-primary-hover-rgb);
  --bs-focus-ring-color: rgba(var(--kinu-primary-rgb), 0.25);
  --swiper-theme-color: var(--kinu-primary);
}

[data-bs-theme=dark] {
  --bs-primary: var(--kinu-primary);
  --bs-primary-rgb: var(--kinu-primary-rgb);
  --bs-primary-text-emphasis: #93d9b4;
  --bs-primary-bg-subtle: #12261b;
  --bs-primary-border-subtle: #2e6d49;
  --bs-link-color: var(--kinu-primary-dark-link);
  --bs-link-color-rgb: var(--kinu-primary-dark-link-rgb);
  --bs-link-hover-color: var(--kinu-primary-dark-hover);
  --bs-link-hover-color-rgb: var(--kinu-primary-dark-hover-rgb);
  --bs-focus-ring-color: rgba(var(--kinu-primary-rgb), 0.32);
  --swiper-theme-color: var(--kinu-primary-dark-link);
}

body,
button,
input,
optgroup,
select,
textarea {
  font-family: var(--kinu-font-sans);
}

h1, .h1,
h2, .h2,
h3, .h3,
h4, .h4,
h5, .h5,
h6, .h6,
.display-1,
.display-2,
.display-3,
.display-4,
.display-5,
.display-6 {
  font-family: var(--kinu-font-sans);
}

.title,
.lead,
.overline-title,
.sub-text,
.nk-menu-link,
.nk-menu-text,
.btn,
.accordion-button,
.feature-text,
.pricing,
.card {
  font-family: var(--kinu-font-sans);
}

.form-check-input:checked {
  background-color: var(--kinu-primary);
  border-color: var(--kinu-primary);
}

.form-check-input:focus {
  border-color: rgba(var(--kinu-primary-rgb), 0.45);
  box-shadow: 0 0 0 0.25rem rgba(var(--kinu-primary-rgb), 0.2);
}

.form-switch .form-check-input {
  --bs-form-switch-bg: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='-4 -4 8 8'%3e%3ccircle r='3' fill='rgba%2834, 130, 79, 0.65%29'/%3e%3c/svg%3e");
}

.btn-primary {
  --bs-btn-color: #fff;
  --bs-btn-bg: var(--kinu-primary);
  --bs-btn-border-color: var(--kinu-primary);
  --bs-btn-hover-color: #fff;
  --bs-btn-hover-bg: var(--kinu-primary-hover);
  --bs-btn-hover-border-color: var(--kinu-primary-hover);
  --bs-btn-focus-shadow-rgb: var(--kinu-primary-rgb);
  --bs-btn-active-color: #fff;
  --bs-btn-active-bg: var(--kinu-primary-active);
  --bs-btn-active-border-color: var(--kinu-primary-active);
  --bs-btn-disabled-color: #fff;
  --bs-btn-disabled-bg: var(--kinu-primary);
  --bs-btn-disabled-border-color: var(--kinu-primary);
}

.btn-outline-primary {
  --bs-btn-color: var(--kinu-primary);
  --bs-btn-border-color: var(--kinu-primary);
  --bs-btn-hover-color: #fff;
  --bs-btn-hover-bg: var(--kinu-primary);
  --bs-btn-hover-border-color: var(--kinu-primary);
  --bs-btn-focus-shadow-rgb: var(--kinu-primary-rgb);
  --bs-btn-active-color: #fff;
  --bs-btn-active-bg: var(--kinu-primary-active);
  --bs-btn-active-border-color: var(--kinu-primary-active);
  --bs-btn-disabled-color: var(--kinu-primary);
  --bs-btn-disabled-border-color: var(--kinu-primary);
}

.btn-soft.btn-primary {
  --bs-btn-color: var(--kinu-primary);
  --bs-btn-bg: var(--kinu-primary-soft-bg);
  --bs-btn-border-color: transparent;
}

.btn-soft.btn-outline-primary {
  --bs-btn-color: var(--kinu-primary);
  --bs-btn-bg: var(--kinu-primary-soft-bg);
  --bs-btn-border-color: var(--kinu-primary-soft-border);
}

.btn:not(.btn-icon) {
  --bs-btn-font-size: 1rem;
  font-size: 1rem;
}

.btn-lg:not(.btn-icon),
.btn-group-lg > .btn:not(.btn-icon) {
  --bs-btn-font-size: 1.125rem;
  font-size: 1.125rem;
}

.accordion-icon-accent .accordion-button:after {
  color: var(--kinu-primary);
}

.nav-link:after {
  background: var(--kinu-primary);
}

.hover-bg-primary:hover {
  background-color: rgba(var(--kinu-primary-rgb), var(--bs-hover-bg-opacity, 1)) !important;
}

.hover-text-primary:hover {
  color: rgba(var(--kinu-primary-rgb), var(--bs-hover-text-opacity, 1)) !important;
}

.text-bg-primary-soft {
  color: var(--kinu-primary);
  background-color: var(--kinu-primary-soft-bg) !important;
  border-color: transparent;
}

.text-bg-primary-soft-outline {
  color: var(--kinu-primary);
  background-color: var(--kinu-primary-soft-bg) !important;
  border-color: var(--kinu-primary-soft-border);
}

.is-dark .text-bg-primary-soft {
  color: var(--kinu-primary-dark-link);
  background-color: var(--kinu-primary-soft-dark-bg) !important;
  border-color: transparent;
}

.is-dark .text-bg-primary-soft-outline {
  color: var(--kinu-primary-dark-link);
  background-color: var(--kinu-primary-soft-dark-bg) !important;
  border-color: var(--kinu-primary-soft-dark-border);
}

.is-dark .link-primary {
  color: var(--kinu-primary-dark-link) !important;
}

.is-dark .link-primary:hover,
.is-dark .link-primary:focus {
  color: var(--kinu-primary-dark-hover) !important;
}

.pricing-featured {
  background-color: var(--kinu-primary);
}

.bg-gradient-primary {
  background: linear-gradient(
    var(--bs-bg-gradient-angle, 135deg),
    rgba(46, 156, 97, var(--bs-bg-opacity, 1)) 0%,
    rgba(34, 130, 79, var(--bs-bg-opacity, 1)) 55%,
    rgba(21, 92, 56, var(--bs-bg-opacity, 1)) 100%
  );
}

.bg-gradient-a {
  background-image:
    radial-gradient(circle at 50% 0%, rgba(34, 130, 79, 0.2) 0%, rgba(34, 130, 79, 0.08) 26%, rgba(34, 130, 79, 0) 56%),
    linear-gradient(180deg, #f7fcf9 0%, #edf7f1 100%);
  background-size: cover;
  background-position: center;
  background-repeat: no-repeat;
}

.is-dark .bg-gradient-a {
  background-image:
    radial-gradient(circle at 50% 0%, rgba(126, 207, 159, 0.22) 0%, rgba(34, 130, 79, 0.1) 28%, rgba(34, 130, 79, 0) 56%),
    linear-gradient(180deg, #0f1713 0%, #0a100d 100%);
}

.bg-shape-blur-a {
  background-image: radial-gradient(circle, rgba(34, 130, 79, 0.26) 0%, rgba(34, 130, 79, 0.14) 32%, rgba(34, 130, 79, 0) 72%);
}

.marketing-dashboard-link {
  display: inline-flex;
  align-items: center;
  gap: 0.85rem;
  padding: 0.35rem 0.45rem 0.35rem 0.35rem;
  border-radius: 999px;
  background: rgba(255, 255, 255, 0.92);
  color: #0f172a;
  font-weight: 600;
  text-decoration: none;
  box-shadow: 0 16px 36px rgba(15, 23, 42, 0.08);
  transition: transform 0.2s ease, box-shadow 0.2s ease, color 0.2s ease;
}

.marketing-dashboard-link:hover,
.marketing-dashboard-link:focus {
  color: var(--kinu-primary);
  transform: translateY(-1px);
  box-shadow: 0 20px 40px rgba(15, 23, 42, 0.12);
}

.marketing-dashboard-avatar {
  width: 56px;
  height: 56px;
  border-radius: 18px;
  object-fit: cover;
  flex-shrink: 0;
  border: 1px solid rgba(15, 23, 42, 0.08);
}

.marketing-dashboard-label {
  white-space: nowrap;
  font-size: 1rem;
  line-height: 1;
}

[data-bs-theme=dark] .marketing-dashboard-link,
.is-dark .marketing-dashboard-link {
  background: rgba(10, 16, 13, 0.9);
  color: #f8fafc;
  box-shadow: 0 18px 40px rgba(2, 6, 23, 0.28);
}

[data-bs-theme=dark] .marketing-dashboard-link:hover,
[data-bs-theme=dark] .marketing-dashboard-link:focus,
.is-dark .marketing-dashboard-link:hover,
.is-dark .marketing-dashboard-link:focus {
  color: var(--kinu-primary-dark-link);
}

@media (max-width: 991.98px) {
  .marketing-dashboard-link {
    width: 100%;
    justify-content: center;
    padding-inline: 1rem;
  }

  .marketing-dashboard-avatar {
    width: 48px;
    height: 48px;
    border-radius: 16px;
  }
}
