/*
 * Theme Override - Custom Color Settings
 * This file is auto-generated by the theme settings in the admin panel
 * Do not edit manually unless you know what you're doing
 *
 * Default Mode: dark
 */

/* Default Mode (dark) */
:root {
  /* Tailwind CSS Variables Override */
  --gradient-primary: linear-gradient(135deg, #00fffb, #fd1cea);
  --gradient-hero: linear-gradient(135deg, #00fffb 0%, #fd1cea 100%);

  /* Heading Colors */
  --heading-gradient-start: #00fffb;
  --heading-gradient-end: #a78bfa;
  --heading-color: #00fffb;
  --heading-background: #00fffb;

  /* Primary Colors */
  --primary-gradient-start: #00fffb;
  --primary-gradient-end: #fd1cea;
  --primary-gradient: linear-gradient(135deg, var(--primary-gradient-start), var(--primary-gradient-end));
  --primary-text: #000000;

  /* Button Primary */
  --button-primary-bg: var(--primary-gradient);
  --button-primary-text: var(--primary-text);
  --button-primary-text-hover: #000000;
  --button-primary-hover-start: #3b82f6;
  --button-primary-hover-end: #8b5cf6;
  --button-primary-hover: linear-gradient(135deg, var(--button-primary-hover-start), var(--button-primary-hover-end));

  /* Button Secondary */
  --button-secondary-gradient-start: #02212e;
  --button-secondary-gradient-end: #02212e;
  --button-secondary-bg: linear-gradient(135deg, var(--button-secondary-gradient-start), var(--button-secondary-gradient-end));
  --button-secondary-text: #ffffff;
  --button-secondary-text-hover: #ffffff;
  --button-secondary-hover-start: #3b82f6;
  --button-secondary-hover-end: #8b5cf6;
  --button-secondary-hover: linear-gradient(135deg, var(--button-secondary-hover-start), var(--button-secondary-hover-end));

  /* Button Styles */
  --button-radius: 0.5rem;
  --button-shadow: 0 1px 2px 0 rgb(0 0 0 / 0.05);
  --button-padding-sm: 0.5rem 1rem;
  --button-padding-md: 0.625rem 1.25rem;
  --button-padding-lg: 0.75rem 1.5rem;
}

/* Light Mode Override */
.light {
  /* Tailwind CSS Variables Override */
  --gradient-primary: linear-gradient(135deg, #3b82f6, #8b5cf6);
  --gradient-hero: linear-gradient(135deg, #3b82f6 0%, #8b5cf6 100%);

  /* Heading Colors */
  --heading-gradient-start: #1e40af;
  --heading-gradient-end: #7c3aed;
  --heading-color: #1e40af;
  --heading-background: #1e40af;

  /* Primary Colors */
  --primary-gradient-start: #3b82f6;
  --primary-gradient-end: #8b5cf6;
  --primary-gradient: linear-gradient(135deg, var(--primary-gradient-start), var(--primary-gradient-end));
  --primary-text: #ffffff;

  /* Button Primary */
  --button-primary-bg: var(--primary-gradient);
  --button-primary-text: var(--primary-text);
  --button-primary-text-hover: #ffffff;
  --button-primary-hover-start: #2563eb;
  --button-primary-hover-end: #7c3aed;
  --button-primary-hover: linear-gradient(135deg, var(--button-primary-hover-start), var(--button-primary-hover-end));

  /* Button Secondary */
  --button-secondary-gradient-start: #10b981;
  --button-secondary-gradient-end: #059669;
  --button-secondary-bg: linear-gradient(135deg, var(--button-secondary-gradient-start), var(--button-secondary-gradient-end));
  --button-secondary-text: #ffffff;
  --button-secondary-text-hover: #ffffff;
  --button-secondary-hover-start: #059669;
  --button-secondary-hover-end: #047857;
  --button-secondary-hover: linear-gradient(135deg, var(--button-secondary-hover-start), var(--button-secondary-hover-end));
}

/* Dark Mode Override */
.dark {
  /* Tailwind CSS Variables Override */
  --gradient-primary: linear-gradient(135deg, #00fffb, #fd1cea);
  --gradient-hero: linear-gradient(135deg, #00fffb 0%, #fd1cea 100%);

  /* Heading Colors */
  --heading-gradient-start: #00fffb;
  --heading-gradient-end: #a78bfa;
  --heading-color: #00fffb;
  --heading-background: #00fffb;

  /* Primary Colors */
  --primary-gradient-start: #00fffb;
  --primary-gradient-end: #fd1cea;
  --primary-gradient: linear-gradient(135deg, var(--primary-gradient-start), var(--primary-gradient-end));
  --primary-text: #000000;

  /* Button Primary */
  --button-primary-bg: var(--primary-gradient);
  --button-primary-text: var(--primary-text);
  --button-primary-text-hover: #000000;
  --button-primary-hover-start: #3b82f6;
  --button-primary-hover-end: #8b5cf6;
  --button-primary-hover: linear-gradient(135deg, var(--button-primary-hover-start), var(--button-primary-hover-end));

  /* Button Secondary */
  --button-secondary-gradient-start: #02212e;
  --button-secondary-gradient-end: #02212e;
  --button-secondary-bg: linear-gradient(135deg, var(--button-secondary-gradient-start), var(--button-secondary-gradient-end));
  --button-secondary-text: #ffffff;
  --button-secondary-text-hover: #ffffff;
  --button-secondary-hover-start: #3b82f6;
  --button-secondary-hover-end: #8b5cf6;
  --button-secondary-hover: linear-gradient(135deg, var(--button-secondary-hover-start), var(--button-secondary-hover-end));
}

/* Apply gradient to primary buttons */
/* Exclude elements that use bg-clip-text or text-transparent for text gradient effect */
.bg-gradient-primary:not(.text-transparent),
.bg-primary:not(.text-transparent) {
  background: var(--primary-gradient) !important;
  color: var(--primary-text) !important;
}

/* Apply styles to buttons */
.btn-primary {
  background: var(--button-primary-bg) !important;
  color: var(--button-primary-text) !important;
  border-radius: var(--button-radius);
  box-shadow: var(--button-shadow);
}

.btn-primary:hover {
  background: var(--button-primary-hover) !important;
  color: var(--button-primary-text-hover) !important;
}

.btn-secondary {
  background: var(--button-secondary-bg) !important;
  color: var(--button-secondary-text) !important;
  border-radius: var(--button-radius);
  box-shadow: var(--button-shadow);
}

.btn-secondary:hover {
  background: var(--button-secondary-hover) !important;
  color: var(--button-secondary-text-hover) !important;
}

/* Apply heading colors to h1-h6 and titles */
/* For regular headings without text-transparent */
h1:not([class*="bg-"]):not(.text-transparent),
h2:not([class*="bg-"]):not(.text-transparent),
h3:not([class*="bg-"]):not(.text-transparent),
h4:not([class*="bg-"]):not(.text-transparent),
h5:not([class*="bg-"]):not(.text-transparent),
h6:not([class*="bg-"]):not(.text-transparent),
.heading:not([class*="bg-"]):not(.text-transparent),
.title:not([class*="bg-"]):not(.text-transparent) {
  color: var(--heading-color);
}

/* Apply gradient to headings when enabled */


/* For headings with text-transparent class, apply gradient background */
h1.text-transparent, h2.text-transparent, h3.text-transparent,
h4.text-transparent, h5.text-transparent, h6.text-transparent,
.heading.text-transparent, .title.text-transparent {
  background: var(--heading-background);
  -webkit-background-clip: text;
  background-clip: text;
}