/**
 * Simple Search Widget Styles - Desktop & Mobile
 * Desktop: Full search bar | Mobile: Search icon with popup
 * Strong specificity to override Elementor
 */

/* ==========================================================================
   Base Wrapper - Better Elementor Override
   ========================================================================== */
.elementor-widget-amw-buscador-simple .amw-buscador-wrapper,
.amw-buscador-wrapper {
    display: block !important;
    position: relative !important;
    width: 100% !important;
    max-width: 400px !important;
    margin: 0 !important;
    padding: 0 !important;
    background: none !important;
    border: none !important;
    box-shadow: none !important;
}

/* ==========================================================================
   Desktop Search Bar - Force Override All Elementor Styles
   ========================================================================== */
.elementor-widget-amw-buscador-simple .amw-buscador-desktop,
.amw-buscador-wrapper .amw-buscador-desktop {
    position: relative !important;
    display: flex !important;
    align-items: center !important;
    width: 100% !important;
    max-width: none !important;
    margin: 0 !important;
    padding: 0 !important;
    background: none !important;
    border: none !important;
    box-shadow: none !important;
}

.elementor-widget-amw-buscador-simple .amw-buscador-input,
.amw-buscador-wrapper .amw-buscador-input {
    /* Force reset all inherited styles */
    all: unset !important;
    
    /* Force base styles */
    display: block !important;
    width: 100% !important;
    min-width: 200px !important;
    max-width: none !important;
    height: 40px !important;
    padding: 0 45px 0 16px !important;
    margin: 0 !important;
    
    /* Force typography */
    font-family: 'Basis Grotesque Arabic Pro', -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, sans-serif !important;
    font-size: 16px !important;
    font-weight: 400 !important;
    line-height: 40px !important;
    color: #000000 !important;
    text-align: left !important;
    letter-spacing: normal !important;
    text-decoration: none !important;
    text-transform: none !important;
    
    /* Force appearance */
    background-color: #ffffff !important;
    background-image: none !important;
    border: 1px solid #e5e7eb !important;
    border-radius: 20px !important;
    outline: none !important;
    box-shadow: 0 1px 2px 0 rgba(0, 0, 0, 0.05) !important;
    
    /* Force behavior */
    transition: all 0.2s ease !important;
    cursor: text !important;
    box-sizing: border-box !important;
    
    /* Force position reset */
    position: static !important;
    top: auto !important;
    left: auto !important;
    right: auto !important;
    bottom: auto !important;
    z-index: auto !important;
    transform: none !important;
}

.elementor-widget-amw-buscador-simple .amw-buscador-input::placeholder,
.amw-buscador-wrapper .amw-buscador-input::placeholder {
    color: #9ca3af !important;
    font-size: 16px !important;
    font-weight: 400 !important;
    opacity: 1 !important;
    text-transform: none !important;
    letter-spacing: normal !important;
}

.elementor-widget-amw-buscador-simple .amw-buscador-input:focus,
.amw-buscador-wrapper .amw-buscador-input:focus {
    border-color: #0C4581 !important;
    box-shadow: 0 0 0 3px rgba(12, 69, 129, 0.1) !important;
    outline: none !important;
}

.elementor-widget-amw-buscador-simple .amw-buscador-btn,
.amw-buscador-wrapper .amw-buscador-btn {
    /* Force reset all styles */
    all: unset !important;
    box-sizing: border-box !important;
    
    /* Force position */
    position: absolute !important;
    right: 4px !important;
    top: 4px !important;
    left: auto !important;
    bottom: auto !important;
    
    /* Force layout */
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    width: 32px !important;
    height: 32px !important;
    min-width: 32px !important;
    max-width: 32px !important;
    margin: 0 !important;
    padding: 0 !important;
    
    /* Force appearance */
    background-color: #0C4581 !important;
    background-image: none !important;
    border: none !important;
    border-radius: 16px !important;
    color: #ffffff !important;
    cursor: pointer !important;
    
    /* Force positioning */
    transform: none !important;
    z-index: 10 !important;
    
    /* Force transition */
    transition: all 0.2s ease !important;
}

