/**
 * ACPS - Advanced Ajax Content and PDF Search
 * Frontend Styles - YOOtheme/UIkit Integration
 * 
 * This stylesheet uses UIkit CSS custom properties from YOOtheme
 * and only adds plugin-specific styles where needed.
 */

/* ========================================
   Base / Reset
   ======================================== */

.acps-search-wrap {
    --acps-max-height: 400px;
}

/* ========================================
   Loading Indicator
   ======================================== */

.acps-loading-indicator {
    display: none;
    align-items: center;
}

.acps-loading-indicator.acps-loading-active {
    display: flex;
}

/* Navbar layout loading - inline */
.acps-layout-navbar .acps-loading-indicator {
    position: absolute;
    right: 10px;
    top: 50%;
    transform: translateY(-50%);
}

.acps-layout-navbar .acps-search-form {
    position: relative;
}

/* ========================================
   Results Container
   ======================================== */

.acps-results-container:empty {
    display: none;
}

/* Snippet highlight - use YOOtheme's mark color if available */
.acps-results-container mark {
    background-color: var(--global-primary-background, rgba(30, 135, 240, 0.2));
    color: inherit;
    padding: 0.1em 0.2em;
    border-radius: 2px;
}

/* ========================================
   Results Style: Compact
   ======================================== */

.acps-results-compact .acps-results-container {
    margin-top: 10px;
}

.acps-results-compact .uk-label {
    font-size: 10px;
    padding: 2px 6px;
    vertical-align: middle;
}

.acps-results-compact .uk-label-muted {
    background-color: var(--global-muted-background, #f8f8f8);
    color: var(--global-muted-color, #999);
}

/* ========================================
   Results Style: Dropdown
   ======================================== */

.acps-results-dropdown {
    position: relative;
}

.acps-results-dropdown .acps-results-container {
    position: absolute;
    top: 100%;
    left: 0;
    right: 0;
    z-index: 1000;
    margin-top: 5px;
    background: var(--global-background, #fff);
    border: 1px solid var(--global-border, #e5e5e5);
    border-radius: var(--global-border-radius, 0);
    box-shadow: var(--global-large-box-shadow, 0 5px 15px rgba(0,0,0,0.08));
    max-height: var(--acps-max-height, 400px);
    overflow-y: auto;
    opacity: 0;
    visibility: hidden;
    transform: translateY(-10px);
    transition: opacity 0.2s, transform 0.2s, visibility 0.2s;
}

.acps-results-dropdown .acps-results-container.acps-dropdown-visible {
    opacity: 1;
    visibility: visible;
    transform: translateY(0);
}

.acps-results-dropdown .acps-results-section {
    padding: 15px;
    border-bottom: 1px solid var(--global-border, #e5e5e5);
}

.acps-results-dropdown .acps-results-section:last-child {
    border-bottom: none;
}

.acps-results-dropdown .uk-heading-line {
    margin-top: 0;
}

.acps-results-dropdown .uk-label {
    font-size: 10px;
    padding: 2px 6px;
}

/* Dropdown scrollbar styling */
.acps-results-dropdown .acps-results-container::-webkit-scrollbar {
    width: 6px;
}

.acps-results-dropdown .acps-results-container::-webkit-scrollbar-track {
    background: var(--global-muted-background, #f8f8f8);
}

.acps-results-dropdown .acps-results-container::-webkit-scrollbar-thumb {
    background: var(--global-border, #e5e5e5);
    border-radius: 3px;
}

.acps-results-dropdown .acps-results-container::-webkit-scrollbar-thumb:hover {
    background: var(--global-muted-color, #999);
}

/* ========================================
   Results Style: Columns
   ======================================== */

.acps-results-columns .uk-heading-line {
    margin-bottom: 15px;
}

/* ========================================
   Card hover effects using YOOtheme vars
   ======================================== */

.acps-results-container .uk-card-hover:hover {
    box-shadow: var(--global-medium-box-shadow, 0 5px 15px rgba(0,0,0,0.08));
}

/* ========================================
   Hero Layout Adjustments
   ======================================== */

.acps-layout-hero .acps-results-container {
    margin-top: 20px;
}

.acps-layout-hero .uk-card .acps-results-section {
    margin-top: 0;
}

/* ========================================
   PDF Label - Red accent
   ======================================== */

.uk-label-danger,
.acps-results-container .uk-label-danger {
    background-color: var(--global-danger-background, #f0506e);
}

/* ========================================
   Responsive Adjustments
   ======================================== */

@media (max-width: 640px) {
    .acps-layout-default .uk-grid > .uk-width-auto,
    .acps-layout-large .uk-grid > .uk-width-auto {
        width: 100%;
    }
    
    .acps-layout-default .uk-grid > .uk-width-auto .uk-button,
    .acps-layout-large .uk-grid > .uk-width-auto .uk-button {
        width: 100%;
    }
}

/* ========================================
   Accessibility
   ======================================== */

@media (prefers-reduced-motion: reduce) {
    .acps-results-dropdown .acps-results-container {
        transition: none;
    }
}

/* Focus visible for keyboard navigation */
.acps-search-input:focus-visible {
    outline: 2px solid var(--global-primary-background, #1e87f0);
    outline-offset: 2px;
}

/* ========================================
   Fallback styles when UIkit not loaded
   ======================================== */

/* Only apply if .uk-input doesn't have styles (UIkit not loaded) */
@supports not (--test: 1) {
    .acps-search-input {
        width: 100%;
        padding: 10px 15px;
        border: 1px solid #e5e5e5;
        border-radius: 4px;
        font-size: 16px;
    }
    
    .acps-search-btn {
        padding: 10px 20px;
        background: #1e87f0;
        color: #fff;
        border: none;
        border-radius: 4px;
        cursor: pointer;
    }
}