import { CommonModule } from '@angular/common';
import { Component, EventEmitter, inject, Input, Output } from '@angular/core';
import { IonIcon } from '@ionic/angular/standalone';
import { addIcons } from 'ionicons';
import { arrowForwardOutline } from 'ionicons/icons';
import { I18nService } from '../../../services/i18n';
import { NavigationService } from '../../../services/navigation';
import { PresetService } from '../../../services/presets';
import { ThemeService } from '../../../services/theme.service';
import * as i0 from "@angular/core";
/**
 * val-glow-card
 *
 * A card component featuring an image with zoom-on-hover, animated CTA link,
 * and dynamic glow effect that adapts to light/dark mode.
 * Supports presets for reusable configurations.
 *
 * @example With preset:
 * <val-glow-card preset="feature" [props]="{ title: 'Title', cta: {...} }"></val-glow-card>
 *
 * @example Static:
 * <val-glow-card
 *   [props]="{
 *     imageSrc: 'https://example.com/image.jpg',
 *     imageAlt: 'Example image',
 *     title: 'Card Title',
 *     description: 'Card description text',
 *     cta: { text: 'Learn More', url: '/details', type: 'internal' }
 *   }"
 *   (onClick)="handleClick($event)"
 * ></val-glow-card>
 *
 * @input preset: string - Name of preset to apply
 * @input props: GlowCardMetadata - Configuration for the card
 * @output onClick - Emits GlowCardClickEvent when card, image, or CTA is clicked
 */
