/* CSS Fixes for Graphical Glitches */

/* Fix for theme toggle button positioning conflicts */
.theme-toggle-btn {
    position: fixed !important;
    top: 20px !important;
    right: 20px !important;
    z-index: 10000 !important;
    pointer-events: auto !important;
}

/* Ensure proper stacking context */
.header {
    z-index: 999 !important;
    position: relative;
}

/* Fix for mobile menu positioning */
@media (max-width: 768px) {
    .header-container {
        position: relative;
    }
    
    .nav.mobile-open {
        z-index: 998 !important;
    }
}

/* Fix for animation conflicts */
.animation-fade-in,
.animation-slide-in,
.animation-bounce,
.animation-pulse,
.animation-wiggle,
.animation-glow {
    transition: none !important;
    animation-fill-mode: both;
}

/* Fix for Yash animation positioning */
.yash-animation {
    display: inline-block !important;
    vertical-align: middle !important;
    margin-left: 10px !important;
}

/* Fix for copy button positioning */
.copy-btn {
    position: absolute !important;
    top: 15px !important;
    right: 15px !important;
    z-index: 10 !important;
}

/* Fix for detail prompt container */
.detail-prompt {
    position: relative !important;
    overflow: visible !important;
}

/* Fix for card hover effects */
.prompt-card,
.category-card {
    transform: translateZ(0);
    backface-visibility: hidden;
    perspective: 1000px;
}

/* Fix for search input focus */
.search-input:focus {
    z-index: 1;
    position: relative;
}

/* Fix for dropdown positioning */
.category-filter {
    position: relative;
    z-index: 1;
}

/* Fix for toast notifications */
.toast {
    z-index: 10001 !important;
    position: fixed !important;
    pointer-events: none;
}

/* Fix for pagination */
.pagination {
    display: flex;
    justify-content: center;
    align-items: center;
    flex-wrap: wrap;
    gap: 10px;
}

/* Fix for breadcrumb */
.breadcrumb {
    display: flex;
    align-items: center;
    flex-wrap: wrap;
    gap: 5px;
}

/* Fix for share buttons */
.share-buttons {
    position: relative;
    z-index: 1;
}

/* Fix for form elements */
input,
select,
textarea {
    position: relative;
    z-index: 1;
}

/* Fix for button elements */
button,
.btn {
    position: relative;
    z-index: 1;
}

/* Fix for image loading */
.prompt-image,
.detail-image {
    display: block;
    width: 100%;
    height: auto;
    object-fit: cover;
}

/* Fix for grid layouts */
.categories-grid,
.prompts-grid {
    display: grid;
    gap: 20px;
    width: 100%;
}

/* Fix for flex layouts */
.header-container,
.nav,
.detail-meta,
.share-links {
    display: flex;
    align-items: center;
}

/* Fix for text overflow */
.prompt-title,
.category-name {
    word-wrap: break-word;
    overflow-wrap: break-word;
    hyphens: auto;
}

/* Fix for mobile viewport */
@media (max-width: 768px) {
    .theme-toggle-btn {
        top: 15px !important;
        right: 15px !important;
    }
    
    .header {
        position: sticky !important;
        top: 0 !important;
    }
    
    .main {
        margin-top: 0 !important;
    }
}

/* Fix for very small screens */
@media (max-width: 480px) {
    .theme-toggle-btn {
        width: 40px !important;
        height: 40px !important;
        font-size: 16px !important;
        top: 10px !important;
        right: 10px !important;
    }
    
    .header-container {
        padding: 10px 15px !important;
    }
    
    .main {
        padding: 15px 10px !important;
    }

    /* Nudge copy button up on detail page */
    .detail-prompt .copy-btn {
        top: 8px !important;
    }

    /* Stack search panel vertically on small screens */
    .nav {
        width: 100% !important;
        display: block !important;
        flex-direction: column !important;
        align-items: stretch !important;
        gap: 8px !important;
    }
    .search-container {
        display: flex !important;
        flex-direction: column !important;
        gap: 8px !important;
        width: 100% !important;
    }
    .search-input,
    .search-btn,
    .category-filter,
    .mobile-menu-btn {
        width: 100% !important;
    }
}

/* Fix for print styles */
@media print {
    .theme-toggle-btn,
    .mobile-menu-btn,
    .search-container,
    .share-buttons {
        display: none !important;
    }
}

/* Fix for reduced motion */
@media (prefers-reduced-motion: reduce) {
    .theme-toggle-btn,
    .prompt-card,
    .category-card,
    .btn,
    .share-btn {
        transition: none !important;
        animation: none !important;
    }
}

/* Fix for high contrast mode */
@media (prefers-contrast: high) {
    .theme-toggle-btn {
        border: 2px solid currentColor !important;
    }
    
    .prompt-card,
    .category-card {
        border: 2px solid currentColor !important;
    }
}