/**
 * Nova AI Plugin <-> AILinux Nova Dark Theme Bridge
 * Synchronizes CSS variables and ensures consistent styling
 */

/* ============================================
   THEME VARIABLE MAPPING
   Inherits from Theme's CSS Variables
   ============================================ */
.nova-ai {
    /* Map theme variables to plugin variables */
    --nova-bg-0: var(--bg-0, #0d0d0d);
    --nova-bg-1: var(--bg-1, #131822);
    --nova-bg-2: var(--bg-2, #1a1a1a);
    --nova-surface: var(--surface, #1b2330);
    --nova-border: var(--border, #2a2a2a);
    --nova-text: var(--text, #e5e5e5);
    --nova-text-muted: var(--muted, #a9b3c0);
    --nova-accent: var(--accent, #10a37f);
}

/* ============================================
   SHORTCODE PAGE LAYOUT
   Full viewport usage for [ailinux_ai_playground]
   ============================================ */
.page-template-default .entry-content:has(.nova-ai),
.single .entry-content:has(.nova-ai),
body.page .entry-content:has(.nova-ai) {
    max-width: none;
    padding: 0;
    margin: 0;
}

/* Ensure container uses full width */
.nova-ai-wrapper,
.entry-content > .nova-ai {
    width: 100%;
    max-width: 100%;
    margin: 0 auto;
}

/* Full-width mode for dedicated AI pages */
body.page-ai-playground .site-main,
body.page-nova-ai .site-main {
    padding: 0;
    max-width: 100%;
}

body.page-ai-playground .entry-content,
body.page-nova-ai .entry-content {
    padding: 0 16px;
}

/* ============================================
   RESPONSIVE PAGE ADJUSTMENTS
   ============================================ */
@media (max-width: 768px) {
    /* Remove page padding on mobile for full-width experience */
    body.page .entry-content:has(.nova-ai) {
        padding-left: 0;
        padding-right: 0;
    }
    
    .entry-content > .nova-ai {
        border-radius: 0;
        border-left: none;
        border-right: none;
    }
}

/* ============================================
   HEADER/FOOTER SPACING ADJUSTMENTS
   ============================================ */
.site-main:has(.nova-ai) {
    padding-bottom: 0;
}

/* Ensure footer doesn't overlap */
.site-footer {
    position: relative;
    z-index: 1;
}

/* ============================================
   THEME-SPECIFIC OVERRIDES
   ============================================ */

/* Match theme's Inter font */
.nova-ai {
    font-family: 'Inter', -apple-system, BlinkMacSystemFont, 'Segoe UI', sans-serif;
}

/* Match theme's focus states */
.nova-ai *:focus-visible {
    outline: 2px solid var(--nova-accent);
    outline-offset: 2px;
}

/* Match theme's button hover transitions */
.nova-ai button,
.nova-ai .nova-btn {
    transition: all 0.2s cubic-bezier(0.4, 0, 0.2, 1);
}

/* ============================================
   PRINT STYLES
   ============================================ */
@media print {
    .nova-ai {
        box-shadow: none;
        border: 1px solid #ddd;
    }
    
    .nova-bar,
    .nova-foot,
    #nova-fullscreen {
        display: none !important;
    }
}

/* ============================================
   HIGH CONTRAST MODE SUPPORT
   ============================================ */
@media (prefers-contrast: high) {
    .nova-ai {
        --nova-border: #666;
        border-width: 2px;
    }
    
    .nova-tab.on {
        outline: 2px solid currentColor;
    }
}

/* ============================================
   DARK/LIGHT MODE SYNC
   Syncs with Theme's color mode toggle
   ============================================ */
html[data-theme='light'] .nova-ai {
    --nova-bg-0: var(--bg-0, #f5f7fb);
    --nova-bg-1: var(--bg-1, #ffffff);
    --nova-bg-2: var(--bg-2, #f0f4ff);
    --nova-surface: var(--surface, #ffffff);
    --nova-border: var(--border, #e2e8f0);
    --nova-text: var(--text, #0f141b);
    --nova-text-muted: var(--muted, #6b7280);
}