.elementor-widget-amw-buscador-simple .amw-buscador-btn:hover,
.amw-buscador-wrapper .amw-buscador-btn:hover {
    background-color: #004388 !important;
    transform: scale(1.05) !important;
}

.elementor-widget-amw-buscador-simple .amw-buscador-btn:active,
.amw-buscador-wrapper .amw-buscador-btn:active {
    transform: scale(0.95) !important;
}

/* ==========================================================================
   Mobile Search Icon - Force Override
   ========================================================================== */
.elementor-widget-amw-buscador-simple .amw-buscador-mobile-toggle,
.amw-buscador-wrapper .amw-buscador-mobile-toggle {
    /* Force reset */
    all: unset !important;
    box-sizing: border-box !important;
    
    /* Force hidden by default */
    display: none !important;
    
    /* Force layout */
    align-items: center !important;
    justify-content: center !important;
    width: 32px !important;
    height: 32px !important;
    min-width: 32px !important;
    max-width: 32px !important;
    margin: 0 !important;
    padding: 0 !important;
    
    /* Force appearance - Simple icon button */
    background-color: #0C4581 !important;
    background-image: none !important;
    backdrop-filter: none !important;
    -webkit-backdrop-filter: none !important;
    border: none !important;
    border-radius: 50% !important;
    color: #ffffff !important;
    cursor: pointer !important;
    
    /* Force position reset */
    position: static !important;
    top: auto !important;
    left: auto !important;
    right: auto !important;
    bottom: auto !important;
    transform: none !important;
    z-index: auto !important;
    
    /* Force transition */
    transition: all 0.3s ease !important;
}

.elementor-widget-amw-buscador-simple .amw-buscador-mobile-toggle:hover,
.amw-buscador-wrapper .amw-buscador-mobile-toggle:hover {
    background-color: #004388 !important;
    transform: scale(1.1) !important;
}

.elementor-widget-amw-buscador-simple .amw-buscador-mobile-toggle:active,
.amw-buscador-wrapper .amw-buscador-mobile-toggle:active {
    transform: scale(0.95) !important;
}

/* ==========================================================================
   Mobile Search Popup - High Specificity Override
   ========================================================================== */
.elementor-widget-amw-buscador-simple .amw-buscador-mobile-popup,
.amw-buscador-wrapper .amw-buscador-mobile-popup {
    position: fixed !important;
    top: 0 !important;
    left: 0 !important;
    right: 0 !important;
    bottom: 0 !important;
    z-index: 9999 !important;
    
    /* Hidden by default */
    opacity: 0 !important;
    visibility: hidden !important;
    
    /* Background */
    background: linear-gradient(135deg, rgba(12, 69, 129, 0.97) 0%, rgba(12, 69, 129, 0.99) 100%) !important;
    backdrop-filter: blur(20px) !important;
    -webkit-backdrop-filter: blur(20px) !important;
    
    /* Layout */
    display: flex !important;
    align-items: flex-start !important;
    justify-content: center !important;
    padding: 20px !important;
    
    /* Animation */
    transform: translateY(-20px) !important;
    transition: all 0.4s cubic-bezier(0.4, 0, 0.2, 1) !important;
}

.elementor-widget-amw-buscador-simple .amw-buscador-mobile-popup.active,
.amw-buscador-wrapper .amw-buscador-mobile-popup.active {
    opacity: 1 !important;
    visibility: visible !important;
    transform: translateY(0) !important;
}

.elementor-widget-amw-buscador-simple .amw-buscador-mobile-content,
.amw-buscador-wrapper .amw-buscador-mobile-content {
    width: 100% !important;
    max-width: 480px !important;
    background: rgba(255, 255, 255, 0.95) !important;
    backdrop-filter: blur(12px) !important;
    -webkit-backdrop-filter: blur(12px) !important;
    border-radius: 16px !important;
    padding: 0 !important;
    margin: 60px 0 0 0 !important;
    box-shadow: 0 20px 25px -5px rgba(0, 0, 0, 0.3) !important;
}