export class GlowCardComponent {
    ngOnInit() {
        this.resolveProps();
    }
    ngOnChanges(changes) {
        if (changes['preset'] || changes['props']) {
            this.resolveProps();
        }
    }
    resolveProps() {
        const presetProps = this.preset
            ? this.presets.get('glowCard', this.preset)
            : {};
        this.resolvedProps = {
            ...presetProps,
            ...this.props,
        };
    }
    constructor() {
        this.presets = inject(PresetService);
        this.props = {};
        this.resolvedProps = {};
        this.onClick = new EventEmitter();
        this.i18n = inject(I18nService);
        this.navigationService = inject(NavigationService);
        this.themeService = inject(ThemeService);
        this.ionicColors = ['primary', 'secondary', 'tertiary', 'success', 'warning', 'danger', 'light', 'medium', 'dark'];
        // RGB values with SPACE separator for CSS rgb(var() / alpha) syntax
        this.colorRgbMap = {
            primary: '112 38 223',
            secondary: '226 204 255',
            tertiary: '82 96 255',
            success: '45 211 111',
            warning: '255 196 9',
            danger: '235 68 90',
        };
        addIcons({ arrowForwardOutline });
    }
    get isDark() {
        return this.themeService.IsDark;
    }
    getTitle() {
        return this.resolvedProps.title || this.resolvedProps.titleFallback || '';
    }
    getDescription() {
        return this.resolvedProps.description || this.resolvedProps.descriptionFallback || '';
    }
    getCtaText() {
        return this.resolvedProps.cta?.text || this.resolvedProps.cta?.contentFallback || this.i18n.t('seeMore');
    }
    getGlowColor() {
        const color = this.resolvedProps.glow?.color;
        if (!color) {
            return 'var(--ion-color-primary)';
        }
        if (this.ionicColors.includes(color)) {
            return `var(--ion-color-${color})`;
        }
        return color;
    }
    getGlowColorRgb() {
        const color = this.resolvedProps.glow?.color;
        if (!color) {
            return '112 38 223'; // Default primary color (space-separated for CSS)
        }
        if (this.ionicColors.includes(color)) {
            const rgb = this.colorRgbMap[color];
            return rgb ? rgb : '112 38 223';
        }
        // For custom hex colors, try to convert
        if (typeof color === 'string' && color.startsWith('#')) {
            return this.hexToRgb(color);
        }
        return '112 38 223';
    }
    hexToRgb(hex) {
        const result = /^#?([a-f\d]{2})([a-f\d]{2})([a-f\d]{2})$/i.exec(hex);
        if (result) {
            // Space-separated for CSS rgb(var() / alpha) syntax
            return `${parseInt(result[1], 16)} ${parseInt(result[2], 16)} ${parseInt(result[3], 16)}`;
        }
        return '112 38 223';
    }
    getAspectRatioValue() {
        const ratioMap = {
            '16:9': '16 / 9',
            '4:3': '4 / 3',
            '1:1': '1 / 1',
            '3:2': '3 / 2',
            '21:9': '21 / 9',
        };
        return ratioMap[this.resolvedProps.aspectRatio || '16:9'];
    }
    getBorderColor() {
        const color = this.resolvedProps.borderColor;
        if (!color) {
            return 'var(--ion-color-medium)';
        }
        if (this.ionicColors.includes(color)) {
            return `var(--ion-color-${color})`;
        }
        return color;
    }
    getBackgroundStyle() {
        const bg = this.resolvedProps.backgroundColor;
        if (!bg)
            return null;
        // Si es un color Ionic, usar la variable CSS
        if (this.ionicColors.includes(bg)) {
            return `var(--ion-color-${bg})`;
        }
        // Si es un string CSS (color hex, gradiente, etc), usar directamente
        return bg;
    }
    onCardClick(event) {
        if (event.target.closest('.glow-card__cta, .glow-card__image')) {
            return;
        }
        this.onClick.emit({ target: 'card', token: this.resolvedProps.token });
    }
    onImageClick(event) {
        event.stopPropagation();
        this.onClick.emit({ target: 'image', token: this.resolvedProps.token });
    }
    onCtaClick(event) {
        event.preventDefault();
        event.stopPropagation();
        this.onClick.emit({
            target: 'cta',
            token: this.resolvedProps.token,
            url: this.resolvedProps.cta?.url,
        });
        switch (this.resolvedProps.cta?.type) {
            case 'internal':
                this.navigationService.navigateByUrl(this.resolvedProps.cta.url);
                break;
            case 'browse':
                this.navigationService.navigateInApp(this.resolvedProps.cta.url);
                break;
            case 'tab':
                this.navigationService.openInNewTab(this.resolvedProps.cta.url);
                break;
        }
    }
    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.14", ngImport: i0, type: GlowCardComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "18.2.14", type: GlowCardComponent, isStandalone: true, selector: "val-glow-card", inputs: { preset: "preset", props: "props" }, outputs: { onClick: "onClick" }, usesOnChanges: true, ngImport: i0, template: `
    <article
      class="glow-card"
      [class.glow-enabled]="resolvedProps.glow?.enabled !== false"
      [class.glow-subtle]="resolvedProps.glow?.intensity === 'subtle'"
      [class.glow-medium]="!resolvedProps.glow?.intensity || resolvedProps.glow?.intensity === 'medium'"
      [class.glow-intense]="resolvedProps.glow?.intensity === 'intense'"
      [class.dark-mode]="isDark"
      [class.bordered]="resolvedProps.bordered"
      [class.no-image]="!resolvedProps.imageSrc"
      [style.--glow-color]="getGlowColor()"
      [style.--glow-color-rgb]="getGlowColorRgb()"
      [style.--aspect-ratio]="getAspectRatioValue()"
      [style.--border-color]="getBorderColor()"
      [style.background]="getBackgroundStyle()"
      (click)="onCardClick($event)"
    >
      <!-- Image Container with overflow hidden for zoom effect -->
      @if (resolvedProps.imageSrc) {
        <div class="glow-card__image-container">
          <img
            class="glow-card__image"
            [src]="resolvedProps.imageSrc"
            [alt]="resolvedProps.imageAlt"
            (click)="onImageClick($event)"
          />
        </div>
      }

