/*
 * Theme Variables - Auto-generated from company JSON
 * Do not edit this file directly - it will be overwritten by the build script
 */

:root {
  /* Primary Colors - Teal from logo */
  --color-primary: #4ECDC4;
  --color-primary-dark: #3DBDB4;
  --color-primary-light: #7EDCD6;
  --color-primary-rgb: 78, 205, 196;
  
  /* Secondary Colors */
  --color-secondary: #3D5A73;
  --color-accent: #4ECDC4;
  
  /* Text Colors */
  --color-text: #475569;
  --color-text-muted: #b5b9bf;
  --color-heading: #1F3044;
  
  /* Background Colors */
  --color-bg: #ffffff;
  --color-bg-light: #F8FAFC;
  --color-bg-dark: #1F3044;
  
  /* Gradient - Navy based */
  --gradient-primary: linear-gradient(135deg, #1F3044 0%, #2D4A5C 100%);
  
  /* Fonts */
  --font-primary: 'Open Sans', sans-serif;
  --font-heading: 'Dosis', 'Open Sans', sans-serif;
  
  /* Shadows */
  --shadow-sm: 0 2px 4px rgba(0, 0, 0, 0.05);
  --shadow-md: 0 4px 15px rgba(0, 0, 0, 0.1);
  --shadow-lg: 0 10px 40px rgba(0, 0, 0, 0.15);
  
  /* Border Radius */
  --radius-sm: 4px;
  --radius-md: 8px;
  --radius-lg: 16px;
  --radius-full: 9999px;
  
  /* Transitions */
  --transition-fast: 0.15s ease;
  --transition-normal: 0.3s ease;
  --transition-slow: 0.5s ease;
  
  /* Spacing */
  --section-padding: 100px;
  --container-width: 1200px;
}

/* Override Bootstrap and Theme Colors */
.text-primary { color: var(--color-primary) !important; }
.bg-primary { background-color: var(--color-primary) !important; }
.btn-primary { 
  background-color: var(--color-primary) !important; 
  border-color: var(--color-primary) !important;
  color: #1F3044 !important;
}
.btn-primary:hover,
.btn-primary:focus { 
  background-color: var(--color-primary-dark) !important; 
  border-color: var(--color-primary-dark) !important;
  color: #1F3044 !important;
}
.btn-outline-primary {
  color: var(--color-primary) !important;
  border-color: var(--color-primary) !important;
}
.btn-outline-primary:hover {
  background-color: var(--color-primary) !important;
  color: #1F3044 !important;
}
.border-primary { border-color: var(--color-primary) !important; }

/* Link Colors */
a { color: var(--color-primary); }
a:hover, a:focus { color: var(--color-primary-dark); }

/* Headings */
h1, h2, h3, h4, h5, h6,
.h1, .h2, .h3, .h4, .h5, .h6 {
  font-family: var(--font-heading);
  color: var(--color-heading);
}

/* Ensure headings are white in headers with dark backgrounds */
.header.text-white h1,
.header.text-white h2,
.header.text-white h3,
.header.text-white h4,
.header.text-white h5,
.header.text-white h6,
.header.text-white .h1,
.header.text-white .h2,
.header.text-white .h3,
.header.text-white .h4,
.header.text-white .h5,
.header.text-white .h6,
.header.text-white .display-1,
.header.text-white .display-2,
.header.text-white .display-3,
.header.text-white .display-4 {
  color: #ffffff !important;
}

/* Ensure paragraphs and lead text are white in headers with dark backgrounds */
.header.text-white p,
.header.text-white .lead,
.header.text-white .lead-2,
.header.text-white span,
.header.text-white small {
  color: rgba(255, 255, 255, 0.9) !important;
}

/* Ensure headings are white in sections with dark backgrounds */
.section[style*="gradient-primary"] h1,
.section[style*="gradient-primary"] h2,
.section[style*="gradient-primary"] h3,
.section[style*="gradient-primary"] h4,
.section[style*="gradient-primary"] h5,
.section[style*="gradient-primary"] h6,
.section[style*="gradient-primary"] .h1,
.section[style*="gradient-primary"] .h2,
.section[style*="gradient-primary"] .h3,
.section[style*="gradient-primary"] .h4,
.section[style*="gradient-primary"] .h5,
.section[style*="gradient-primary"] .h6,
.section[style*="gradient-primary"] .display-1,
.section[style*="gradient-primary"] .display-2,
.section[style*="gradient-primary"] .display-3,
.section[style*="gradient-primary"] .display-4,
.section.text-white h1,
.section.text-white h2,
.section.text-white h3,
.section.text-white h4,
.section.text-white h5,
.section.text-white h6,
.section.text-white .h1,
.section.text-white .h2,
.section.text-white .h3,
.section.text-white .h4,
.section.text-white .h5,
.section.text-white .h6,
.section.text-white .display-1,
.section.text-white .display-2,
.section.text-white .display-3,
.section.text-white .display-4,
.text-white h1,
.text-white h2,
.text-white h3,
.text-white h4,
.text-white h5,
.text-white h6,
.text-white .h1,
.text-white .h2,
.text-white .h3,
.text-white .h4,
.text-white .h5,
.text-white .h6,
.text-white .display-1,
.text-white .display-2,
.text-white .display-3,
.text-white .display-4 {
  color: #ffffff !important;
}

/* Ensure paragraphs and lead text are white in sections with dark backgrounds */
.section[style*="gradient-primary"] p,
.section[style*="gradient-primary"] .lead,
.section[style*="gradient-primary"] .lead-2,
.section.text-white p,
.section.text-white .lead,
.section.text-white .lead-2,
.text-white p,
.text-white .lead,
.text-white .lead-2 {
  color: rgba(255, 255, 255, 0.9) !important;
}

h1 a:hover, h2 a:hover, h3 a:hover, h4 a:hover, h5 a:hover, h6 a:hover {
  color: var(--color-primary);
}

/* Selection */
::selection {
  background: var(--color-primary);
  color: #1F3044;
}
::-moz-selection {
  background: var(--color-primary);
  color: #1F3044;
}

/* Typed Cursor */
[data-typing].text-primary + .typed-cursor {
  color: var(--color-primary);
}

/* Pre/Code */
pre {
  border-left-color: var(--color-primary);
}

/* Navbar */
.navbar .nav-link:hover,
.navbar .nav-link:focus,
.navbar .nav-link.active {
  color: var(--color-primary) !important;
}

.navbar-stick.stick .navbar .nav-link:hover,
.navbar-stick.stick .navbar .nav-link:focus {
  color: var(--color-primary) !important;
}

/* Header */
.header .btn-primary {
  background-color: var(--color-primary);
  border-color: var(--color-primary);
}

/* Sections */
.section.bg-gradient {
  background: var(--gradient-primary);
}

/* Cards */
.card:hover {
  border-color: var(--color-primary);
}

/* Features */
.feature-1 .feature:hover .feature-icon,
.feature-2 .feature:hover .feature-icon,
.feature-3 .feature:hover .feature-icon,
.feature-4 .feature:hover .feature-icon {
  color: var(--color-primary);
}

/* Pricing */
.pricing-1 .plan:hover,
.pricing-2 .plan:hover,
.pricing-3 .plan:hover,
.pricing-4 .plan:hover {
  border-color: var(--color-primary);
}

.pricing-1 .plan.popular,
.pricing-2 .plan.popular,
.pricing-3 .plan.popular,
.pricing-4 .plan.popular {
  border-color: var(--color-primary);
}

/* Testimonials */
.testimonial-1 .testimonial:hover,
.testimonial-2 .testimonial:hover {
  border-color: var(--color-primary);
}

/* Portfolio */
.portfolio-1 .portfolio-item:hover .portfolio-overlay,
.portfolio-2 .portfolio-item:hover .portfolio-overlay {
  background-color: rgba(var(--color-primary-rgb), 0.9);
}

/* Team */
.team-1 .team-member:hover,
.team-2 .team-member:hover {
  border-color: var(--color-primary);
}

/* Tabs */
.nav-tabs .nav-link.active,
.nav-tabs .nav-link:hover {
  color: var(--color-primary);
  border-color: var(--color-primary);
}

/* Progress */
.progress-bar {
  background-color: var(--color-primary);
}

/* Pagination */
.page-link {
  color: var(--color-primary);
}
.page-item.active .page-link {
  background-color: var(--color-primary);
  border-color: var(--color-primary);
}

/* Forms */
.form-control:focus {
  border-color: var(--color-primary);
  box-shadow: 0 0 0 0.2rem rgba(var(--color-primary-rgb), 0.25);
}

/* Social Icons */
.social a:hover {
  color: var(--color-primary);
}

/* Scroll to Top */
.scroll-top {
  background-color: var(--color-primary);
}
.scroll-top:hover {
  background-color: var(--color-primary-dark);
}

/* Footer */
.footer a:hover {
  color: var(--color-primary);
}

/* Accordion */
.accordion .card-title a:not(.collapsed) {
  color: var(--color-primary);
}

/* Custom Utility Classes */
.gradient-text {
  background: var(--gradient-primary);
  -webkit-background-clip: text;
  -webkit-text-fill-color: transparent;
  background-clip: text;
}

.hover-primary:hover {
  color: var(--color-primary) !important;
}

.icon-primary {
  color: var(--color-primary);
}

.border-gradient {
  border-image: var(--gradient-primary) 1;
}
