div.field_with_errors {
    display: inline;
}

div.field_with_errors input[type="checkbox"] {
    border-color: rgba(252, 165, 165, 1);
}

/* Search Dropdown Styles */
.search-dropdown {
    animation: fadeIn 0.15s ease-out;
}

.search-dropdown-item {
    transition: background-color 0.1s ease-in-out;
}

.search-dropdown-item:hover {
    background-color: rgba(249, 250, 251, 1);
    /* gray-50 */
}

.search-dropdown-menu {
    animation: fadeIn 0.1s ease-out;
    box-shadow: 0 10px 15px -3px rgba(0, 0, 0, 0.1), 0 4px 6px -2px rgba(0, 0, 0, 0.05);
}

.search-dropdown-tab {
    transition: all 0.15s ease-in-out;
}

.search-dropdown-tab:hover {
    border-color: rgba(209, 213, 219, 1);
    /* gray-300 */
}

.search-dropdown-tab.active {
    color: rgba(37, 99, 235, 1);
    /* blue-600 */
    border-color: rgba(37, 99, 235, 1);
    /* blue-600 */
}

/* Mobile Notification Popup Styles */
#mobile-notification-popup,
#mobile-confirm-popup {
    animation: fadeIn 0.3s ease-out;
    backdrop-filter: blur(4px);
}

#mobile-notification-popup .bg-white,
#mobile-confirm-popup .bg-white {
    animation: slideUp 0.3s ease-out;
}

@keyframes slideUp {
    from {
        transform: translateY(20px);
        opacity: 0;
    }

    to {
        transform: translateY(0);
        opacity: 1;
    }
}

@keyframes fadeIn {
    from {
        opacity: 0;
    }

    to {
        opacity: 1;
    }
}

/* Mobile toggle switch styles */
.toggle-checkbox:checked {
    right: 0;
    border-color: #2563eb;
}

.toggle-checkbox:checked+.toggle-label {
    background-color: #2563eb;
}

.toggle-checkbox {
    transition: all 0.3s ease;
    top: 0;
}

.toggle-label {
    transition: all 0.3s ease;
}

/* Edit mode styles */
.search-dropdown-item.editing {
    background-color: rgba(239, 246, 255, 1);
    /* blue-50 */
    border-left: 4px solid rgba(59, 130, 246, 1);
    /* blue-500 */
}

/* Mobile responsive adjustments */
@media (max-width: 768px) {
    .search-dropdown.mobile-fixed {
        position: fixed !important;
        top: auto;
        /* Will be set dynamically by JavaScript */
        left: 0 !important;
        right: 0 !important;
        width: 100vw !important;
        max-width: none;
        z-index: 50;
        margin-top: 0;
    }

    /* Fallback for non-mobile-fixed dropdowns */
    .search-dropdown:not(.mobile-fixed) {
        left: -1rem;
        right: -1rem;
        max-width: none;
    }
}