.elementor-widget-amw-buscador-simple .amw-buscador-mobile-header,
.amw-buscador-wrapper .amw-buscador-mobile-header {
    display: flex !important;
    align-items: center !important;
    justify-content: space-between !important;
    padding: 20px 24px !important;
    border-bottom: 1px solid rgba(12, 69, 129, 0.1) !important;
}

.elementor-widget-amw-buscador-simple .amw-buscador-mobile-header h3,
.amw-buscador-wrapper .amw-buscador-mobile-header h3 {
    all: unset !important;
    font-family: 'Basis Grotesque Arabic Pro', sans-serif !important;
    font-size: 20px !important;
    font-weight: 600 !important;
    color: #0C4581 !important;
    margin: 0 !important;
    padding: 0 !important;
}

.elementor-widget-amw-buscador-simple .amw-buscador-mobile-close,
.amw-buscador-wrapper .amw-buscador-mobile-close {
    all: unset !important;
    box-sizing: border-box !important;
    
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    width: 40px !important;
    height: 40px !important;
    border-radius: 10px !important;
    cursor: pointer !important;
    
    background-color: rgba(12, 69, 129, 0.1) !important;
    color: #0C4581 !important;
    
    transition: all 0.3s ease !important;
}

.elementor-widget-amw-buscador-simple .amw-buscador-mobile-close:hover,
.amw-buscador-wrapper .amw-buscador-mobile-close:hover {
    background-color: rgba(12, 69, 129, 0.2) !important;
    transform: scale(1.05) !important;
}

.elementor-widget-amw-buscador-simple .amw-buscador-mobile-form,
.amw-buscador-wrapper .amw-buscador-mobile-form {
    padding: 24px !important;
    position: relative !important;
}

.elementor-widget-amw-buscador-simple .amw-buscador-mobile-input,
.amw-buscador-wrapper .amw-buscador-mobile-input {
    all: unset !important;
    box-sizing: border-box !important;
    
    display: block !important;
    width: 100% !important;
    height: 56px !important;
    padding: 0 60px 0 20px !important;
    
    font-family: 'Basis Grotesque Arabic Pro', sans-serif !important;
    font-size: 18px !important;
    font-weight: 400 !important;
    color: #0C4581 !important;
    
    background-color: #ffffff !important;
    border: 2px solid #e5e7eb !important;
    border-radius: 28px !important;
    outline: none !important;
    
    transition: all 0.3s ease !important;
}

.elementor-widget-amw-buscador-simple .amw-buscador-mobile-input::placeholder,
.amw-buscador-wrapper .amw-buscador-mobile-input::placeholder {
    color: #9ca3af !important;
    font-size: 18px !important;
}

.elementor-widget-amw-buscador-simple .amw-buscador-mobile-input:focus,
.amw-buscador-wrapper .amw-buscador-mobile-input:focus {
    border-color: #0C4581 !important;
    box-shadow: 0 0 0 4px rgba(12, 69, 129, 0.1) !important;
}

.elementor-widget-amw-buscador-simple .amw-buscador-mobile-btn,
.amw-buscador-wrapper .amw-buscador-mobile-btn {
    all: unset !important;
    box-sizing: border-box !important;
    
    position: absolute !important;
    right: 28px !important;
    top: 50% !important;
    transform: translateY(-50%) !important;
    
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    width: 48px !important;
    height: 48px !important;
    
    background-color: #0C4581 !important;
    border-radius: 24px !important;
    color: #ffffff !important;
    cursor: pointer !important;
    
    transition: all 0.3s ease !important;
}

.elementor-widget-amw-buscador-simple .amw-buscador-mobile-btn:hover,
.amw-buscador-wrapper .amw-buscador-mobile-btn:hover {
    background-color: #004388 !important;
    transform: translateY(-50%) scale(1.05) !important;
}

.elementor-widget-amw-buscador-simple .amw-buscador-mobile-btn:active,
.amw-buscador-wrapper .amw-buscador-mobile-btn:active {
    transform: translateY(-50%) scale(0.95) !important;
}

