:root {
--bs-gray-100: #f8f9fa;
--bs-gray-200: #e9ecef;
--bs-gray-300: #d7e4f5;
--bs-gray-400: #93a2b8;
--bs-gray-500: #64748b;
--bs-gray-600: #2d3b59;
--bs-gray-700: #192438;
--bs-gray-800: #0f1729;
--bs-gray-900: #080e1a;
--bs-gray-100-rgb: 248, 249, 250;
--bs-gray-200-rgb: 233, 236, 239;
--bs-gray-300-rgb: 215, 228, 245;
--bs-gray-400-rgb: 147, 162, 184;
--bs-gray-500-rgb: 100, 116, 139;
--bs-gray-600-rgb: 45, 59, 89;
--bs-gray-700-rgb: 25, 36, 56;
--bs-gray-800-rgb: 15, 23, 41;
--bs-gray-900-rgb: 8, 14, 26;
--bs-primary: #3b82f6;
--bs-primary-dark: #114dad;
--bs-primary-light: #b6cdf2;
--bs-secondary: #2d3b59;
--bs-success: #20c997;
--bs-info: #0dcaf0;
--bs-warning: #ffc107;
--bs-danger: #dc3545;
--bs-light: #192438;
--bs-lighter: #2d3b59;
--bs-background: #0f1729;
--bs-background-dark: #080e1a;
--bs-title: #d7e4f5;
--bs-content: #93a2b8;
--bs-muted: #64748b;
--bs-dark: #080e1a;
--bs-primary-rgb: 59, 130, 246;
--bs-primary-dark-rgb: 17, 77, 173;
--bs-primary-light-rgb: 182, 205, 242;
--bs-secondary-rgb: 45, 59, 89;
--bs-success-rgb: 32, 201, 151;
--bs-info-rgb: 13, 202, 240;
--bs-warning-rgb: 255, 193, 7;
--bs-danger-rgb: 220, 53, 69;
--bs-light-rgb: 25, 36, 56;
--bs-lighter-rgb: 45, 59, 89;
--bs-background-rgb: 15, 23, 41;
--bs-background-dark-rgb: 8, 14, 26;
--bs-title-rgb: 215, 228, 245;
--bs-content-rgb: 147, 162, 184;
--bs-muted-rgb: 100, 116, 139;
--bs-dark-rgb: 8, 14, 26;
--body-gap: .5rem;
--grid-gutter: 1rem;
--link-font-weight: 400;
--bs-body-bg: rgba(var(--bs-background-dark-rgb),1);
--bs-body-color: rgba(var(--bs-content-rgb),1);
--bs-heading-color: var(--bs-title);
--menubar-height: 5rem;
--menubar-border-width: 0;
--menubar-border-color: rgba(var(--bs-lighter-rgb),.7);
--menubar-wrapper-bg: rgba(var(--bs-background-dark-rgb),.7);
--menubar-fixed-wrapper-bg: rgba(var(--bs-background-dark-rgb),.75);
--menubar-wrapper-border-width: 1px;
--menubar-wrapper-border-color: rgba(var(--bs-title-rgb),.2);
--menubar-wrapper-shrink-padding-x: .875rem;
--menubar-wrapper-shrink-padding-y: .75rem
}
@media(max-width: 991.98px) {
:root {
--menubar-wrapper-padding-x: 1rem;
--menubar-wrapper-padding-y: 1rem
}

}
.text-gradient-heading {
background-image:linear-gradient(var(--angle, 0deg), rgba(var(--bs-primary-light-rgb), var(--opacity, 1)) 0%, rgba(var(--bs-title-rgb), var(--opacity, 1)) 100%);
background-clip:text;
color:rgba(0,0,0,0)
}
.bg-gradient-heading {
background-image:linear-gradient(var(--angle, 0deg), rgba(var(--bs-primary-light-rgb), var(--opacity, 1)) 0%, rgba(var(--bs-title-rgb), var(--opacity, 1)) 100%)
}
.text-gradient-content {
background-image:linear-gradient(var(--angle, 180deg), rgba(var(--bs-gray-300-rgb), var(--opacity, 1)) 0%, rgba(var(--bs-gray-500-rgb), var(--opacity, 1)) 50%);
background-clip:text;
color:rgba(0,0,0,0)
}
.bg-gradient-content {
background-image:linear-gradient(var(--angle, 180deg), rgba(var(--bs-gray-300-rgb), var(--opacity, 1)) 0%, rgba(var(--bs-gray-500-rgb), var(--opacity, 1)) 50%)
}
.text-gradient-a {
background-image:linear-gradient(var(--angle, 90deg), rgba(46, 229, 138, var(--opacity, 1)), rgba(255, 204, 51, var(--opacity, 1)));
background-clip:text;
color:rgba(0,0,0,0)
}
.bg-gradient-a {
background-image:linear-gradient(var(--angle, 90deg), rgba(46, 229, 138, var(--opacity, 1)), rgba(255, 204, 51, var(--opacity, 1)))
}
.text-gradient-b {
background-image:linear-gradient(var(--angle, 90deg), rgba(59, 130, 246, var(--opacity, 1)), rgba(233, 236, 239, var(--opacity, 1)));
background-clip:text;
color:rgba(0,0,0,0)
}
.bg-gradient-b {
background-image:linear-gradient(var(--angle, 90deg), rgba(59, 130, 246, var(--opacity, 1)), rgba(233, 236, 239, var(--opacity, 1)))
}
.text-gradient-c {
background-image:linear-gradient(var(--angle, 90deg), rgba(17, 77, 173, var(--opacity, 1)), rgba(59, 130, 246, var(--opacity, 1)));
background-clip:text;
color:rgba(0,0,0,0)
}
.bg-gradient-c {
background-image:linear-gradient(var(--angle, 90deg), rgba(17, 77, 173, var(--opacity, 1)), rgba(59, 130, 246, var(--opacity, 1)))
}
.btn-primary {
--gradient-bg-angle: 80deg;
--gradient-border-angle: 360deg;
--bs-btn-color: var(--bs-gray-200);
--bs-btn-border-color: transparent;
--bs-btn-background-image: linear-gradient(var(--gradient-bg-angle), var(--bs-background-dark) 0%, var(--bs-lighter) 50%, var(--bs-background-dark) 100%), linear-gradient(var(--gradient-border-angle), rgba(var(--bs-primary-rgb), .65) 0%, rgba(var(--bs-title-rgb), .65) 50%, rgba(var(--bs-primary-rgb), .65) 100%);
--bs-btn-border-radius: .5rem;
--bs-btn-hover-color: var(--bs-gray-200);
--bs-btn-hover-border-color: transparent;
--bs-btn-active-color: var(--bs-gray-200);
--bs-btn-active-border-color: transparent;
--bs-btn-box-shadow: none
}
.btn-hover-primary:hover {
--bs-btn-hover-color: var(--bs-gray-200);
--bs-btn-hover-border-color: transparent;
--bs-btn-hover-background-image: linear-gradient(var(--gradient-bg-angle), var(--bs-background-dark) 0%, var(--bs-lighter) 100%), linear-gradient(var(--gradient-border-angle), rgba(var(--bs-primary-rgb), .65) 0%, rgba(var(--bs-title-rgb), .65) 100%)
}
.btn-glow {
--bs-btn-color: var(--bs-title);
--bs-btn-bg: rgba(var(--bs-primary-rgb),.1);
--bs-btn-border-color: var(--bs-lighter);
--bs-btn-box-shadow: inset 0 -4px 6px rgba(var(--bs-primary-rgb),.1);
--bs-btn-hover-color: var(--bs-title);
--bs-btn-hover-bg: rgba(var(--bs-primary-rgb),.2);
--bs-btn-hover-border-color: var(--bs-lighter);
--bs-btn-hover-box-shadow: inset 0 -4px 6px rgba(var(--bs-primary-rgb),.1);
--bs-btn-active-color: var(--bs-title);
--bs-btn-active-bg: rgba(var(--bs-primary-rgb),.3);
--bs-btn-active-border-color: var(--bs-lighter);
--bs-btn-active-box-shadow: inset 0 -4px 6px rgba(var(--bs-primary-rgb),.1)
}
.btn-hover-glow {
--bs-btn-hover-color: var(--bs-title);
--bs-btn-hover-bg: rgba(var(--bs-primary-rgb),.1);
--bs-btn-hover-border-color: var(--bs-lighter);
--bs-btn-hover-box-shadow: inset 0 -4px 6px rgba(var(--bs-primary-rgb),.1)
}
.btn-outline-lighter {
--bs-btn-color: $muted-color
}
.nk-menu {
--menu-mobile-radius: 0;
--menu-list-gap-xl-x: 0;
--menu-list-padding:0 .5rem;
--menu-link-radius: .5rem;
--menu-list-border-width:0;
--menu-list-border-color: transparent;
--menu-list-radius: calc(var(--menu-link-radius) * 1.25);
--menu-tools-border-width: 1px;
--menu-tools-gap: 0;
--menu-dropdown-link-active-color: var(--bs-primary-light)
}
@media(max-width: 1199.98px) {
.nk-menubar.was-transparent {
--menubar-padding-y: 1rem
}

}
.card-bordered {
--bs-card-bg: rgba(var(--bs-background-rgb),.4);
--bs-card-border-color: rgba(var(--bs-lighter-rgb),.4)
}
.card-bordered-gradiant {
--card-background: linear-gradient(0deg, rgba(var(--bs-background-rgb),.4) 100%);
--card-border: linear-gradient(0deg, rgba(var(--bs-lighter-rgb),.4) 100%)
}
.card-blend-bottom {
--blend-background: linear-gradient(0, rgba(var(--bs-background-dark-rgb),1) 20%, rgba(var(--bs-background-rgb),1) 100%);
--blend-border: linear-gradient(360deg, rgba(var(--bs-background-dark-rgb),1) 20%, rgba(var(--bs-lighter-rgb),1) 100%)
}
.card-blend-bottom.featured {
border-width:2px;
--blend-border: linear-gradient(180deg, rgba(var(--bs-primary-rgb),.8) 20%, transparent 100%)
}
.card-blend-middle {
--blend-background: linear-gradient(0deg, var(--bs-body-bg) 0%, var(--bs-body-bg) 100%);
--blend-border: linear-gradient(0deg, rgba(var(--bs-lighter-rgb),.6) 0%, var(--bs-body-bg) 25%, var(--bs-body-bg) 75%, rgba(var(--bs-lighter-rgb),.6) 100%)
}
.pricing-card-s1 {
--blend-background: linear-gradient(0, #151e31 20%, #151e31 100%);
--blend-border: linear-gradient(360deg, rgba(var(--bs-background-rgb),1) 20%, rgba(var(--bs-lighter-rgb),1) 100%)
}
.pricing-card-s1.featured {
border-width:2px;
--blend-border: linear-gradient(180deg, rgba(var(--bs-primary-rgb),.8) 20%, transparent 100%)
}

/* ============================================
   EMERGENCY FIXES FOR BLACK-ON-BLACK ISSUES
   ============================================ */

/* Fix table colors - prevent black text on dark background */
.table,
.table th,
.table td,
.pricing-table,
.pricing-table th,
.pricing-table td {
  color: var(--bs-content, #8f9bbf) !important;
  --bs-table-color: var(--bs-content, #8f9bbf) !important;
}

/* Fix button colors - prevent black on hover */
.btn,
.btn:hover,
.btn:focus,
.btn:active {
  color: var(--bs-btn-color) !important;
}

.btn:hover,
.btn:focus {
  color: var(--bs-btn-hover-color, var(--bs-title, #d7e4f5)) !important;
}

/* Specific fixes for ghost/outline buttons */
.btn-ghost,
.btn-outline,
.btn.small.ghost {
  color: var(--bs-content, #8f9bbf) !important;
}

.btn-ghost:hover,
.btn-outline:hover,
.btn.small.ghost:hover {
  color: var(--bs-title, #d7e4f5) !important;
  background-color: rgba(var(--bs-primary-rgb), 0.1) !important;
}

/* Deploy page specific fixes */
.deploy-section .btn,
.pricing-table .btn {
  color: var(--bs-content, #8f9bbf) !important;
}

.deploy-section .btn:hover,
.pricing-table .btn:hover {
  color: var(--bs-title, #d7e4f5) !important;
}

/* General text color fixes for dark theme */
.text-dark,
.text-black {
  color: var(--bs-content, #8f9bbf) !important;
}

/* Card and component text colors */
.card-text,
.card-title,
.list-group-item {
  color: var(--bs-content, #8f9bbf) !important;
}