/* ============================================================
   INFIWITS + Elementor — Dark Theme Frontend Overrides
   Only loaded when Elementor plugin is active.
============================================================ */

/* ─── SECTION DEFAULTS ──────────────────────────────────── */
.elementor-section {
    background-color: var(--bg-secondary, #080F2A);
}
.elementor-section.elementor-section-full_width {
    background-color: var(--bg-primary, #050B20);
}
.elementor-inner-section {
    background-color: transparent;
}

/* ─── TYPOGRAPHY DEFAULTS ───────────────────────────────── */
.elementor-widget-heading .elementor-heading-title {
    font-family: 'Space Grotesk', var(--font-heading, sans-serif);
    color: var(--text-primary, #F0F4FF);
}
.elementor-widget-text-editor,
.elementor-widget-text-editor p {
    color: var(--text-secondary, #A8B5D8);
    font-family: 'Inter', var(--font-body, sans-serif);
    line-height: 1.7;
}

/* ─── BUTTON DEFAULTS ───────────────────────────────────── */
.elementor-button {
    font-family: 'Space Grotesk', var(--font-heading, sans-serif);
    font-weight: 600;
    border-radius: 100px !important;
    transition: all 0.3s cubic-bezier(0.4, 0, 0.2, 1);
}

/* ─── ICON DEFAULTS ─────────────────────────────────────── */
.elementor-icon,
.elementor-icon-list-icon {
    color: var(--color-blue, #00B4D8);
}
.elementor-icon-list-text {
    color: var(--text-secondary, #A8B5D8);
}

/* ─── DIVIDER / SEPARATOR ───────────────────────────────── */
.elementor-divider-separator {
    border-color: var(--border-glass, rgba(255, 255, 255, 0.1));
}

/* ─── IMAGE DEFAULTS ────────────────────────────────────── */
.elementor-widget-image img {
    border-radius: var(--radius-sm, 12px);
}

/* ============================================================
   UTILITY CLASSES
   Apply via: Widget > Advanced > CSS Classes
============================================================ */

/* Gradient text — class: gradient-text */
.elementor-widget .gradient-text,
.elementor-widget.gradient-text .elementor-heading-title {
    background: var(--gradient-main, linear-gradient(135deg, #7B2FBE, #00B4D8));
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
    background-clip: text;
}

/* Section label pill — class: section-label */
.elementor-widget.section-label .elementor-heading-title {
    display: inline-block;
    font-size: 0.75rem;
    font-weight: 600;
    letter-spacing: 0.12em;
    text-transform: uppercase;
    color: var(--color-blue, #00B4D8);
    background: rgba(0, 180, 216, 0.1);
    border: 1px solid rgba(0, 180, 216, 0.25);
    padding: 4px 14px;
    border-radius: 100px;
}

/* Glass card — class: glass-card */
.glass-card,
.elementor-column.glass-card > .elementor-widget-wrap,
.elementor-widget.glass-card {
    background: var(--bg-card, rgba(255, 255, 255, 0.04));
    border: 1px solid var(--border-glass, rgba(255, 255, 255, 0.1));
    border-radius: var(--radius-md, 16px);
    padding: 28px 24px;
    transition: all 0.3s cubic-bezier(0.4, 0, 0.2, 1);
}
.glass-card:hover {
    background: var(--bg-card-hover, rgba(255, 255, 255, 0.08));
    transform: translateY(-4px);
}

/* Gradient CTA button — class: btn-gradient */
.elementor-widget.btn-gradient .elementor-button {
    background: var(--gradient-main, linear-gradient(135deg, #7B2FBE, #00B4D8)) !important;
    color: #fff !important;
    box-shadow: 0 4px 20px rgba(123, 47, 190, 0.35);
    border: none !important;
}
.elementor-widget.btn-gradient .elementor-button:hover {
    transform: translateY(-2px);
    box-shadow: 0 8px 30px rgba(123, 47, 190, 0.5);
}

/* Ghost / outline button — class: btn-ghost-el */
.elementor-widget.btn-ghost-el .elementor-button {
    background: transparent !important;
    color: var(--text-primary, #F0F4FF) !important;
    border: 1px solid var(--border-glass, rgba(255, 255, 255, 0.18)) !important;
}
.elementor-widget.btn-ghost-el .elementor-button:hover {
    background: var(--bg-card-hover, rgba(255, 255, 255, 0.08)) !important;
}

/* Dark section — class: dark-section */
.elementor-section.dark-section {
    background: var(--bg-primary, #050B20) !important;
}

/* Gradient glow section — class: glow-section */
.elementor-section.glow-section {
    background: linear-gradient(135deg, rgba(123, 47, 190, 0.12) 0%, rgba(0, 180, 216, 0.08) 100%);
}

/* Violet accent section — class: violet-section */
.elementor-section.violet-section {
    background: linear-gradient(135deg, rgba(123, 47, 190, 0.08) 0%, rgba(255, 45, 120, 0.04) 100%);
}

/* Gradient banner (for CTA sections) — class: gradient-banner */
.elementor-section.gradient-banner {
    background: var(--gradient-main, linear-gradient(135deg, #7B2FBE, #00B4D8)) !important;
    position: relative;
    overflow: hidden;
}
.elementor-section.gradient-banner .elementor-heading-title {
    color: #fff;
}
.elementor-section.gradient-banner .elementor-widget-text-editor,
.elementor-section.gradient-banner .elementor-widget-text-editor p {
    color: rgba(255, 255, 255, 0.85);
}

/* Muted text — class: text-muted */
.elementor-widget.text-muted .elementor-heading-title,
.elementor-widget.text-muted p {
    color: var(--text-muted, #5A6A8A);
}

/* ─── FORM WIDGETS (Elementor Pro or third-party) ─────── */
.elementor-field-textual {
    background: rgba(255, 255, 255, 0.04) !important;
    border: 1px solid rgba(255, 255, 255, 0.1) !important;
    border-radius: 12px !important;
    color: var(--text-primary, #F0F4FF) !important;
    padding: 14px 18px !important;
}
.elementor-field-textual::placeholder {
    color: var(--text-muted, #5A6A8A) !important;
}
.elementor-field-textual:focus {
    border-color: var(--color-violet, #7B2FBE) !important;
    box-shadow: 0 0 20px rgba(123, 47, 190, 0.15) !important;
}
.elementor-field-label {
    color: var(--text-secondary, #A8B5D8) !important;
    font-size: 0.75rem;
    font-weight: 600;
    text-transform: uppercase;
    letter-spacing: 0.06em;
}

/* ─── COUNTER / STATS WIDGET ────────────────────────────── */
.elementor-widget-counter .elementor-counter-number-wrapper {
    font-family: 'Space Grotesk', var(--font-heading, sans-serif);
    font-weight: 800;
    background: var(--gradient-main, linear-gradient(135deg, #7B2FBE, #00B4D8));
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
    background-clip: text;
}
.elementor-widget-counter .elementor-counter-title {
    color: var(--text-secondary, #A8B5D8);
}

/* ─── TESTIMONIAL WIDGET ────────────────────────────────── */
.elementor-widget-testimonial .elementor-testimonial-content {
    color: var(--text-secondary, #A8B5D8);
}
.elementor-widget-testimonial .elementor-testimonial-name {
    color: var(--text-primary, #F0F4FF);
    font-weight: 700;
}
.elementor-widget-testimonial .elementor-testimonial-job {
    color: var(--text-muted, #5A6A8A);
}

/* ─── TABS / ACCORDION ──────────────────────────────────── */
.elementor-widget-tabs .elementor-tab-title {
    color: var(--text-secondary, #A8B5D8);
    font-family: 'Space Grotesk', var(--font-heading, sans-serif);
}
.elementor-widget-tabs .elementor-tab-title.elementor-active {
    color: var(--color-blue, #00B4D8);
}
.elementor-widget-tabs .elementor-tab-content {
    color: var(--text-secondary, #A8B5D8);
    border-color: var(--border-glass, rgba(255, 255, 255, 0.1));
}
.elementor-widget-accordion .elementor-accordion-title {
    color: var(--text-primary, #F0F4FF);
    font-family: 'Space Grotesk', var(--font-heading, sans-serif);
}
.elementor-widget-accordion .elementor-tab-content {
    color: var(--text-secondary, #A8B5D8);
    border-color: var(--border-glass, rgba(255, 255, 255, 0.1));
}
.elementor-widget-accordion .elementor-accordion-icon {
    color: var(--color-blue, #00B4D8);
}

/* ─── PROGRESS BAR ──────────────────────────────────────── */
.elementor-widget-progress .elementor-progress-wrapper {
    background: rgba(255, 255, 255, 0.06);
    border-radius: 100px;
}
.elementor-widget-progress .elementor-progress-bar {
    background: var(--gradient-main, linear-gradient(135deg, #7B2FBE, #00B4D8));
    border-radius: 100px;
}