/* Mobile Overlay */
.elementor-widget-amw-buscador-simple .amw-buscador-mobile-overlay,
.amw-buscador-wrapper .amw-buscador-mobile-overlay {
    position: fixed !important;
    top: 0 !important;
    left: 0 !important;
    right: 0 !important;
    bottom: 0 !important;
    background-color: rgba(0, 0, 0, 0.5) !important;
    z-index: 9998 !important;
    
    opacity: 0 !important;
    visibility: hidden !important;
    transition: all 0.3s ease !important;
}

.elementor-widget-amw-buscador-simple .amw-buscador-mobile-overlay.active,
.amw-buscador-wrapper .amw-buscador-mobile-overlay.active {
    opacity: 1 !important;
    visibility: visible !important;
}

/* ==========================================================================
   Loading Spinner
   ========================================================================== */
.amw-buscador-spinner {
    display: none !important;
    width: 16px !important;
    height: 16px !important;
    border: 2px solid transparent !important;
    border-top: 2px solid currentColor !important;
    border-radius: 50% !important;
    animation: spin 1s linear infinite !important;
}

.amw-buscador-btn.loading .amw-buscador-spinner,
.amw-buscador-mobile-btn.loading .amw-buscador-spinner {
    display: block !important;
}

.amw-buscador-btn.loading svg,
.amw-buscador-mobile-btn.loading svg {
    display: none !important;
}

@keyframes spin {
    0% { transform: rotate(0deg); }
    100% { transform: rotate(360deg); }
}

/* ==========================================================================
   Display Mode Controls - User Choice
   ========================================================================== */

/* Always Desktop Mode - Force desktop display */
.amw-buscador-wrapper.amw-mode-desktop .amw-buscador-desktop {
    display: flex !important;
}

.amw-buscador-wrapper.amw-mode-desktop .amw-buscador-mobile-toggle {
    display: none !important;
}

/* Always Mobile Mode - Force mobile display */
.amw-buscador-wrapper.amw-mode-mobile .amw-buscador-desktop {
    display: none !important;
}

.amw-buscador-wrapper.amw-mode-mobile .amw-buscador-mobile-toggle {
    display: flex !important;
}

/* ==========================================================================
   Responsive Breakpoints - Only for Responsive Mode
   ========================================================================== */

/* Desktop: Show search bar, hide mobile icon (only for responsive mode) */
@media (min-width: 769px) {
    .amw-buscador-wrapper:not(.amw-mode-desktop):not(.amw-mode-mobile) .amw-buscador-desktop {
        display: flex !important;
    }
    
    .amw-buscador-wrapper:not(.amw-mode-desktop):not(.amw-mode-mobile) .amw-buscador-mobile-toggle {
        display: none !important;
    }
}

/* Mobile: Hide search bar, show mobile icon (only for responsive mode) */
@media (max-width: 768px) {
    .amw-buscador-wrapper:not(.amw-mode-desktop):not(.amw-mode-mobile) .amw-buscador-desktop {
        display: none !important;
    }
    
    .amw-buscador-wrapper:not(.amw-mode-desktop):not(.amw-mode-mobile) .amw-buscador-mobile-toggle {
        display: flex !important;
    }
}

/* Extra small screens */
@media (max-width: 480px) {
    .elementor-widget-amw-buscador-simple .amw-buscador-mobile-content,
    .amw-buscador-wrapper .amw-buscador-mobile-content {
        margin: 40px 10px 0 10px !important;
        width: calc(100% - 20px) !important;
    }
    
    .elementor-widget-amw-buscador-simple .amw-buscador-mobile-header,
    .amw-buscador-wrapper .amw-buscador-mobile-header {
        padding: 16px 20px !important;
    }
    
    .elementor-widget-amw-buscador-simple .amw-buscador-mobile-header h3,
    .amw-buscador-wrapper .amw-buscador-mobile-header h3 {
        font-size: 18px !important;
    }
    
    .elementor-widget-amw-buscador-simple .amw-buscador-mobile-form,
    .amw-buscador-wrapper .amw-buscador-mobile-form {
        padding: 20px !important;
    }
    
    .elementor-widget-amw-buscador-simple .amw-buscador-mobile-input,
    .amw-buscador-wrapper .amw-buscador-mobile-input {
        height: 52px !important;
        font-size: 16px !important;
        padding: 0 56px 0 18px !important;
    }
    
    .elementor-widget-amw-buscador-simple .amw-buscador-mobile-btn,
    .amw-buscador-wrapper .amw-buscador-mobile-btn {
        width: 44px !important;
        height: 44px !important;
        right: 24px !important;
    }
}