      <!-- Content Section -->
      <div class="glow-card__content">
        <!-- Label (pill style) -->
        @if (resolvedProps.label) {
          <span class="glow-card__label">{{ resolvedProps.label }}</span>
        }

        <!-- Title -->
        <h3 class="glow-card__title">
          {{ getTitle() }}
        </h3>

        <!-- Description -->
        <p class="glow-card__description">
          {{ getDescription() }}
        </p>

        <!-- CTA Link with expanding animation -->
        <a
          class="glow-card__cta"
          [href]="resolvedProps.cta?.url"
          (click)="onCtaClick($event)"
        >
          <span class="glow-card__cta-text">{{ getCtaText() }}</span>
          <ion-icon
            class="glow-card__cta-icon"
            [name]="resolvedProps.cta?.icon || 'arrow-forward-outline'"
          ></ion-icon>
        </a>
      </div>
    </article>
  `, isInline: true, styles: ["@charset \"UTF-8\";:root{--val-container-sm: 540px;--val-container-md: 720px;--val-container-lg: 880px;--val-container-xl: 1100px;--val-container-padding: 16px;--ion-color-primary: #7026df;--ion-color-primary-rgb: 112, 38, 223;--ion-color-primary-contrast: #ffffff;--ion-color-primary-contrast-rgb: 255, 255, 255;--ion-color-primary-shade: #6321c4;--ion-color-primary-tint: #7e3ce2;--ion-color-secondary: #e2ccff;--ion-color-secondary-rgb: 226, 204, 255;--ion-color-secondary-contrast: #000000;--ion-color-secondary-contrast-rgb: 0, 0, 0;--ion-color-secondary-shade: #c7b4e0;--ion-color-secondary-tint: #e5d1ff;--ion-color-texti: #354c69;--ion-color-texti-rgb: 53, 76, 105;--ion-color-texti-contrast: #ffffff;--ion-color-texti-contrast-rgb: 255, 255, 255;--ion-color-texti-shade: #2f435c;--ion-color-texti-tint: #495e78;--ion-color-darki: #090f1b;--ion-color-darki-rgb: 9, 15, 27;--ion-color-darki-contrast: #ffffff;--ion-color-darki-contrast-rgb: 255, 255, 255;--ion-color-darki-shade: #080d18;--ion-color-darki-tint: #222732;--ion-color-medium: #9e9e9e;--ion-color-medium-rgb: 158, 158, 158;--ion-color-medium-contrast: #000000;--ion-color-medium-contrast-rgb: 0, 0, 0;--ion-color-medium-shade: #8b8b8b;--ion-color-medium-tint: #a8a8a8;--swiper-pagination-color: var(--ion-color-primary);--swiper-navigation-color: var(--ion-color-primary);--swiper-pagination-bullet-inactive-color: var(--ion-color-medium)}body.dark,html.ion-palette-dark,body[data-theme=dark]{--ion-color-texti: #8fc1ff;--ion-color-texti-rgb: 143, 193, 255;--ion-color-texti-contrast: #000000;--ion-color-texti-contrast-rgb: 0, 0, 0;--ion-color-texti-shade: #7eaae0;--ion-color-texti-tint: #9ac7ff;--ion-color-darki: #ffffff;--ion-color-darki-rgb: 255, 255, 255;--ion-color-darki-contrast: #000000;--ion-color-darki-contrast-rgb: 0, 0, 0;--ion-color-darki-shade: #e0e0e0;--ion-color-darki-tint: #ffffff;--ion-color-primary: #8f49f8;--ion-color-primary-rgb: 143, 73, 248;--ion-color-primary-contrast: #ffffff;--ion-color-primary-contrast-rgb: 255, 255, 255;--ion-color-primary-shade: #7e40da;--ion-color-primary-tint: #9a5bf9}.ion-color-texti{--ion-color-base: var(--ion-color-texti);--ion-color-base-rgb: var(--ion-color-texti-rgb);--ion-color-contrast: var(--ion-color-texti-contrast);--ion-color-contrast-rgb: var(--ion-color-texti-contrast-rgb);--ion-color-shade: var(--ion-color-texti-shade);--ion-color-tint: var(--ion-color-texti-tint)}.ion-color-darki{--ion-color-base: var(--ion-color-darki);--ion-color-base-rgb: var(--ion-color-darki-rgb);--ion-color-contrast: var(--ion-color-darki-contrast);--ion-color-contrast-rgb: var(--ion-color-darki-contrast-rgb);--ion-color-shade: var(--ion-color-darki-shade);--ion-color-tint: var(--ion-color-darki-tint)}:host{--glow-color: var(--ion-color-primary);--glow-color-rgb: 112 38 223;--aspect-ratio: 16 / 9;--card-border-radius: 1.25rem;--image-border-radius: 1rem;--transition-duration: .3s;--transition-timing: cubic-bezier(.4, 0, .2, 1);display:block}.glow-card{position:relative;display:flex;flex-direction:column;background:var(--ion-background-color, #ffffff);border-radius:var(--card-border-radius);overflow:hidden;cursor:pointer;transition:transform var(--transition-duration) var(--transition-timing),box-shadow var(--transition-duration) var(--transition-timing)}.glow-card__image-container{position:relative;width:calc(100% - 1.5rem);aspect-ratio:var(--aspect-ratio);overflow:hidden;border-radius:var(--image-border-radius);margin:.75rem;margin-bottom:0}.glow-card__image{width:100%;height:100%;object-fit:cover;border-radius:var(--image-border-radius);transition:transform var(--transition-duration) var(--transition-timing)}.glow-card__content{padding:1rem 1.25rem 1.25rem;display:flex;flex-direction:column;gap:.5rem}.glow-card__label{display:inline-block;align-self:flex-start;width:fit-content;padding:.375rem .75rem;background:#fff3;backdrop-filter:blur(4px);border-radius:.25rem;font-size:.75rem;font-weight:600;color:var(--ion-color-dark, var(--ion-text-color, #000));margin-bottom:.5rem}.glow-card__title{margin:0;font-size:1.125rem;font-weight:700;line-height:1.3;color:var(--ion-color-dark, var(--ion-text-color, #000))}.glow-card__description{margin:0;font-size:.875rem;line-height:1.5;color:var(--ion-color-text, var(--ion-color-dark, #666));display:-webkit-box;-webkit-line-clamp:3;-webkit-box-orient:vertical;overflow:hidden}.glow-card__cta{display:inline-flex;align-items:center;gap:.25rem;margin-top:.5rem;padding:.25rem 0;text-decoration:none;color:var(--glow-color);font-weight:600;font-size:.875rem;transition:gap var(--transition-duration) var(--transition-timing)}.glow-card__cta:hover{gap:.5rem}.glow-card__cta-text{max-width:0;opacity:0;overflow:hidden;white-space:nowrap;transition:max-width var(--transition-duration) var(--transition-timing),opacity var(--transition-duration) var(--transition-timing)}.glow-card__cta-icon{font-size:1.25rem;flex-shrink:0;transition:transform var(--transition-duration) var(--transition-timing)}.glow-card:hover{transform:translateY(-.25rem)}.glow-card:hover .glow-card__image{transform:scale(1.08)}.glow-card:hover .glow-card__cta-text{max-width:12.5rem;opacity:1}.glow-card:hover .glow-card__cta-icon{transform:translate(.125rem)}.glow-card.glow-enabled:hover{box-shadow:0 .25rem .75rem #00000014,0 .5rem 1.5rem #0000001a,0 .25rem 1.25rem rgb(var(--glow-color-rgb)/.15)}.glow-card.glow-enabled.glow-subtle:hover{box-shadow:0 .25rem .75rem #0000000f,0 .375rem 1rem #00000014,0 .125rem .75rem rgb(var(--glow-color-rgb)/.1)}.glow-card.glow-enabled.glow-medium:hover{box-shadow:0 .375rem 1rem #00000014,0 .75rem 2rem #0000001a,0 .375rem 1.5rem rgb(var(--glow-color-rgb)/.2)}.glow-card.glow-enabled.glow-intense:hover{box-shadow:0 .5rem 1.25rem #00000014,0 1rem 2.5rem #0000001a,0 .5rem 2rem rgb(var(--glow-color-rgb)/.3)}.glow-card.glow-enabled.dark-mode:hover{box-shadow:0 0 1.25rem rgb(var(--glow-color-rgb)/.25),0 0 2.5rem rgb(var(--glow-color-rgb)/.18),0 0 3.75rem rgb(var(--glow-color-rgb)/.12)}.glow-card.glow-enabled.dark-mode.glow-subtle:hover{box-shadow:0 0 .75rem rgb(var(--glow-color-rgb)/.18),0 0 1.5rem rgb(var(--glow-color-rgb)/.12)}.glow-card.glow-enabled.dark-mode.glow-medium:hover{box-shadow:0 0 1.5rem rgb(var(--glow-color-rgb)/.3),0 0 3rem rgb(var(--glow-color-rgb)/.22),0 0 4.5rem rgb(var(--glow-color-rgb)/.15)}.glow-card.glow-enabled.dark-mode.glow-intense:hover{box-shadow:0 0 2rem rgb(var(--glow-color-rgb)/.4),0 0 4rem rgb(var(--glow-color-rgb)/.3),0 0 6rem rgb(var(--glow-color-rgb)/.2)}.glow-card.dark-mode{background:var(--ion-card-background, #1e1e1e)}.glow-card.bordered{border:.0625rem solid var(--border-color, var(--ion-color-medium))}.glow-card.no-image{min-height:12.5rem}.glow-card.no-image .glow-card__content{padding:1.25rem 1.5rem;flex:1;justify-content:center}.glow-card.no-image .glow-card__title{font-size:1.75rem;line-height:1.2}.glow-card.no-image .glow-card__description{font-size:1rem;-webkit-line-clamp:4}@media (max-width: 768px){.glow-card{--card-border-radius: 1rem;--image-border-radius: .75rem}.glow-card__content{padding:.75rem 1rem 1rem}.glow-card__title{font-size:1rem}.glow-card__description{font-size:.8125rem;-webkit-line-clamp:2}.glow-card.no-image{min-height:11.25rem}.glow-card.no-image .glow-card__content{padding:1rem 1.25rem}.glow-card.no-image .glow-card__title{font-size:1.375rem}.glow-card.no-image .glow-card__description{font-size:.875rem}}@media (prefers-reduced-motion: reduce){.glow-card,.glow-card__image,.glow-card__cta,.glow-card__cta-text,.glow-card__cta-icon{transition:none}.glow-card:hover,.glow-card:hover .glow-card__image{transform:none}}\n"], dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "component", type: IonIcon, selector: "ion-icon", inputs: ["color", "flipRtl", "icon", "ios", "lazy", "md", "mode", "name", "sanitize", "size", "src"] }] }); }
}
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.14", ngImport: i0, type: GlowCardComponent, decorators: [{
            type: Component,
            args: [{ selector: 'val-glow-card', standalone: true, imports: [CommonModule, IonIcon], template: `
    <article
      class="glow-card"
      [class.glow-enabled]="resolvedProps.glow?.enabled !== false"
      [class.glow-subtle]="resolvedProps.glow?.intensity === 'subtle'"
      [class.glow-medium]="!resolvedProps.glow?.intensity || resolvedProps.glow?.intensity === 'medium'"
      [class.glow-intense]="resolvedProps.glow?.intensity === 'intense'"
      [class.dark-mode]="isDark"
      [class.bordered]="resolvedProps.bordered"
      [class.no-image]="!resolvedProps.imageSrc"
      [style.--glow-color]="getGlowColor()"
      [style.--glow-color-rgb]="getGlowColorRgb()"
      [style.--aspect-ratio]="getAspectRatioValue()"
      [style.--border-color]="getBorderColor()"
      [style.background]="getBackgroundStyle()"
      (click)="onCardClick($event)"
    >
      <!-- Image Container with overflow hidden for zoom effect -->
      @if (resolvedProps.imageSrc) {
        <div class="glow-card__image-container">
          <img
            class="glow-card__image"
            [src]="resolvedProps.imageSrc"
            [alt]="resolvedProps.imageAlt"
            (click)="onImageClick($event)"
          />
        </div>
      }

