/**
 * Elessi Theme Compatibility Styles
 * Ensures seamless integration with Elessi theme design
 */

/* ============================================
   CSS Variables from Elessi Theme
   ============================================ */

:root {
    /* Use Elessi colors if available, fallback to Livora defaults */
    --livora-primary: var(--nasa-primary-color, #2271b1);
    --livora-secondary: var(--nasa-secondary-color, #135e96);
    --livora-accent: var(--nasa-accent-color, #00a32a);
    --livora-border-radius: var(--nasa-border-radius, 8px);
    --livora-spacing: var(--nasa-spacing, 8px);
    --livora-font-family: var(--nasa-font-family, inherit);
}

/* ============================================
   Design Consistency
   ============================================ */

/* Ensure Livora popups match Elessi design */
.livora-popup,
.livora-modal {
    border-radius: var(--livora-border-radius);
    font-family: var(--livora-font-family);
}

/* Match Elessi button styles */
.livora-button,
.livora-btn {
    border-radius: var(--livora-border-radius);
    transition: all 0.3s ease;
}

.livora-button-primary {
    background-color: var(--livora-primary);
    color: #ffffff;
}

.livora-button-primary:hover {
    background-color: var(--livora-secondary);
}

/* Match Elessi card styles */
.livora-card,
.livora-feature-card {
    border-radius: var(--livora-border-radius);
    box-shadow: 0 2px 8px rgba(0, 0, 0, 0.1);
}

/* ============================================
   Conflict Prevention
   ============================================ */

/* Hide Livora exit intent if Elessi's is active */
body.elessi-exit-intent-active .livora-exit-intent-popup {
    display: none !important;
}

/* Coordinate sticky cart bars */
body.elessi-sticky-cart-active .livora-sticky-cart-bar {
    z-index: 998; /* Below Elessi's if both active */
}

/* Prevent double countdown timers */
.elessi-countdown-active ~ .livora-countdown-timer {
    display: none;
}

/* ============================================
   RTL Support
   ============================================ */

.rtl .livora-popup,
.rtl .livora-modal {
    direction: rtl;
    text-align: right;
}

.rtl .livora-button {
    margin-left: var(--livora-spacing);
    margin-right: 0;
}

/* ============================================
   Mobile Optimization
   ============================================ */

@media (max-width: 768px) {
    /* Ensure compatibility with Elessi mobile styles */
    .livora-popup,
    .livora-modal {
        width: 95vw;
        max-width: 95vw;
    }
}

/* ============================================
   Animation Coordination
   ============================================ */

/* Use Elessi's animation timing if available */
@keyframes livoraFadeIn {
    from {
        opacity: 0;
        transform: translateY(-10px);
    }
    to {
        opacity: 1;
        transform: translateY(0);
    }
}

.livora-popup.active,
.livora-modal.active {
    animation: livoraFadeIn 0.3s ease;
}

/* ============================================
   Color Sync
   ============================================ */

/* Sync colors when option is enabled */
body.livora-elessi-color-sync .livora-popup {
    --livora-primary: var(--nasa-primary-color);
    --livora-secondary: var(--nasa-secondary-color);
    --livora-accent: var(--nasa-accent-color);
}

/* ============================================
   Feature-Specific Compatibility
   ============================================ */

/* Exit Intent Popup */
.livora-exit-intent-popup {
    font-family: var(--livora-font-family);
}

.livora-exit-intent-popup .livora-popup-content {
    border-radius: var(--livora-border-radius);
}

/* Countdown Timer */
.livora-countdown-timer {
    font-family: var(--livora-font-family);
}

/* Sticky Cart Bar */
.livora-sticky-cart-bar {
    font-family: var(--livora-font-family);
    box-shadow: 0 -2px 10px rgba(0, 0, 0, 0.1);
}

/* Social Proof */
.livora-social-proof-widget {
    font-family: var(--livora-font-family);
    border-radius: var(--livora-border-radius);
}

/* Trust Badges */
.livora-trust-badge {
    font-family: var(--livora-font-family);
    border-radius: calc(var(--livora-border-radius) / 2);
}

/* ============================================
   Print Styles
   ============================================ */

@media print {
    .livora-popup,
    .livora-modal,
    .livora-sticky-cart-bar {
        display: none !important;
    }
}