/* ==========================================================================
   Elementor Editor Compatibility - Force Override
   ========================================================================== */
.elementor-editor-active .amw-buscador-mobile-popup,
.elementor-editor-active .amw-buscador-mobile-overlay {
    display: none !important;
}

/* In Elementor editor: respect the responsive preview */
/* Desktop preview in editor: show search bar, hide mobile icon */
.elementor-editor-active:not([class*="elementor-device-mobile"]):not([class*="elementor-device-tablet"]) .amw-buscador-desktop {
    display: flex !important;
}

.elementor-editor-active:not([class*="elementor-device-mobile"]):not([class*="elementor-device-tablet"]) .amw-buscador-mobile-toggle {
    display: none !important;
}

/* Mobile/Tablet preview in editor: hide search bar, show mobile icon */
.elementor-editor-active[class*="elementor-device-mobile"] .amw-buscador-desktop,
.elementor-editor-active[class*="elementor-device-tablet"] .amw-buscador-desktop {
    display: none !important;
}

.elementor-editor-active[class*="elementor-device-mobile"] .amw-buscador-mobile-toggle,
.elementor-editor-active[class*="elementor-device-tablet"] .amw-buscador-mobile-toggle {
    display: flex !important;
    position: static !important;
}

/* Alternative approach - check the body classes that Elementor sets */
body.elementor-device-mobile .elementor-editor-active .amw-buscador-desktop,
body.elementor-device-tablet .elementor-editor-active .amw-buscador-desktop {
    display: none !important;
}

body.elementor-device-mobile .elementor-editor-active .amw-buscador-mobile-toggle,
body.elementor-device-tablet .elementor-editor-active .amw-buscador-mobile-toggle {
    display: flex !important;
    position: static !important;
}

body.elementor-device-desktop .elementor-editor-active .amw-buscador-desktop,
body:not(.elementor-device-mobile):not(.elementor-device-tablet) .elementor-editor-active .amw-buscador-desktop {
    display: flex !important;
}

body.elementor-device-desktop .elementor-editor-active .amw-buscador-mobile-toggle,
body:not(.elementor-device-mobile):not(.elementor-device-tablet) .elementor-editor-active .amw-buscador-mobile-toggle {
    display: none !important;
}

/* Additional Elementor editor responsive handling */
.elementor-editor-active .amw-buscador-wrapper {
    /* Force widget to respect device mode */
}

/* Use media queries as fallback for Elementor editor */
@media (max-width: 767px) {
    .elementor-editor-active .amw-buscador-desktop {
        display: none !important;
    }
    
    .elementor-editor-active .amw-buscador-mobile-toggle {
        display: flex !important;
        position: static !important;
    }
}

@media (min-width: 768px) {
    .elementor-editor-active .amw-buscador-desktop {
        display: flex !important;
    }
    
    .elementor-editor-active .amw-buscador-mobile-toggle {
        display: none !important;
    }
}

/* Specific override for when Elementor editor is in responsive preview iframe */
.elementor-device-mobile .elementor-editor-active .amw-buscador-desktop,
.elementor-device-tablet .elementor-editor-active .amw-buscador-desktop {
    display: none !important;
}

.elementor-device-mobile .elementor-editor-active .amw-buscador-mobile-toggle,
.elementor-device-tablet .elementor-editor-active .amw-buscador-mobile-toggle {
    display: flex !important;
    position: static !important;
}