      <!-- Content Section -->
      <div class="glow-card__content">
        <!-- Label (pill style) -->
        @if (resolvedProps.label) {
          <span class="glow-card__label">{{ resolvedProps.label }}</span>
        }

        <!-- Title -->
        <h3 class="glow-card__title">
          {{ getTitle() }}
        </h3>

        <!-- Description -->
        <p class="glow-card__description">
          {{ getDescription() }}
        </p>

        <!-- CTA Link with expanding animation -->
        <a
          class="glow-card__cta"
          [href]="resolvedProps.cta?.url"
          (click)="onCtaClick($event)"
        >
          <span class="glow-card__cta-text">{{ getCtaText() }}</span>
          <ion-icon
            class="glow-card__cta-icon"
            [name]="resolvedProps.cta?.icon || 'arrow-forward-outline'"
          ></ion-icon>
        </a>
      </div>
    </article>
  `, styles: ["@charset \"UTF-8\";:root{--val-container-sm: 540px;--val-container-md: 720px;--val-container-lg: 880px;--val-container-xl: 1100px;--val-container-padding: 16px;--ion-color-primary: #7026df;--ion-color-primary-rgb: 112, 38, 223;--ion-color-primary-contrast: #ffffff;--ion-color-primary-contrast-rgb: 255, 255, 255;--ion-color-primary-shade: #6321c4;--ion-color-primary-tint: #7e3ce2;--ion-color-secondary: #e2ccff;--ion-color-secondary-rgb: 226, 204, 255;--ion-color-secondary-contrast: #000000;--ion-color-secondary-contrast-rgb: 0, 0, 0;--ion-color-secondary-shade: #c7b4e0;--ion-color-secondary-tint: #e5d1ff;--ion-color-texti: #354c69;--ion-color-texti-rgb: 53, 76, 105;--ion-color-texti-contrast: #ffffff;--ion-color-texti-contrast-rgb: 255, 255, 255;--ion-color-texti-shade: #2f435c;--ion-color-texti-tint: #495e78;--ion-color-darki: #090f1b;--ion-color-darki-rgb: 9, 15, 27;--ion-color-darki-contrast: #ffffff;--ion-color-darki-contrast-rgb: 255, 255, 255;--ion-color-darki-shade: #080d18;--ion-color-darki-tint: #222732;--ion-color-medium: #9e9e9e;--ion-color-medium-rgb: 158, 158, 158;--ion-color-medium-contrast: #000000;--ion-color-medium-contrast-rgb: 0, 0, 0;--ion-color-medium-shade: #8b8b8b;--ion-color-medium-tint: #a8a8a8;--swiper-pagination-color: var(--ion-color-primary);--swiper-navigation-color: var(--ion-color-primary);--swiper-pagination-bullet-inactive-color: var(--ion-color-medium)}body.dark,html.ion-palette-dark,body[data-theme=dark]{--ion-color-texti: #8fc1ff;--ion-color-texti-rgb: 143, 193, 255;--ion-color-texti-contrast: #000000;--ion-color-texti-contrast-rgb: 0, 0, 0;--ion-color-texti-shade: #7eaae0;--ion-color-texti-tint: #9ac7ff;--ion-color-darki: #ffffff;--ion-color-darki-rgb: 255, 255, 255;--ion-color-darki-contrast: #000000;--ion-color-darki-contrast-rgb: 0, 0, 0;--ion-color-darki-shade: #e0e0e0;--ion-color-darki-tint: #ffffff;--ion-color-primary: #8f49f8;--ion-color-primary-rgb: 143, 73, 248;--ion-color-primary-contrast: #ffffff;--ion-color-primary-contrast-rgb: 255, 255, 255;--ion-color-primary-shade: #7e40da;--ion-color-primary-tint: #9a5bf9}.ion-color-texti{--ion-color-base: var(--ion-color-texti);--ion-color-base-rgb: var(--ion-color-texti-rgb);--ion-color-contrast: var(--ion-color-texti-contrast);--ion-color-contrast-rgb: var(--ion-color-texti-contrast-rgb);--ion-color-shade: var(--ion-color-texti-shade);--ion-color-tint: var(--ion-color-texti-tint)}.ion-color-darki{--ion-color-base: var(--ion-color-darki);--ion-color-base-rgb: var(--ion-color-darki-rgb);--ion-color-contrast: var(--ion-color-darki-contrast);--ion-color-contrast-rgb: var(--ion-color-darki-contrast-rgb);--ion-color-shade: var(--ion-color-darki-shade);--ion-color-tint: var(--ion-color-darki-tint)}:host{--glow-color: var(--ion-color-primary);--glow-color-rgb: 112 38 223;--aspect-ratio: 16 / 9;--card-border-radius: 1.25rem;--image-border-radius: 1rem;--transition-duration: .3s;--transition-timing: cubic-bezier(.4, 0, .2, 1);display:block}.glow-card{position:relative;display:flex;flex-direction:column;background:var(--ion-background-color, #ffffff);border-radius:var(--card-border-radius);overflow:hidden;cursor:pointer;transition:transform var(--transition-duration) var(--transition-timing),box-shadow var(--transition-duration) var(--transition-timing)}.glow-card__image-container{position:relative;width:calc(100% - 1.5rem);aspect-ratio:var(--aspect-ratio);overflow:hidden;border-radius:var(--image-border-radius);margin:.75rem;margin-bottom:0}.glow-card__image{width:100%;height:100%;object-fit:cover;border-radius:var(--image-border-radius);transition:transform var(--transition-duration) var(--transition-timing)}.glow-card__content{padding:1rem 1.25rem 1.25rem;display:flex;flex-direction:column;gap:.5rem}.glow-card__label{display:inline-block;align-self:flex-start;width:fit-content;padding:.375rem .75rem;background:#fff3;backdrop-filter:blur(4px);border-radius:.25rem;font-size:.75rem;font-weight:600;color:var(--ion-color-dark, var(--ion-text-color, #000));margin-bottom:.5rem}.glow-card__title{margin:0;font-size:1.125rem;font-weight:700;line-height:1.3;color:var(--ion-color-dark, var(--ion-text-color, #000))}.glow-card__description{margin:0;font-size:.875rem;line-height:1.5;color:var(--ion-color-text, var(--ion-color-dark, #666));display:-webkit-box;-webkit-line-clamp:3;-webkit-box-orient:vertical;overflow:hidden}.glow-card__cta{display:inline-flex;align-items:center;gap:.25rem;margin-top:.5rem;padding:.25rem 0;text-decoration:none;color:var(--glow-color);font-weight:600;font-size:.875rem;transition:gap var(--transition-duration) var(--transition-timing)}.glow-card__cta:hover{gap:.5rem}.glow-card__cta-text{max-width:0;opacity:0;overflow:hidden;white-space:nowrap;transition:max-width var(--transition-duration) var(--transition-timing),opacity var(--transition-duration) var(--transition-timing)}.glow-card__cta-icon{font-size:1.25rem;flex-shrink:0;transition:transform var(--transition-duration) var(--transition-timing)}.glow-card:hover{transform:translateY(-.25rem)}.glow-card:hover .glow-card__image{transform:scale(1.08)}.glow-card:hover .glow-card__cta-text{max-width:12.5rem;opacity:1}.glow-card:hover .glow-card__cta-icon{transform:translate(.125rem)}.glow-card.glow-enabled:hover{box-shadow:0 .25rem .75rem #00000014,0 .5rem 1.5rem #0000001a,0 .25rem 1.25rem rgb(var(--glow-color-rgb)/.15)}.glow-card.glow-enabled.glow-subtle:hover{box-shadow:0 .25rem .75rem #0000000f,0 .375rem 1rem #00000014,0 .125rem .75rem rgb(var(--glow-color-rgb)/.1)}.glow-card.glow-enabled.glow-medium:hover{box-shadow:0 .375rem 1rem #00000014,0 .75rem 2rem #0000001a,0 .375rem 1.5rem rgb(var(--glow-color-rgb)/.2)}.glow-card.glow-enabled.glow-intense:hover{box-shadow:0 .5rem 1.25rem #00000014,0 1rem 2.5rem #0000001a,0 .5rem 2rem rgb(var(--glow-color-rgb)/.3)}.glow-card.glow-enabled.dark-mode:hover{box-shadow:0 0 1.25rem rgb(var(--glow-color-rgb)/.25),0 0 2.5rem rgb(var(--glow-color-rgb)/.18),0 0 3.75rem rgb(var(--glow-color-rgb)/.12)}.glow-card.glow-enabled.dark-mode.glow-subtle:hover{box-shadow:0 0 .75rem rgb(var(--glow-color-rgb)/.18),0 0 1.5rem rgb(var(--glow-color-rgb)/.12)}.glow-card.glow-enabled.dark-mode.glow-medium:hover{box-shadow:0 0 1.5rem rgb(var(--glow-color-rgb)/.3),0 0 3rem rgb(var(--glow-color-rgb)/.22),0 0 4.5rem rgb(var(--glow-color-rgb)/.15)}.glow-card.glow-enabled.dark-mode.glow-intense:hover{box-shadow:0 0 2rem rgb(var(--glow-color-rgb)/.4),0 0 4rem rgb(var(--glow-color-rgb)/.3),0 0 6rem rgb(var(--glow-color-rgb)/.2)}.glow-card.dark-mode{background:var(--ion-card-background, #1e1e1e)}.glow-card.bordered{border:.0625rem solid var(--border-color, var(--ion-color-medium))}.glow-card.no-image{min-height:12.5rem}.glow-card.no-image .glow-card__content{padding:1.25rem 1.5rem;flex:1;justify-content:center}.glow-card.no-image .glow-card__title{font-size:1.75rem;line-height:1.2}.glow-card.no-image .glow-card__description{font-size:1rem;-webkit-line-clamp:4}@media (max-width: 768px){.glow-card{--card-border-radius: 1rem;--image-border-radius: .75rem}.glow-card__content{padding:.75rem 1rem 1rem}.glow-card__title{font-size:1rem}.glow-card__description{font-size:.8125rem;-webkit-line-clamp:2}.glow-card.no-image{min-height:11.25rem}.glow-card.no-image .glow-card__content{padding:1rem 1.25rem}.glow-card.no-image .glow-card__title{font-size:1.375rem}.glow-card.no-image .glow-card__description{font-size:.875rem}}@media (prefers-reduced-motion: reduce){.glow-card,.glow-card__image,.glow-card__cta,.glow-card__cta-text,.glow-card__cta-icon{transition:none}.glow-card:hover,.glow-card:hover .glow-card__image{transform:none}}\n"] }]
        }], ctorParameters: () => [], propDecorators: { preset: [{
                type: Input
            }], props: [{
                type: Input
            }], onClick: [{
                type: Output
            }] } });
//# sourceMappingURL=data:application/json;base64, 